时间戳

首页 > 解决方案 > 使用 Mapbox gl 绘制，在覆盖多边形特征的圆半径后，如何放大所选顶点的圆半径？

mapbox - 使用 Mapbox gl 绘制，在覆盖多边形特征的圆半径后，如何放大所选顶点的圆半径？

问题描述

在官方demo中，在“draw_polygon”模式下创建多边形后，当你direct_select多边形上的一个顶点时，该顶点将被放大。https://docs.mapbox.com/mapbox-gl-js/example/mapbox-gl-draw/

在这个 js 小提琴中：https : //jsfiddle.net/frankzhang2046/y49mhtjx/16/ 在覆盖第 258-271 行中顶点的样式规则后，“direct_select”下的选定顶点不再放大。

想知道我可以使用什么 API/选择器来定位选定的顶点以恢复“选定时放大”行为。谢谢。

 {
      id: "i-guess-id-doesnt-matter",
      type: "circle",
      filter: [
        "all",
        ["==", "meta", "vertex"],
        ["==", "$type", "Point"],
        ["!=", "mode", "static"],
      ],
      paint: {
        "circle-radius": 3,
        "circle-color": "green"
      },
    },

标签： mapboxmapbox-gl-jsmapbox-glmapbox-gl-draw

解决方案

更新：在未缩小的 MapboxDraw 库中发现了用于定位选定顶点的规则集。改变圆半径变大解决了这个问题

  {
    'id': 'gl-draw-point-active',
    'type': 'circle',
    'filter': ['all',
      ['==', '$type', 'Point'],
      ['!=', 'meta', 'midpoint'],
      ['==', 'active', 'true']],
    'paint': {
      'circle-radius': 5,
      'circle-color': colorHexVal
    }
  },

推荐阅读