Geographic Information Systems Asked on May 20, 2021
I am trying to create a layer on a map to indicate a trail in addition to LineString. I want to display an icon each point.
I create my map layer
var historySource = new ol.source.Vector({
features: history
});
var markersTrailMarkerLayer = new ol.layer.Vector({
name: 'HistoryTrailIcons' + num, // needed?
id: 'HistoryTrailIcons' + num,
source: historySource,
setZIndex: 500
});
map.addLayer(markersTrailMarkerLayer);
I then loop through an array creating a marker for each point:
for (var x = 0 ; x < historyArray.length ; x++)
{
var lonlat = new ol.proj.transform([historyArray[x].longitude, historyArray[x].latitude], 'EPSG:4326', 'EPSG:27700');
points.push(lonlat); // for the line string used later
// Create history marker
var marker = new ol.Feature({
geometry: new ol.geom.Point(lonlat),
id: historyArray[x].num+ "_" + x,
});
marker.setId(historyArray[x].num+ "_" + x);
var iconStyle = new ol.style.Style({
image: new ol.style.Icon(({
anchor: [0.5, 1],
src: "/images/historymarker.png",
opacity: 1,
id: historyArray[x].num+ "_" + x
}))
});
marker.setStyle(iconStyle);
history.push(marker);
}
It appears to being created but is not visible on top of the line string. Can anyone help?
The LineString I mentioned is a separate layer drawn elsewhere in the code but I have included as requested:
var lineStringFeature = new ol.Feature({
geometry: new ol.geom.LineString(points),
name: esn
});
lineStringFeature.setId(esn);
// Add history trail line
var lineString = new ol.layer.Vector({
id: "HistoryTrail" + num,
source: new ol.source.Vector({
features: [lineStringFeature]
}),
style: new ol.style.Style({
stroke : new ol.style.Stroke({
color: '#0000ff',
width: 5
})
})
});
map.addLayer(lineString);
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP