如何将 Google 地图标记链接到其他元素?

2023-12-23

使用谷歌地图 http://code.google.com/apis/maps/documentation/reference.html(和 JavaScript)我已经能够轻松地显示几个标记,每个标记上都有一个漂亮的小信息窗口。

//Create map over USA
map = new google.maps.Map2( document.getElementById('map') );
map.setCenter(new GLatLng(38.95940879245423, -100.283203125), 3);

//Create point, then marker, and then add to map
function create_marker(lat, lng, html) {
    var marker = new GMarker( new GLatLng(lat,lng));
    marker.bindInfoWindow(html);
    map.addOverlay(marker);
}

var html = '<div>this is my text</div>';
create_marker(38.95940879245423, -100.283203125, html);

但是,我现在希望能够将标记的“点击”链接到也可以更新页面其他部分的函数。例如,我想要一个侧边栏,其中包含标记信息窗口内容的副本。一样的方法位于左侧,标记位于右侧。我什至可能希望单击侧边栏内容来打开地图上给定的标记信息窗口。

问题是GMarker http://code.google.com/apis/maps/documentation/reference.html#GMarkerclick 事件仅传递纬度/经度 - 我不确定如何使用它来查找匹配的 div 或其他内容。

如何为每个标记获取唯一的 ID/句柄?


为每个标记及其在侧栏中的相应元素分配一个 id。创建一个事件侦听器来调用该 id。像这样的东西:

var html = '<div>this is my text</div>';
var sideHtml = '<div id="1">this is my text</div>';
create_marker(38.95940879245423, -100.283203125, html, 1);
$("#sidebar").append(sideHtml); // Add the text to the sidebar (jQuery)

//Create point, then marker, and then add to map
function create_marker(lat, lng, html, id) {
    var marker = new GMarker( new GLatLng(lat,lng));
    marker.bindInfoWindow(html);
    map.addOverlay(marker);

    GEvent.addListener(marker, 'click', function(latlng) {
        var div = document.getElementById(id); //access the sidebar element
        // etc...
    });
}

也可以看看这个问题 https://stackoverflow.com/questions/1490266/.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将 Google 地图标记链接到其他元素? 的相关文章

随机推荐

  • NuGet 用于多个项目的解决方案

    假设我有一个包含 3 个项目的解决方案 Core UI Tests 我使用的一些 NuGet 包将适用于所有 3 个项目 有些仅适用于 UI 和测试 有些仅适用于测试 如 NUnit 是什么right使用 NuGet 进行设置的方法 当我需
  • Python 内省:如何获取类方法的变量名?

    我想获取类方法的关键字参数的名称 我想我了解如何获取方法的名称以及如何获取特定方法的变量名称 但我不知道如何组合这些 class A object def A1 self test1 None self test1 test1 def A2
  • 优化 Delphi 中的类大小。有没有类似“打包课程”之类的东西?

    我正在尝试优化 Delphi 类的大小 以便它们占用尽可能少的内存 因为我创建了大量的类 问题是 课程本身很小 但并没有占据我预期的空间 例如 如果我有 type MyClass class private mMember1 integer
  • 打开外部终端键绑定不起作用

    I can t open a new external terminal with CTRL SHIFT C Did a new update remove this function I was able to use this shor
  • 如何实现“require_global”?

    现在的情况 我有当前版本我的 MVC 框架使用类作为控制器 我有一些 老式 模块oldMVC 框架使用简单 扁平的包含作为控制器 非常简单 这意味着 新版本 旧版本 我现在正在尝试编写
  • Room 中是否可以忽略基本更新中的字段

    我有以下实体 Entity class Foo PrimaryKey ColumnInfo name id val id Long ColumnInfo name thing1 val thing1 String ColumnInfo na
  • 将 SQLAlchemy 会话与 Celery 一起使用的正确方法是什么?

    我已经尝试弄清楚这个问题有一段时间了 但我现在找到的很多答案都已经过时 超过 6 年前的帖子 或者相关性较低 问题实际上是如何在 celery 中正确处理数据库会话 我当前的设置是 我有一个全局 DbEngine 对象 其中包含dsn en
  • 快速将 Excel 导入数据表

    我正在尝试将 Excel 文件读入 Data DataTable 列表中 尽管使用我当前的方法可能需要很长时间 我基本上是逐个工作表 逐个单元地进行操作 这往往需要很长时间 有没有更快的方法来做到这一点 这是我的代码 List
  • 如何禁用/隐藏 vscode-python 中的变量分组

    最近的 ms python 扩展 v2020 5 86806 https github com microsoft vscode python releases tag 2020 5 86806 for vscode 在调试控制台 变量资源
  • 部署到生产时找不到索引视图?

    尝试将 MVC 应用程序部署为现有 ASP NET 3 5 应用程序 非 MVC 的子应用程序时 我遇到了问题 错误是 The view index or its master could not be found The followin
  • 如何阻止 WPF KeyDown 事件从某些包含的控件(例如 TextBox)中冒泡?

    我的程序非常大 并且使用 WPF 我想要一个使用 R 的全局快捷键 不带修饰符 有许多控件 例如 TextBox ListBox ComboBox 等 它们都在控件本身内部使用字母 这很好 这对我来说是正确的 But 我想阻止 KeyDow
  • 如何在一个proc打印语句中打印多个数据集?

    我有一个 sas 查询 如果我创建了 3 个数据集 可以说命名为ds1 ds2 ds3 现在 我想在一个 proc print 语句下打印所有这些 那么我们该怎么做呢 就像 我想要这样的东西 proc print data work ds1
  • 在 GPU 上计算图像相似度 [OpenGL/遮挡查询]

    OpenGL 假设我绘制了一幅图像 然后使用 XOR 绘制了第二幅图像 现在我在某处有了带有非黑色像素的黑色缓冲区 我读到可以使用着色器来计算 GPU 上的黑色 rgb 0 0 0 像素 我还读到它必须与 OcclusionQuery 做一
  • 在自定义静态框架 iOS 中使用 magicrecords 库

    我一直在为 iOS 实现一个自定义静态框架 一切都运行良好 但现在我意识到我需要通过框架中的 coredata 存储信息 我一直在之前的项目中使用 magicrecord 库 我想知道是否有人有将 magicrecord 集成到您自己的自定
  • 获取 LinkedHashSet 的最后一个

    我想存储数字 1 2 3 4 的列表 让我们从List
  • Proguard 保留接口方法参数名称

    我使用 keepparameternames 但它不响应界面 The interface s methond parameter is proguard Thank you for your help Proguard 可以很好地保留参数名
  • LISTAGG 奇怪的串联[重复]

    这个问题在这里已经有答案了 当我使用下面的查询来获取所需的详细信息时 SELECT USERNAME FULLNAME DEPARTMENT LISTAGG TASKNAME WITHIN GROUP ORDER BY TASKNAME T
  • 如何在 Xamarin 中获取 GoogleApiClient?

    我想实现类似的东西this https stackoverflow com a 25173057 2611340在我在 Xamarin 中开发的 Android 应用程序中 但找不到其中的命名空间GoogleApiClient是 有人可以帮
  • Blackberry OS 4.5 应用程序的通知服务

    我正在开发一个类似于电子邮件应用程序的应用程序 每当收到新消息时 我的通知服务应通过更新图标向用户指示更改 此外 通知服务应持续侦听服务器的传入事件 我正在使用 4 5 版本的操作系统进行开发 RIM OS 您有多种选择来通知 用户 都不是
  • 如何将 Google 地图标记链接到其他元素?

    使用谷歌地图 http code google com apis maps documentation reference html 和 JavaScript 我已经能够轻松地显示几个标记 每个标记上都有一个漂亮的小信息窗口 Create