#javascript #html #maps #openlayers
Вопрос:
У меня есть файл.csv в папке из базы данных. Я хочу показать вектор внутри моей карты, но не знаю, как добраться до этого файла. (преобразуется в json, принимая только широту или долготу….). Я попытался взять координаты из другой функции и использовать их в своем событии загрузки, но координаты никогда не меняются.
Это функция, которую я использую для перечисления в календаре, который у меня есть (объявлены var широта и var долгота, чтобы попробовать использовать в loadEvent)
var Latitude;
var Longitude;
function setListEvents(list,events){
var n = events.length;
var msg = "";
for(i=0;i<n;i ){
var Magnitude = events[i]['Magnitude'];
var Id = events[i]['id'];
var Folder = events[i]['Folder'];
var Date = events[i]['Date'];
var Time = events[i]['Time'];
var Depth = events[i]['Depth'];
var Latitude = events[i]['Latitude'];
var Longitude = events[i]['Longitude'];
//msg = msg "<div>Magnitud: <font style='color:red;'>" Magnitude "</font></div>";
msg = msg "<div id='" Id "' data-folder='" Folder "' class='card' onclick='loadEvent(this);'><div class='card-body'><h4 class='card-title' style='color: #ff0000;'>" Magnitude;
msg = msg "</h4><p style='margin-bottom: 0;'>Fecha: " Date " Hora: " Time "<br />Profundidad: " Depth "km<br />Ubicación: " Latitude "º" Longitude "º</p></div></div>";
}
//console.log(list);
//console.log(msg);
$( '#' list ).html( msg );
console.log(Latitude,Longitude);
}
Это часть моего кода в loadEvent:
function loadEvent(e){
const circleStyle = new ol.style.Circle({
fill: new ol.style.Fill({
color:[245,49,5,10]
}),
radius:5,
})
const place = [Latitude,Longitude];
const point = new ol.geom.Point(place);
const newfeature = new ol.Feature({
labelPoint: point,
name: "prueba",
})
newfeature.setGeometryName('labelPoint');
var pointing = newfeature.getGeometry().getCoordinates();
console.log(pointing);
const newPoints = new ol.layer.Vector({
source : new ol.source.Vector({
features:[ new ol.Feature(pointing)]
/* url: "assets/map.geojson",
format: new ol.format.GeoJSON() */
}),
visible:true,
title: "New Points",
style : new ol.style.Style({
image: circleStyle
})
})
map.addLayer(newPoints)
}
Желтые оповещения поступают из другой функции
РЕЗУЛЬТАТЫ CSV
Ответ №1:
Вам понадобятся координаты точки в порядке долготы, широты, затем они будут преобразованы в проекцию вида
const newPoints = new ol.layer.Vector({
source : new ol.source.Vector({
features: [new ol.Feature(
new ol.geom.Point(
ol.proj.fromLonLat([Longitude, Latitude], map.getView().getProjection())
}
)]
}),
visible: true,
title: "New Points",
style : new ol.style.Style({
image: circleStyle
})
});
map.addLayer(newPoints);
Комментарии:
1. Как я могу динамически определять долготу и широту при нажатии на событие?. он показывает ту же координату. Я попытался объявить широту var; Долготу var; перед событием загрузки и функцией внутри события загрузки, подобной этой
var Longitude; var Latitude; function loadEvent(e){ function getNewLonLat(evt){ var n=evt.length; for(i=0;i<n;i ){ Longitude = evt[i]["Longitude"]; Latitude = evt[i]["Latitude"] } } getNewLonLat(); .....