листовка выделить часть полилинии - PullRequest
Новая
       27

листовка выделить часть полилинии

0 голосов
/ 09 октября 2019

в leaflet.js у меня есть ломаная линия в openstreet map: point1 (long, lat), 2 (long, lat) .... pointXY (long, lat)

Возможно (и как) выделитьили измените цвет только сегмент от пункта 2 до 5, независимо от того, как вызывать. Я пытаюсь добавить еще одну ломаную линию, но с большим количеством сегментов ее путаница с большим количеством дублирующих точек.

Рабочий образец: http://next.plnkr.co/edit/FyUzMG9Y9NrbYrzL

я ищу поворотный отрезок между [40,10], [10,10], [10,30] красным. Если это возможно, по индексу [2,3,4]

спасибо за помощь

1 Ответ

0 голосов
/ 09 октября 2019

Вы можете попробовать слой GeoJson, чтобы выделить линию. Просто убедитесь, что координаты геойсона имеют формат LngLat. 

var map = L.map('map', {
  center: [0, 0],
  zoom: 0,
  layers: [
    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
      attribution: 'Map data © OpenStreetMap contributors',
    }),
  ],
});

var data = {
  type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      geometry: {
        type: 'LineString',
        coordinates: [[30, 10], [45, 45]],
      },
      properties: {
        color: 'green',
      },
    },
    {
      type: 'Feature',
      geometry: {
        type: 'LineString',
        coordinates: [[10, 40], [10, 10], [30, 10]],
      },
      properties: {
        color: 'red',
      },
    },
    {
      type: 'Feature',
      geometry: {
        type: 'LineString',
        coordinates: [[-45, -45], [10, 40]],
      },
      properties: {
        color: 'black',
      },
    },
  ],
};

var geoJsonLayer = L.geoJson(data, {
  onEachFeature: function(feature, layer) {
    if (layer instanceof L.Polyline) {
      layer.setStyle({
        color: feature.properties.color,
      });
    }
  },
}).addTo(map);

Плункер: http://next.plnkr.co/edit/s4Q72s7RyOLp714U?preview
Ссылка: https://embed.plnkr.co/plunk/XqzvdR

...