SuperMap iClient for Leaflet入门学习

最新推荐文章于 2024-06-22 18:41:23 发布

bcbobo21cn

最新推荐文章于 2024-06-22 18:41:23 发布

阅读量981

点赞数

分类专栏： GIS 文章标签： Leaflet iClient 超图 webGIS

本文链接：https://blog.csdn.net/bcbobo21cn/article/details/111398528

版权

GIS 专栏收录该内容

166 篇文章 21 订阅

订阅专栏

Leaflet是一个开源的地图Javascript库；

SuperMap iClient for Leaflet 在线示例；
https://iclient.supermap.io/examples/leaflet/editor.html#03_themeGraduatedSymbol

下面来看一个入门例子；
显示一幅中国地图；
在这里插入图片描述
代码；

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/include-web.js"></script>
</head>
<body>
<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
<script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
<script type="text/javascript">
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var map, 
        url = host + "/iserver/services/map-china400/rest/maps/China";
    map = L.map('map', {
        center: [39, 100],
        maxZoom: 18,
        zoom: 4
    });
    L.supermap.tiledMapLayer(url).addTo(map);

</script>
</body>
</html>

看上去语法和iClient for javascript不同；
创建地图控件使用 map = L.map(‘map’, …);
中心点，center: [39, 100],
缩放级别；
maxZoom: 18,
zoom: 4
添加一个基本图层使用L.supermap.tiledMapLayer类的addTo()方法；url是发布出来的服务网址；
L.supermap.tiledMapLayer(url).addTo(map);