openlayers学习一

openlayers是开源webgis，

先去官网下载 OpenLayers - Get the Code

新建html，写入如下代码：

<head>
<script src = "../build/ol.js"></script>
</head>
<body>

<div id="map" class="map"></div>

<script>
    var map = new ol.Map({
        layers: [
            new ol.layer.Vector({
                //这是一个能选择的地图源
                source: new ol.source.Vector({
                    url: 'geojson/countries.geojson',
                    projection: 'EPSG:3857',
                    format: new ol.format.GeoJSON()
                })
            })
        ],
            
        target: 'map',
        view: new ol.View({
            center: [0, 0],
            zoom: 2
        })
    });
</script>

</body>

这里先加入ol.js，建立ol.Map类，三要素，layers，target，view

ol.layers.Vector为矢量图层，这里有个坑，

会报错：from origin null has been blocked by cors policy: cross origin requests are only supported for protocol schemes:

需要做处理 在chrome浏览器快捷方式， 点击右键属性，快捷方式目标填入

-allow-file-access-from-files

然后，就行了

 

posted @ 2022-01-15 13:19  fkess  阅读(90)  评论(0)    收藏  举报