我想添加一个地址数组,并将其转换为坐标,并为每个坐标创建标记,然后将其添加到地图,尝试迭代循环,但是它不起作用,您能帮我吗?这里的代码:
var map = L.map('map').setView([17.0812861,-96.805772], 13);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: ['a', 'b', 'c']
}).addTo(map);
var planes = [
["Prolongación de Xicoténcatl, 68120 Oaxaca de Juárez, MX"],
["Av Belisario Domínguez 428, 68050 Oaxaca de Juárez, MX"],
["C820B6"]
];
for (var i = 0; i < planes.length; i++) {
planes[i]=provider.search({
query: planes[i]
});
}
for (i = 0; i < value.length; i++) {
query.then(value => {
for (i = 0; i < value.length; i++) {
// Success!
var x_coor = value[i].x;
var y_coor = value[i].y;
var label = value[i].label;
var marker = L.marker([y_coor, x_coor]).addTo(map).on('click', markerOnClick);
marker.bindPopup("<b>Found location</b><br>" + label).openPopup(); // note the "openPopup()" method. It only works on the marker
};
}, reason => {
console.log(reason); // Error!
});
}
此脚本可以使用一个标记:
var map = L.map('map').setView([17.0812861,-96.805772], 13);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: ['a', 'b', 'c']
}).addTo(map);
var query_addr = "Prolongación de Xicoténcatl 1031, 68120 , MX";
const provider = new window.GeoSearch.OpenStreetMapProvider();
var query_promise = provider.search({
query: query_addr
});
query_promise.then(value => {
for (i = 0; i < value.length; i++) {
// Success!
var x_coor = value[i].x;
var y_coor = value[i].y;
var label = value[i].label;
var marker = L.marker([y_coor, x_coor]).addTo(map)
marker.bindPopup("<b>Found location</b><br>" + label).openPopup(); };
}, reason => {
console.log(reason);
}
);
我是JS和Laravel的新手,我是编程的新手,我真的很喜欢学习。请您支持我,我会非常感激,我发现它有趣jaavscript
答案 0 :(得分:1)
以防万一您找不到解决方案,我和您有同样的问题。只需将const provider
更改为var provider
。
所以它会导致如下结果:
var map = L.map('map').setView([17.0812861,-96.805772], 13);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: ['a', 'b', 'c']
}).addTo(map);
var query_addr = "Prolongación de Xicoténcatl 1031, 68120 , MX";
var provider = new window.GeoSearch.OpenStreetMapProvider();
var query_promise = provider.search({
query: query_addr
});
query_promise.then(value => {
for (i = 0; i < value.length; i++) {
// Success!
var x_coor = value[i].x;
var y_coor = value[i].y;
var label = value[i].label;
var marker = L.marker([y_coor, x_coor]).addTo(map)
marker.bindPopup("<b>Found location</b><br>" + label).openPopup(); };
}, reason => {
console.log(reason);
}
);