将geojson标记加载到mapbox设置自定义图标图像
我对mapbox/传单还不熟悉，我认为这是一个相当基本的问题，我在过去两天里一直在努力解决，尽管我已经尝试了几种方法，但我还是无法完全理解。
我正在通过geojson加载标记：
var ma_3 = L.mapbox.featureLayer().loadURL('./data/marathon/marker3x.geojson');
然后尝试根据Geojson数据中使用的标题更改大小或颜色等属性：
ma_3.on('ready', function(layer) {
this.eachLayer(function(marker) {
if (marker.toGeoJSON().properties.title === 'Verpflegung') {
marker.setIcon(L.mapbox.marker.icon({
"marker-size": 'large'
}));
} else {
marker.setIcon(L.mapbox.marker.icon({}));
}
marker.bindPopup(marker.toGeoJSON().properties.id + ', ' +
marker.toGeoJSON().properties.title);
});
})
.addTo(baseMap);
geojson如下所示：
{
"type": "Feature",
"properties": {
"id": "marker-ie2tbbh05",
"title": "Verpflegung",
"description": "",
"marker-size": "medium",
"marker-color": "#b7ddf3",
"marker-symbol": "marker-stroked"
},
"geometry": {
"type": "Point",
"coordinates": [
6.431395,
51.19433
]
},
我错过了什么吗，因为我也试图通过使用
var icon_live = L.icon({ iconUrl: './img/icon-live.png', iconSize: [35,35] });
setIcon函数中的某个地方，但似乎没有工作。如果有人能给我指出正确的方向。这真的很合适。
共有2个答案
你看过这个例子吗？
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Custom marker icons</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.mapbox.com/mapbox.js/v2.2.2/mapbox.js'></script>
<link href='https://api.mapbox.com/mapbox.js/v2.2.2/mapbox.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<div id='map'></div>
<script>
L.mapbox.accessToken = '<your access token here>';
var map = L.mapbox.map('map', 'mapbox.streets')
.setView([40, -74.50], 8);
var myLayer = L.mapbox.featureLayer().addTo(map);
var geoJson = [{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-75.00, 40]
},
"properties": {
"title": "Small astronaut",
"icon": {
"iconUrl": "/mapbox.js/assets/images/astronaut1.png",
"iconSize": [50, 50], // size of the icon
"iconAnchor": [25, 25], // point of the icon which will correspond to marker's location
"popupAnchor": [0, -25], // point from which the popup should open relative to the iconAnchor
"className": "dot"
}
}
}, {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-74.00, 40]
},
"properties": {
"title": "Big astronaut",
"icon": {
"iconUrl": "/mapbox.js/assets/images/astronaut2.png",
"iconSize": [100, 100],
"iconAnchor": [50, 50],
"popupAnchor": [0, -55],
"className": "dot"
}
}
}];
// Set a custom icon on each marker based on feature properties.
myLayer.on('layeradd', function(e) {
var marker = e.layer,
feature = marker.feature;
marker.setIcon(L.icon(feature.properties.icon));
});
// Add features to the map.
myLayer.setGeoJSON(geoJson);
</script>
</body>
</html>
*来源：https://www.mapbox.com/mapbox.js/example/v1.0.0/custom-marker/
我想这是一个典型的初学者错误，可能只是我自己的错误，但我发现在哪种情况下使用setIcon的几个选项相当混乱。最后，我使用.on（layeradd）和marker.setIcon（pathToYourIcon）使它工作起来。
ma_3.on('layeradd', function(layer) {
this.eachLayer(function(marker) {
if (marker.toGeoJSON().properties.title === 'Verpflegung') {
marker.setIcon(icon_live);
}
marker.bindPopup(marker.toGeoJSON().properties.id + ', ' +
marker.toGeoJSON().properties.title);
});
});
-
我试图弄清楚如何将lon/lat坐标上的GeoJSON列表加载到MapBox地图中。我想我已经很接近了，我只是不能让它真正起作用。 我在这里设置了一个演示页面：http://sandbox.charliehield.com/mapbox/ 这是GeoJSON文件： 超文本标记语言很简单： 和JS：
-
我在视图中使用mapbox，需要从JSON添加多个标记 这是我的JSON 下面是我如何运行脚本添加地图到视图 但是我想知道，我如何需要添加标记到map（对于json中的每个元素，我需要获得lat和lon）来映射。因为医生说我需要这样的Json var Geojson={type：'FeatureCollection'，特性：[{type：'Feature'，几何：{type：'Point'，坐标：
-
所以我想在我的android应用程序中添加自定义视图标记，我从API请求中获取坐标，我想在各自的标记上显示位置的徽标。我正在从同一个API请求获取标记的URL。此外，我希望所有标记都是单个符号层的一部分，因为我也想对这些标记进行聚类。图片来源：谷歌图片搜索。
-
我不熟悉plotly，我正在使用px创建甘特图。时间表。我的数据集中有三类数据，一类是具有开始和结束时间的普通任务，另一类是开始和结束时间相同的两种类型的任务。我希望普通任务是一个矩形（这是如何绘制的），其他两个任务有一个沙漏标记和一个三角形标记，而不是一条很细的线？ 这是我的数据的样子： 样本数据： 代码： 例子： Excel中的样本图 我有什么办法可以做到这一点吗？ 谢谢！
-
我使用下面的布局实现了一个加载微调器图标： 但这使用默认的Android微调器。我想用我从preloaders.net得到的加载图标来替换微调器，如下所示： 如何用此自定义微调器替换默认的Android微调器？
-
我们可以自定义标记图标谷歌地图吗？我不想只是简单地更改图标位图（我知道怎么做），我想更改图标的方式就像我有一个xml布局（有一个imageview和一个textview），我想膨胀这个xml（像自定义信息窗口）。但我想让它成为一个标记图标，这样我就可以通过编码来设置图像和文本。注意，我不想要一个信息窗口，我希望它是一个标记