谷歌地图; 将地方卡添加到标记

num*_*web 12 javascript google-maps google-maps-api-3

正如您在下图所示,div(左上角)显示当前标记地址/ directions/save ..

在此输入图像描述

这是使用iframe谷歌地图的嵌入代码完成的.但是你怎么能用自定义的"编码"地图做同样的事情呢?

geocoder = new google.maps.Geocoder();

geocoder.geocode({
    "address": nw.google_pointer
}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {

        var myOptions = {
            zoom: parseInt(nw.google_zoom),
            center: results[0].geometry.location,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location,
            title: nw.google_pointer
        });
    } else {
        console.log('Geocode was not successful for the following reason: ' + status);
    }
});
Run Code Online (Sandbox Code Playgroud)

小智 12

jsbin和我的解决方案

背景:

我需要在这里这里更好地解决鼠标滚轮问题.获得我想要的行为的最好方法是坚持使用API​​,但我真的很喜欢嵌入式版本中显示的卡.

方法:

  1. 从嵌入版本复制的卡代码和相关的CSS.
  2. 在javascript中,当它准备好时,将卡html附加到渲染的地图中

我的定制:

  1. 取消"保存"选项,因为它不起作用.
  2. 位于右上方的定位卡 - 查看javascript中附加的html,它是绝对位置的硬编码,如果您愿意,可以更改此项或将其与类关联.

希望这对你有用!