gpt4 book ai didi

javascript - 从文章标签的数据属性列表创建一个数组

转载 作者:太空宇宙 更新时间:2023-11-04 16:25:29 25 4
gpt4 key购买 nike

我想创建一个数组,将其分配给标记变量,这是为了在谷歌地图中显示标记。但我所拥有的只是文章标签中的数据属性。

这就是我正在做的事情:http://jsfiddle.net/gilbertlucas46/qpvdrjh8/7/如果你检查控制台它会向你显示这个

enter image description here

这就是我想要实现的目标

var markers = [
['Palace of Westminster, London', -27.4687253, 153.0273166],
['Palace of Westminster, London', -27.4687253, 153.0273166]
];

这是我必须在谷歌地图中显示标记的代码

jQuery(function($) {
// Asynchronously Load the map API
var script = document.createElement('script');
script.src = "//maps.googleapis.com/maps/api/js?sensor=false&callback=initialize";
document.body.appendChild(script);
});

function initialize() {
var map;
var bounds = new google.maps.LatLngBounds();
var mapOptions = {
mapTypeId: 'roadmap'
};
// var latitude= $('div.locations').find('.location').attr("data-latitude");
// var longitude= $('div.locations').find('.location').attr("data-longitude");
// var coor = latitude + ' , ' + longitude;
var latitude,
longitude,
dataName,
coor,
markers;

$(".location").each(function(){
latitude = $(this).attr('data-latitude');
longitude = $(this).attr('data-longitude');
dataName = $(this).attr('data-name');
coor = latitude + ' , ' + longitude;
// Display a map on the page
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
map.setTilt(45);

// Multiple Markers
var markers = new Array([dataName, latitude, longitude]);
console.log(markers);


// Info Window Content
var infoWindowContent = [
// ['<div class="info_content">' +
// '<h3>London Eye</h3>' +
// '<p>The London Eye is a giant Ferris wheel situated on the banks of the River Thames. The entire structure is 135 metres (443 ft) tall and the wheel has a diameter of 120 metres (394 ft).</p>' + '</div>'],
// ['<div class="info_content">' +
// '<h3>Palace of Westminster</h3>' +
// '<p>The Palace of Westminster is the meeting place of the House of Commons and the House of Lords, the two houses of the Parliament of the United Kingdom. Commonly known as the Houses of Parliament after its tenants.</p>' +
// '</div>']
];

// Display multiple markers on a map
var infoWindow = new google.maps.InfoWindow(), marker, i;

// Loop through our array of markers & place each one on the map
for( i = 0; i < markers.length; i++ ) {
var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
bounds.extend(position);
marker = new google.maps.Marker({
position: position,
map: map,
title: markers[i][0]
});

// Allow each marker to have an info window
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infoWindow.setContent(infoWindowContent[i][0]);
infoWindow.open(map, marker);
}
})(marker, i));

// Automatically center the map fitting all markers on the screen
map.fitBounds(bounds);
}
});

// Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
this.setZoom(10);
google.maps.event.removeListener(boundsListener);
});
}

最佳答案

尝试使用push将其添加到数组中并在循环外设置变量?

http://jsfiddle.net/qjd23gnm/

我把它放入一个变量中。检查 fiddle ,看看它是否是您需要的。

      var markers = [];

$(".location").each(function() {
latitude = $(this).attr('data-latitude');
longitude = $(this).attr('data-longitude');
dataName = $(this).attr('data-name');
<!-- coor = latitude + ' , ' + longitude; -->
// Multiple Markers
markers.push([dataName, latitude, longitude]);

});
console.log(markers);

关于javascript - 从文章标签的数据属性列表创建一个数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40275338/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com