Как добавить соединительные линии в маркеры карты с помощью Reaction-Map-Gl

Как добавить соединительные линии в маркеры карты с помощью response-map-gl?

Например: у меня есть 3 маркера (mark1, mark2, mark3)

mark1 должен быть подключен к mark2 и mark3 . mark2 должен быть подключен к mark1 и mark 3.... Может кто-нибудь, пожалуйста, помогите мне...

1 ответ

Пара способов:

1) Наверное, лучший способ - это использовать deck.gl LineLayer. Deck.gl предназначен для использования с react-map-glтак что я представляю это react-map-gl's предполагаемое решение.
2) Установите ссылку на вашу карту, затем добавьте слой на карту:

   <ReactMapGL
      id={'map'}
      ref={'map'}
      onLoad={this.addLines}
     .... />

   addLines = () => {
     const map = this.refs.map.getMap()
     map.addLayer({
       "id": "route",
       "type": "line",
       "source": {
       "type": "geojson",
          "data": {
             "type": "Feature",
             "properties": {},
             "geometry": {
                "type": "LineString",
                "coordinates": [
                    [-122.48369693756104, 37.83381888486939],
                    [116.48348236083984, 37.83317489144141],
                ]
              }
            }
      },
      "layout": {
        "line-join": "round",
        "line-cap": "round"
      },
      "paint": {
        "line-color": "#888",
        "line-width": 8
      }
    });
  }

3) Установите geojson через опору mapStyles, как показано в этом примере

Другие вопросы по тегам