![](/img/trans.png)
[英]Increase size of custom markers while zooming in? Using Google Maps and GeoJSON
[英]Custom markers for points from a geoJson file with Google Maps
我正在使用GeoJSON作為Google地圖的數據源。 我正在使用API的v3來創建數據層,如下所示:
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
var map;
function initialize() {
//Initialise the map
var myLatLng = new google.maps.LatLng(53.231472,-0.539783);
map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 17,
center: myLatLng,
scrollwheel: false,
panControl: false,
zoomControl: false,
scaleControl: true,
disableDefaultUI: true
});
//Initialise base folder for icons
var iconBase = '/static/images/icons/';
//Load the JSON to show places
map.data.loadGeoJson('/api/geo');
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map-canvas"></div>
我的GeoJSON數據的來源如下:
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"icon": "/static/images/icons/map-marker-do.png",
"coordinates": [
-0.53743,
53.23437
]
},
"properties": {
"name": "Cathedral",
"description": "One of Europe’s finest Gothic buildings, once the tallest building in the world that dominates Lincoln's skyline.",
"icon": "/static/images/icons/map-marker-do.png"
}
}
]
}
我要做的是讓地圖上的標記圖標來自JSON中的“icon”屬性,但無法弄清楚如何獲取數據來更改默認標記。 有人可以提供任何建議嗎? 謝謝。
使用樣式功能(樣式功能使您可以根據特定功能應用樣式)
map.data.setStyle(function(feature) {
return {icon:feature.getProperty('icon')};
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.