标签: mapbox-gl-js

所以我试图在这个 GEOJSON 文件中绘制 value_max_local 。我无法将其输入文本字段。

我已经尝试过了minmax.wind_gust_value_1.value_max_local[0]，以下是表达式的推荐......

'text-field': ['number-format', ['get', 'minmax', ['get', 'wind_gust_value_1', ['get', 'value_max_local[0]']]], {'min-fraction-digits':0, 'max-fraction-digits':0.1}],

这是代码...以及 geojson 文件的一部分。

map.addLayer({
  'id': 'MxGusts',
  'type': 'symbol',
  'source':'Gusts',
  'layout': {
    'text-field': ['number-format', ['get', 'minmax', ['get', 'wind_gust_value_1', ['get', 'value_max_local[0]']]], {'min-fraction-digits':0, 'max-fraction-digits':0.1}],
    'text-font': [
      "DIN Offc Pro Medium",
      "Arial Unicode MS Bold"
    ],
    'text-size': 13,
  },
  'paint':{
    'text-halo-color':'rgba(255,255,255,0.75)',
    'text-halo-width':1.5,
  },
},firstSymbolId);



"geometry": {
                "type": "Point",
                "coordinates": [
                    -111.38222,
                    47.47333
                ]
            },
            "type": "Feature",
            "properties": {
                "status": "ACTIVE",
                "mnet_id": "1",
                "date_time": "2019-06-12T16:50:00Z",
                "elevation": "3675", …

如何突出显示图层中的要素。第一张图片显示了图层，第二张图片是单击时突出显示的所选功能。如何执行此操作？

Mapbox 中的矢量图层

选定的功能像这样突出显示

我的地图上有雷达光栅，我想通过光标的位置显示雷达的数据颜色。

雷达示例

我试图获取 Mapbox 画布的上下文，map.getCanvas().getContext('2d')但它返回 null。

有没有办法做到这一点？

myFeatureProperty 是 true 或 false 我希望过滤器为 true（如果它的值为 true）我尝试了此操作并收到“发出验证错误”（mapbox 错误没有说明什么是无效的）：

let filter = ['==', ['get',"myFeatureProperty"],true, true, false]

知道为什么我会收到此错误吗？我找不到这个简单任务的任何示例。mapbox-gl-js 最新版本的正确表达式语法是什么？

谢谢，唐尼

我有 2 个标准的 mapbox mapbox-gl-geocoder 容器，一个接一个。当第一个容器的搜索结果出现在下拉列表中时，第二个容器会覆盖结果。我在 li、ul 等上尝试了 css z-index 1000，但没有任何效果。现在我结束了

geocoderStart.on('results', function(ev) {
            document.getElementById('geocoderEnd').style.visibility = "hidden";
        });
        geocoderStart._inputEl.addEventListener('input', function (e) { document.getElementById('geocoderEnd').style.visibility = "hidden"; });
        geocoderStart._inputEl.addEventListener('blur', function (e) { document.getElementById('geocoderEnd').style.visibility = "visible"; });

但这是越野车。有没有一种简单的 css 方法可以用 li 结果覆盖第二个输入？谢谢

我的代码

const geocoderStart = new MapboxGeocoder({
            accessToken: mapboxgl.accessToken,
            mapboxgl: mapboxgl,
            countries: 'us',
            marker : false,
            flyTo : false,
            placeholder : "Starting point",
        });
        const geocoderEnd = new MapboxGeocoder({
            accessToken: mapboxgl.accessToken,
            mapboxgl: mapboxgl,
            countries: 'us',
            marker : false,
            flyTo : false,
            placeholder …

是否可以使 Mapbox 上的默认 POI 标记可操作/可点击？

不是作为图层包含的自定义 POI 标记，而是每个地图中包含的默认 POI 标记？

在下面的屏幕截图中，您可以看到蓝色和棕色的默认 POI 标记：

Central Station，Campbria Hotel，Homewood Suites，Minute Maid Park， ETC。

这些 POI 标记会在缩放时显示，并且不会作为单独的图层添加。我想让它们变得可行。

理想的行为是弹出地图，其中包含相关的 OSM POI 信息，例如 Google 地图。但即使直接链接到 OSM 位置也是可以接受的。

例如，如果用户单击Minute Maid Park下面的 POI 图标，是否可以将用户重定向到关联的 OSM 位置？（https://www.openstreetmap.org/way/129025430）

我可以通过 GeoJSON 源/图层使用自定义标记来执行此操作，但我想访问所有默认 POI 标记，而不是一小部分自定义标记。

我有一个 geoJSON，其中包含显示风速符号的点。我试图了解如何更改我的代码以允许轮换。我确信我以前见过这个，但我在任何地方都找不到例子。

作为参考，这里是我的 geoJSON 中的一个功能，其中不包含旋转属性：

{
    "type": "Feature",
    "geometry": {      "type": "Point",
      "coordinates": [-117.2500 , 33.35000]
     },
     "properties": {
        "description": " ",
        "icon": "wind-speed-15"
     }
}

这是我将其添加到地图的代码：

map.addLayer({
        id: "wind_speed",
        type: 'symbol',
        source: 'wind_speed_json',
        layout: {
            'icon-image': ['get', 'icon']
        }
    })

我需要在 JSON 中更改哪些内容才能允许 Mapbox 根据每个功能进行旋转？我在想这样的事情，以度为单位（只是一个例子）：

 "properties": {
    "description": " ",
    "icon": "wind-speed-15",
    "icon-rotate": 90
 }

我只能找到如何使用适用于整个 JSON 的 icon-rotate 进行旋转的示例，而不是针对每个功能。有没有办法把它设计成这样？我肯定做错了什么。

我有来自开放数据 API 的 json，我需要将其转换为 geojson，以便它可以在我的 Mapbox 地图上显示为图层。我正在使用 Mapbox GL JS 库：https://docs.mapbox.com/mapbox-gl-js/api/。以下是开放数据 json api 的链接： https: //data.cityofnewyork.us/resource/64uk-42ks.json。

我可以成功获取 json api 并将其打印到控制台，但现在我需要将其转换为 geojson。我知道我可以完全在前端完成此操作，因为它是开放数据。

这是我的代码：

var map = new mapboxgl.Map({
  container: 'map',
  style: 'mapbox://styles/niki12step/ck8q9fgpx00d91ipipual7mrl', // replace this with your style URL
  center: [-73.961581,40.683868],
  zoom: 9.5
})

var pluto_url = 'https://data.cityofnewyork.us/resource/64uk-42ks.json'

getData();

async function getData () {
   await fetch(pluto_url)
  .then(response => response.json())
  .then(data => console.log(data))
}

我想使用 Mapbox 在同一层中绘制多个点，并且所有这些点都将拥有自己的属性，例如颜色和标签。并且在单击单个点时，它应该显示一个带有该点 ID 的弹出窗口。

这是否可以实现，到目前为止，我一直在循环点数组，并且对于每个点，我正在创建一个单独的源和图层。

for(let i = 0; i < buildings.length; i++){
      let mapSource = map.getSource(buildings[i].building_id);
      if(!mapSource){
        map.addSource(buildings[i].building_id, {
          'type': 'geojson',
          'data': {
            'type': 'Feature',
            'geometry': {
              'type': 'Point',
              'coordinates': buildings[i].centroid.coordinates
            }
          }
        });
      }
      let mapLayer = map.getLayer(buildings[i].building_id);
      if(!mapLayer){
          map.addLayer({
            'id': buildings[i].building_id,
            'type': 'circle',
            "paint": {
              "circle-radius": 6,
              "circle-color": SectionColors[buildings[i].section[0]]
            },
            "source": buildings[i].building_id
          });
      }
      let mapLabel = map.getLayer(`${buildings[i].building_id}-label`);
      if(!mapLabel){
        map.addLayer({
          'id': `${buildings[i].building_id}-label`,
          'type': 'symbol',
          'source': buildings[i].building_id,
          'layout': {
            'text-field': `${buildings[i].building_id}`,
            'text-size': 14,
            'text-variable-anchor': ["left"],
            'text-radial-offset': 0.3, …

我在切片服务器前面使用清漆来缓存 Mapbox 切片。为了删除旧的图块，我打算使用禁令来有效地删除大量缓存的图块。我的问题是清漆仍然使用缓存的对象（至少age响应中表明了这一点）并且不联系后端。

curl -X BAN -H 'X-Purge-Regex: 5/3/4.pbf' varnish我首先请求 http://varnish/5/3/4.pbf，然后使用或 或者添加禁令varnishadm，然后ban obj.http.url ~ 5/3/4.pbf再次请求 http://varnish/5/3/4.pbf。

一开始我的禁令列表是空的：

Present bans:
1610117471.434488     1 C

禁令已成功添加curl -X BAN -H 'X-Purge-Regex: 5/3/4.pbf' varnish

<!DOCTYPE html>
<html>
  <head>
    <title>200 Ban added</title>
  </head>
  <body>
    <h1>Error 200 Ban added</h1>
    <p>Ban added</p>
    <h3>Guru Meditation:</h3>
    <p>XID: 8</p>
    <hr>
    <p>Varnish cache server</p>
  </body>
</html>

并显示在禁止列表中

Present bans:
1610117369.028870     0 -  obj.http.url ~ 5/3/4.pbf
1610117307.220739     1 C  

再次请求http://varnish/5/3/4.pbf后，ban列表显示使用了该ban

Present bans:
1610117471.434488     1 - …