通过 Google Maps API V3 生成的地图在信息窗口中显示 Google 地方信息页数据

发布于 2024-10-24 18:11:02 字数 1539 浏览 0 评论 0原文

我有一张地图,在我想要的地方有一个标记,并且能够让信息窗口显示自定义内容。

不过,我想要的是让默认的谷歌地点页面信息显示在信息框中,就像您在maps.google.com上找到它一样。 示例如下

我使用 Maps API 而不是嵌入的唯一原因是我们需要将地图控件移出左上角。如果有一种方法可以嵌入地图并移动控件,那就太好了!否则,我需要能够将地点内容拉入我正在生成的信息窗口中。我的代码如下。

var latlng = new google.maps.LatLng(43.6985770, -73.7154730);
var mapOptions = {
        zoom: 17,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: false,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.DEFAULT,
            position: google.maps.ControlPosition.RIGHT_TOP
        },
        streetViewControl: false,
        panControl: false,
        scaleControl: false
    };

var map = new google.maps.Map(document.getElementById("map_canvas"),
    mapOptions);

var contentString = '<h1>Title</h1> <p>Content</p>';

var infowindow = new google.maps.InfoWindow({
    content: contentString,
    maxWidth: 260
});

var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title:"Directions!"
});

infowindow.open(map,marker);

谢谢!

I've got a map coming through just fine with a marker where I'd like, and am able to get the infowindow to show with custom content.

What I'd like instead though, is to have the defualt google place page info to show up in the info box as you'd find it on maps.google.com. Example here.

The only reason I'm using the Maps API instead of the embed is that we need to move the map controls out of the top left corner. If there is a way to embed a map and move the controls that would be great! Otherwise I need to be able to pull the Place content into the infowindow I'm generating. My code is below.

var latlng = new google.maps.LatLng(43.6985770, -73.7154730);
var mapOptions = {
        zoom: 17,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: false,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.DEFAULT,
            position: google.maps.ControlPosition.RIGHT_TOP
        },
        streetViewControl: false,
        panControl: false,
        scaleControl: false
    };

var map = new google.maps.Map(document.getElementById("map_canvas"),
    mapOptions);

var contentString = '<h1>Title</h1> <p>Content</p>';

var infowindow = new google.maps.InfoWindow({
    content: contentString,
    maxWidth: 260
});

var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title:"Directions!"
});

infowindow.open(map,marker);

Thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

巷雨优美回忆 2024-10-31 18:11:02

您应该查看 Google Place API

You should look at the Google Place API.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文