OpenLayers: Как покрасить маркеры после того, как я импортировал данные GPX?

Question

https://openlayers.org/en/latest/examples/drag-and-drop.html?q=gpx

Я использовал этот код / ​​руководство для импорта файла GPX и отображения маркеров карты. Как я могу изменить их цвет?

Редактировать:

var fill = new Fill({
   color: 'rgba(255,255,255,0.4)'
 });
 var stroke = new Stroke({
   color: 'red',
   width: 1.25
 });
 var style = new Style({
   image: new Circle({
     fill: fill,
     stroke: stroke,
     radius: 5
   }),
   fill: fill,
   stroke: stroke
 });

dragAndDropInteraction.on('addfeatures', function(event) {
  var vectorSource = new VectorSource({
    features: event.features
  });
  map.addLayer(new VectorImageLayer({
    source: vectorSource,
    style: style
  }));
  map.getView().fit(vectorSource.getExtent());
});

Answer 1

Вам необходимо указать стиль для слоя. Например, чтобы изменить цвет с синего оттенка по умолчанию на ярко-красный, используйте:

  var fill = new Fill({
    color: 'rgba(255,255,255,0.4)'
  });
  var stroke = new Stroke({
    color: 'red',
    width: 1.25
  });
  var style = new Style({
    image: new Circle({
      fill: fill,
      stroke: stroke,
      radius: 5
    }),
    fill: fill,
    stroke: stroke
  });

  map.addLayer(new VectorLayer({
    source: vectorSource,
    style: style
  }));
  map.getView().fit(vectorSource.getExtent());