Leaflet使⽤vectortiles样式设置
//point style
var myIcon = L.icon({
iconUrl: 'css/images/dian.svg',
//      shadowUrl: 'css/images/leaf-shadow.png',
iconSize:    [50, 50], // size of the icon
//      shadowSize:  [50, 64], // size of the shadow
iconAnchor:  [10, 50], // point of the icon which will correspond to marker's location
//      shadowAnchor: [4, 62],  // the same for the shadow
//      popupAnchor:  [-3, -76] // point from which the popup should open relative to the iconAnchor
});
svg canvas
/
/样式设定
var vectorTileStyling = {
//layer样式,line没有fill属性
gj:{//layername
weight: 1,
color: '#cf52d3',
opacity: 0.6
},
//使⽤⾃定义icon
//          point:{//layername
//
/
/              weight: 1,
//              icon: myIcon//⾃定义icon
//          },
//点
//⽅法⼀
point:{//layername
weight: 2,
color: 'red',
opacity: 1,
fillColor: 'yellow',
fill: true,
radius: 6,
fillOpacity: 0.7
},
//⽅法⼆
//          point: function(properties, zoom) {
//              return {
//                  weight: 2,
//                  color: 'red',
//                  opacity: 1,
//                  fillColor: 'yellow',
//                  fill: true,
/
/                  radius: 6,
//                  fillOpacity: 0.7
//              }
//          },
//线
line:{//layername
weight:1,
color: '#f2b648',//颜⾊
fillColor: 'red',
fillOpacity:0,//填充透明度
dashArray: '5'  //设置虚线
},
//⾯
polygon:{//layername
weight: 1,//边线宽度
fillColor: '#53e033',//填充颜⾊
color: 'red',//边线颜⾊
fill: true,
fillOpacity: 0.2,//填充颜⾊透明度
fillOpacity: 0.2,//填充颜⾊透明度
opacity: 0.4,//边线颜⾊透明度
}
};
//vector tile pointpbflayer
var pointUrl = "127.0.0.1:8080/geoserver/gwc/service/tms/1.0.0/test:point@EPSG:4326@pbf/{z}/{x}/{-y}.pbf";        var pointVectorTileOptions = {
rendererFactory: L.canvas.tile,
vectorTileLayerStyles: vectorTileStyling,
interactive: true,  // Make sure that this VectorGrid fires mouse/pointer events
getFeatureId: function(f) {
//                console.log("getFeatureId:"+f.properties.ID);
return f.properties.ID;
}
};
}).addTo(map);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。