标签: mapbox
在mapbox/leaflet上聚类标记
我试图建立在mapbox集群地图,像http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.388.html
但他们的示例使用普通的.js文件作为数据 http://www.mapbox.com/mapbox.js/assets/realworld.388.js
我可以从mapbox唯一得到的是.geojson http://api.tiles.mapbox.com/v3/thebteam.map-w9jzcznw/markers.geojson
有没有办法可以将geojson转换为js(定期)？或者从mapbox导出javascript数组？
编辑:最终将我的数据切换为CSV并找到解析器.这是有效的代码,如果有人需要它:
var url = 'https://docs.google.com/spreadsheet/pub?key=abc123';
$.get(url, function(data) {
var addressPoints = $.csv.toArrays(data);
var map = L.mapbox.map('map', 'map-abc123').setView([20.30, 18.98], 2);
var markers = new L.MarkerClusterGroup({ showCoverageOnHover: false });
for (var i = 0; i < addressPoints.length; i++) {
var a = addressPoints[i];
var title = a[2];
var marker = L.marker(new L.LatLng(a[0], a[1]), {
icon: L.mapbox.marker.icon({'marker-size': 'small', 'marker-color': 'e8168c'}),
title: title
});
marker.bindPopup(title);
markers.addLayer(marker);
}
map.addLayer(markers);
});
推荐指数
解决办法
查看次数
触摸MapBox滚动页面
我正在尝试在填充100%页面的布局上实现MapBox.我已禁用地图缩放选项,但尝试在地图填充视口的触摸设备上滚动时会出现问题.我可以覆盖它或让浏览器将其视为图像吗？
推荐指数
解决办法
查看次数
将小叶标记放在圆周上的参数方程不精确？
我正在开发一个应用程序,我有一个圆心和半径,我在Leaflet的帮助下绘制圆圈.
我在圆周的最北端放置了一个标记,使其可以拖动.
var circle = L.circle(coords, radius).addTo(map);
convertRadiusToLatitude = parseInt(response.radius)/111111;
var coordsOnRadius = [parseFloat(response.lat) + convertRadiusToLatitude, parseFloat(response.long)];
var markerOnRadius = L.marker(coordsOnRadius, {draggable: true}).addTo(map);
现在,这将标记添加到圆周,现在我希望它只能在我使用参数方程的圆周上拖动.
参数方程
x = Xc + R * cos(theta)
y = Yc + R * sin(theta)
拖动代码
markerOnRadius.on('drag', function(e){
bearing = marker.getLatLng().bearingTo(markerOnRadius.getLatLng());
var markerOnRadiusX = parseFloat(response.lat) + ((0.000009 * parseFloat(response.radius)) * Math.cos( toRad(bearing) ));
var markerOnRadiusY = parseFloat(response.long) + ((0.000009 * parseFloat(response.radius)) * Math.sin( toRad(bearing) ));
markerOnRadius.setLatLng([markerOnRadiusX, markerOnRadiusY]);
});
该bearingTo方法:
L.LatLng.prototype.bearingTo = function(other) {
var …推荐指数
解决办法
查看次数
mapbox strip-frameworks.sh:没有这样的文件或目录
我正在尝试将mapBox sdk与xcode集成,我按照这里提到的步骤操作:
[ https://www.mapbox.com/ios-sdk/#manual][1]
我得到以下错误
bash: /Users/user/Library/Developer/Xcode/DerivedData/MapApp-fyrihrjtsamtymbsepguswqhltvs/Build/Products/Debug-iphonesimulator/MapApp.app/Frameworks/Mapbox.framework/strip-frameworks.sh: No such file or directory
推荐指数
解决办法
查看次数
MapBox GL JS标记偏移量
我正在使用MapBox GL JS来创建带有自定义标记的地图:
var marker = new mapboxgl.Marker(container)
.setLngLat([
datacenters[country][city].coordinates.lng,
datacenters[country][city].coordinates.lat
])
.addTo(map);
但是,我似乎对标记有某种偏移问题.问题是:当缩小一点时,标记的底部并没有真正指向确切的位置:
当我进一步放大它到达目的地时,它指向确切的位置.
我真的很喜欢MapBox GL,但这个特殊的问题让我烦恼,我很想知道如何解决它.当这个问题得到解决时,我的实现远比我使用的原始映射软件更优越.
推荐指数
解决办法
查看次数
添加3D对象以映射并平移它
推荐指数
解决办法
查看次数
如何免费使用Leaflet Map？
宣传单是开源的,免费的.但是,传单站点上的示例使用Mapbox来渲染地图.Mapbox比谷歌地图(Mapbox定价)更贵.问题是:任何人都可以免费使用Leaflet吗？
推荐指数
解决办法
查看次数
MapBox标记继续缩放
我正在使用MapBoxgl,我想添加几个标记.
这是我的index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<link href=" /assets/css/bootstrap.min.css " rel="stylesheet" />
<link href=" /assets/css/mapbox-gl.css " rel="stylesheet" />
<link href=" /assets/css/main.css " rel="stylesheet" />
</head>
<body>
<div id="map"></div>
<script src="/assets/js/mapbox-gl.js"></script>
<script src="/assets/js/map-style.js"></script>
</body>
</html>
这是map-style.js:
var map = new mapboxgl.Map({
container: 'map',
center: [57.3221, 33.5928],
zoom: 5,
style: style
});
var geojson = {
type: 'FeatureCollection',
features: [{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [30.61, 46.28]
},
properties: {
title: 'point 1',
description: 'point 1 Description', …推荐指数
解决办法
查看次数
mapbox gl js有空闲事件吗？
我需要某种谷歌地图"空闲"事件为mapbox gl.当每个事件都被触发并且地图停止了zoomin/out拖动等并且每个图层都已加载,并且地图处于空闲状态.我必须使用此代码
map.on("render", function(e) {
if(map.loaded() && triggerOnce === true) {
//fires on zoomin runing
triggerOnce = false;
console.log("Render end")
setTimeout(somefunc(),1000)
}
})
推荐指数
解决办法
查看次数
Flutter：地图上有图像叠加层
我实际上是在一个Web项目中，其中以叠加的方式显示地图（传单）。在Web应用程序上，用户可以移动图像以使其与传单地图上建筑物的指纹完全匹配。放置图像后，由于图像3个角的3个GPS坐标，我们能够存储图像的确切位置。
现在，我想通过在移动应用程序的地图上使用3个角坐标添加此图像。我对Flutter感兴趣，但是在进一步介绍之前，我想知道使用Flutter可以实现此实现。
这是放置在Web应用程序上的图像的示例：
这是与图像相关联的3个角坐标的示例：
"corner1": {
"type": "Point",
"coordinates": [48.44125015626304, -4.412910623650533]
},
"corner2": {
"type": "Point",
"coordinates": [48.44194275959914, -4.412734794896097]
},
"corner3": {
"type": "Point",
"coordinates": [48.441223035155275, -4.412648068391719]
}
因此，在全球范围内，我希望在移动应用程序的这些确切位置上以重叠方式显示图像，并尽可能使用Flutter。
推荐指数
解决办法
查看次数
标签 统计
mapbox ×10
javascript ×4
google-maps ×3
leaflet ×3
mapbox-gl ×2
mapbox-gl-js ×2
algorithm ×1
android ×1
dictionary ×1
flutter ×1
geojson ×1
json ×1
marker ×1
math ×1
touch ×1
xcode ×1