我使用以下示例在地图上添加了几个标记:
https://www.mapbox.com/mapbox-gl-js/example/geojson-markers/
现在我想在用户点击标记图像时显示弹出窗口,但我找不到优雅的解决方案.有帮助吗？
我想在我的Android应用程序中使用Mapbox GL.这项服务即将发布,我有一个关于使用渲染器的棘手问题.
我喜欢渲染器本身,但我真的想在应用程序中使用我自己的地图数据(而不是Mapbox提供的数据和支付的数据).例如,我想自己解析OpenStreetMaps数据,以某种方式自定义它,然后放入渲染器内部以在我的应用程序中显示它.
现在问题是:使用Mapbox GL时是否可以使用我自己的地图数据？或者它只能用于Mapbox数据？
预先感谢您的任何帮助.也许你知道其他任何做得好的解决方案吗？问题是,我想要矢量图块,而不是光栅图块.这个项目计划在以后为iOS开发.
我的目标是创建一个前后地图,在地图上显示一系列坐标标记.
执行代码时,我在控制台中看到此错误消息: Style is not done loading
最终目标是看到一个光标,允许用户水平滑动并查看地图的变化(从之前到之后).
到目前为止,这是我的代码,任何帮助都会有很长的路要走!
$(document).ready(function() {
var request_one = $.ajax({
url: "https://geohack-framework-gbhojraj.c9users.io/ny",
dataType: 'json'
})
var request_two = $.ajax({
url: "https://geohack-framework-gbhojraj.c9users.io/man",
dataType: 'json'
});
$.when(request_one, request_two).done(function(response_one, response_two) {
console.log(response_one, response_two);
//create map of ny state
var nyGeo = response_one[0];
var manGeo = response_two[0];
(function() {
mapboxgl.accessToken = 'pk.eyJ1IjoiamdhcmNlcyIsImEiOiJjaXY4amM0ZHQwMDlqMnlzOWk2MnVocjNzIn0.Pos1M9ZQgxMGnQ_H-bV7dA';
//manhattan map
var manCenter = manGeo.features[0].geometry.coordinates[0][0][0];
console.log('man center is', manCenter);
var beforeMap = new mapboxgl.Map({
container: 'before',
style: 'mapbox://styles/mapbox/light-v9',
center: manCenter,
zoom: 5
});
console.log('man geo is …我正在使用 Mapbox GL JS。有什么方法可以让我的基础层看起来像 Mapbox Light 示例，但只显示英国？
我假设我会使用 Mapbox Studio 来构建我自己的基础层，但我在 Studio 中看不到任何按国家/地区过滤的方法。
如果这是不可能的，有什么办法可以只在英国显示标签，而将其他国家/地区显示为填充的多边形？（根据这个未回答的问题。）
我正在将一个Web应用程序从Mapbox.js重写为Mapbox GL js.使用标准的'mapbox:// styles/mapbox/streets-v8'样式,在哪里可以找到所有工作标记图标的列表？
这是我的代码:
m.map.addSource("markers", {
"type": "geojson",
"data": {
"type": "FeatureCollection",
"features": {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": ["-75.532965", "35.248018"]
},
"properties": {
"title": "Start",
"marker-symbol": "entrance",
"marker-size": "small",
"marker-color": "#D90008"
}
}
}
});
m.map.addLayer({
"id": "markers",
"type": "symbol",
"source": "markers",
"layout": {
"icon-image": "{marker-symbol}-15", //but monument-15 works
"text-field": "{title}",
"text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
"text-offset": [0, -1.6],
"text-anchor": "top"
}
});
我读到所有Maki图标都应该用于没有图标作为默认值的样式:https: //github.com/mapbox/mapbox-gl-styles/issues/241 但是大多数都不起作用.另外还有尺寸问题 - 对于Maki来说,他们是小型,中型和大型,现在我看到了-11和-15.
我只需要使用一些基本的标记图标.
我一直在寻找MapBox GL中的聚类标记(https://www.mapbox.com/mapbox-gl-js/example/cluster/),但我希望这样做有点不同.
从本质上讲,我有一个geojson文件,其中包含我们校园内每栋建筑物(点)的事件数.我想在标记中显示该数字,然后当缩小时,标记会折叠并将该标记的值添加到一起.
我看到的聚类示例只是计算点数,但似乎没有提供聚合属性.这样的事情可行吗？
我正在使用Mapbox GL JS来显示多边形图层.我想允许用户从下拉列表中选择一个名称,然后突出显示并缩放到匹配的多边形.
我已经知道如何突出显示匹配的多边形map.setFilter,但我不知道如何缩放到匹配多边形的边界.这是我目前的代码:
map.addLayer({
'id': 'polygon_hover',
'source': 'mysource',
'source-layer': 'mylayer',
'type': 'fill',
'paint': {
'fill-color': 'red',
"fill-opacity": 0.6
},
"filter": ["==", 'CUSTNAME', ""]
});
// Get details from dropdown
custname.on("change", function(e) {
// get details of name from select event
map.setFilter('polygon_hover', ["==", 'CUSTNAME', name]);
// Get bounds of filtered polygon somehow?
// var bounds = ??;
// map.fitBounds(bounds);
});
我已经检查了缩放到边界的Mapbox示例,但它假设您已经知道边界是什么.
有没有办法可以在Mapbox中获得与地图过滤器匹配的多边形边界？
当地图的缩放级别增加时，我想减小标记的大小。我怎样才能做到这一点？
工作mapboxgl与ionic3,angular4和科尔多瓦.
我已经构建了.apk和.ipa文件.我在我的Android设备上安装了.apk文件,它按预期工作(ie mapbox tiles, my icons (I have added some icons to custom some functionalities for eg. added an icon to switch the map style) and my markers are loaded successfully).
当我在我的Iphone中安装.ipa文件时,我的图标只加载但mapbox图块没有加载.也是标记.我得到空白的白色屏幕.
我的实施有什么问题？
let data = {myJson data};
mapboxgl.accessToken = 'My access token';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
attributionControl: false,
center: [-74.50, 40],
zoom: 12
});
map.on('load', function () {
map.addSource("place", {
type: "geojson",
data: data,
cluster: true,
clusterMaxZoom: 14, …我在我的Angular 2/4应用程序中导入模块,如下所示:
import { MapboxDraw } from '@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw';
并在其中一个组件中使用它:
var draw = new MapboxDraw({
displayControlsDefault: false,
controls: {
polygon: true,
trash: true
}
});
map.addControl(draw);
但是当我打开页面时收到错误:
ERROR TypeError: __WEBPACK_IMPORTED_MODULE_4__mapbox_mapbox_gl_draw_dist_mapbox_gl_draw__.MapboxDraw is not a constructor
导入mapbox-gl-draw的最佳方法是什么？