SuperMap iClient for OpenLayers使用geojson数据裁剪地图

最新推荐文章于 2025-06-05 12:00:27 发布

momo323636

最新推荐文章于 2025-06-05 12:00:27 发布

阅读量435

点赞数 6

CC 4.0 BY-SA版权

文章标签：信息可视化前端

本文链接：https://blog.csdn.net/m0_45826980/article/details/144193909

1.初始化地图信息

var map = new ol.Map({
    target: 'map',
    controls: ol.control.defaults({attributionOptions: {collapsed: false}})
        .extend([new ol.supermap.control.Logo()]),
    view: new ol.View({
        center: [113, 33],
        zoom: 8,
        projection: 'EPSG:4326'
    })
});

2.添加底图

var cityNameLayer = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: url,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});
map.addLayer(cityNameLayer);

3.加载geojson数据

var geoLayer = new ol.layer.Vector({
        source: new ol.source.Vector({
            //换成你的地址
            url: '../data/河南省.json',
            format: new ol.format.GeoJSON()
        }),
        style: new ol.style.Style({
          stroke: new ol.style.Stroke({
            color: "ff0000", 
            width: 2, 
          }),
        }),
          fill: new ol.style.Fill({
            color: "ff0000", 
          }),
        
    })
    map.addLayer(geoLayer);