javascript - Google map v3 数组标记

标签 javascript jquery google-maps google-maps-api-3

为什么我无法在 Google map V3 中显示多个标记,我正确获取了坐标,但未在 map 上显示。控制台也没有错误

  1. map_items[0] = 标题
  2. map 项[1] = 55.153766, 11.909180
  3. map_items[2] = 链接
  4. map_items[3] = 文本

如果我发出警报,所有这些都会正确显示。 示例

“标题”,“51.00150763193481,-2.5659284999999272”,“链接”,“文字”

 function initialize() {
            var map = new google.maps.Map(document.getElementById('map'), {
                zoom: 7,
                center: new google.maps.LatLng(55.153766, 11.909180),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });
            for (var x = 0; x < temp.length; x++) {
                if(temp[x][1]){
                    var map_items = temp[x];
                    var myLatlng = new google.maps.LatLng(map_items[1]);
                    var marker = new google.maps.Marker({
                        map: map,
                        position: myLatlng,
                        title: map_items[0]
                    });
                    google.maps.event.addListener(marker, 'click', function() {
                        infowindow.setContent('<div class="google_marker"><a href="'+map_items[2]+'">'+map_items[0]+'</a><br /><p>'+map_items[3]+'</p></div>');
                        infowindow.open(map, marker);
                    });
                }
            }
        }

最佳答案

google.maps.LatLng() 采用两个参数,而不是一个,因此:

var latlon = map_items[1].split(',');
var myLatlng = new google.maps.LatLng(parseFloat(latlon[0]), parseFloat(latlon[1]));

事实上,最好使用对象而不是数组,其中每个项目包含不同的数据类型,例如:

marker_data[0] = {
  "lat": 55.153766,
  "lon": 11.909180,
  "title": "My Title",
  "link": "http://stackoverflow.com"
}
//etc...

然后你可以像这样访问它:

var myLatlng = new google.maps.LatLng(marker_data[0].lat, marker_data[0].lon);

关于javascript - Google map v3 数组标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12346882/

相关文章:

javascript - 在 Google map 上应用 “long touch” 事件处理程序

javascript - 谷歌地图事件对象的元素列表后缺少]

javascript - 为什么我不能将 ES6 模板文字与 .css() 方法一起使用?

jquery - 移动键盘调整视口(viewport)大小

javascript - jQuery ajax 在 IE 中返回空数据

javascript - Twitter Bootstrap 弹出窗口在打开新窗口时关闭

google-maps - Google Map V3 - 使用绘图管理器绘图时撤消最后一点

javascript - 如何在 Javascript 中使用 Q 顺序运行 promise ?

javascript - 如何将页面中的文本框值传递到另一个页面中的文本框?

javascript - 在 Javascript 中如何判断一个数组中的值是否等于另一个数组中的值?