码迷,mamicode.com
首页 > Web开发 > 详细

leaflet入门(三)使用GeoJSON创建矢量图形

时间:2017-07-27 18:29:20      阅读:4136      评论:0      收藏:0      [点我收藏+]

标签:style   layer   point   code   log   地图   事件   weight   each   

点对象:

function g(feature, layer) {
            // does this feature have a property named popupContent?
            if (feature.properties && feature.properties.popupContent) {
                layer.bindPopup(feature.properties.popupContent);
            }
        }

        var geojsonFeature = {
            "type": "Feature",
            "properties": {
                "name": "Coors Field",
                "amenity": "Baseball Stadium",
                "popupContent": "This is where the Rockies play!"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [100, 31]
            }
        };

        L.geoJSON(geojsonFeature, {
            onEachFeature: g
        }).addTo(map);

线要素:

var draw_line = {
            "type": "Feature",
            "geometry": {
                "type": "LineString",
                "coordinates": [
                    [110, 11],
                    [110, 49]
                ]
            },
            "properties": {
                "popupContent": "This is a free bus line that will take you across downtown.",
                "underConstruction": true
            },
            "id": 2
        };

//绑定事件
function f(feature, layer) {
    layer.bindPopup(feature.properties.popupContent);
}

//增加到地图
var ss = L.geoJson(draw_line, {
    style: {
        "color": ‘black‘,
        "weight": 1
    },
    onEachFeature: f
}).addTo(map);

 

leaflet入门(三)使用GeoJSON创建矢量图形

标签:style   layer   point   code   log   地图   事件   weight   each   

原文地址:http://www.cnblogs.com/tinaluo/p/7245850.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!