谷歌地图 api v3 - 从外部点击打开信息窗口

2023-11-24

所以我有一个 V3 地图,其初始化如下:

function init() {
        var mapCenter = new google.maps.LatLng(51.5081289,-0.128005);
        var map = new google.maps.Map(document.getElementById('map'), {
          'zoom': 6,
          'center': mapCenter,
          'mapTypeId': google.maps.MapTypeId.ROADMAP, 
          panControl: false,
          mapTypeControl: false,
          zoomControl: true,
          zoomControlOptions: {
                style: google.maps.ZoomControlStyle.SMALL,
                position: google.maps.ControlPosition.LEFT_TOP
            },
        });

和一大堆看起来像这样的标记:

var marker25837500 = new google.maps.Marker({
              map: map, 
              pop_title: 'blah blah',                                                                                                 
              pop_wind: 'more blah',
                      zIndex: 999,
              icon: 'images/map_icons/s6.png'
            }); 
            google.maps.event.addListener(marker25837500, 'click', onMarkerClick);

最后,我有一个功能可以在单击每个制造商时打开信息窗口:

var infoWindow = new google.maps.InfoWindow;

var onMarkerClick = OpenInfoWindow;

function OpenInfoWindow() {
          var marker = this;
          infoWindow.setContent('<h3>' + marker.pop_title + '</h3>' +
                                         marker.pop_body);

          infoWindow.open(map, marker);
        };
        google.maps.event.addListener(map, 'click', function() {
          infoWindow.close();
        }); 

我的问题是,当单击页面内部时,我需要做什么才能使特定标记(例如marker25837500)显示其信息窗口 - 也许类似于:

<div id="marker25837500">click to see infoWindow!</div>

我确信这很容易,但我只是能找到自己的路!

Thanks


你可能会使用trigger event.

$('#marker25837500').click(function () {
    google.maps.event.trigger(marker25837500, 'click')
})

检查这个-https://developers.google.com/maps/documentation/javascript/reference#event

Edit:还注意到您正在打电话onMarkerClick() when marker25837500被单击,但您命名了另一个函数OpenInfoWindow()所以你可能也需要改变它。

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

谷歌地图 api v3 - 从外部点击打开信息窗口 的相关文章

  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • Google App Engine:修改云运行环境

    我正在尝试部署一个使用自定义 Node js 服务器的 Next js 应用程序 我想将自定义构建变量注入应用程序 next config js const NODE ENV process env NODE ENV const envTy
  • 如何监听 jQuery AJAX 请求?

    以下两种实现 ajaxRequest 1 2 的方法应该是等效的 话说回来 为什么验证回调已执行的单元测试 3 在 1 中成功而在 2 中失败 我应该如何重写测试 3 来监视 2 中的成功回调 如果我尝试stub jQuery ajax使用
  • Javascript正则表达式用于字母字符和空格? [关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 我需要一个
  • Node.js:如何在检索数据(块)时关闭响应/请求

    我正在用 node js 构建一个应用程序 它加载多个页面并分析内容 因为 node js 发送块 所以我可以分析这些块 如果一个块包含例如索引 nofollow 我想关闭该连接并继续其余部分 var host example com to
  • 从未用 @flow 标记的导入文件中获取类型定义

    TL DR我怎么告诉flow从未声明的导入模块导入类型定义 flow 加长版 流接缝能够从不使用流语法的文件中派生类型 请参阅示例 示例文件 flow js if Math random lt 0 5 var y hello else va
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • Firefox 书签探索未超过 Javascript 的第一级

    我已经编写了一些代码来探索我的 Firefox 书签 但我只获得了第一级书签 即我没有获得文件夹中的链接 e g 搜索引擎 雅虎网站 谷歌网站 在此示例中 我只能访问 Search engines 和 google com 不能访问 yah
  • 提交表单并重定向页面

    我在 SO 上看到了很多与此相关的其他问题 但没有一个对我有用 我正在尝试提交POST表单 然后将用户重定向到另一个页面 但我无法同时实现这两种情况 我可以获取重定向或帖子 但不能同时获取两者 这是我现在所拥有的
  • Angular 2+ 安全性;保护服务器上的延迟加载模块

    我有一个 Angular 2 应用程序 用户可以在其中输入个人数据 该数据在应用程序的另一部分进行分析 该部分仅适用于具有特定权限的人员 问题是我们不想让未经授权的人知道how我们正在分析这些数据 因此 如果他们能够在应用程序中查看模板 那
  • 如何使用 JQuery 动态排序

    如果我有一个下拉列表和一个列表框 有没有办法使用 JQuery 根据下拉列表对列表框进行排序 举个例子会很有帮助 这会改变下拉菜单中的顺序 您必须根据自己的标准设置顺序
  • 模块构建失败(来自 ./node_modules/babel-loader/lib/index.js)Vue Js

    我从 GitHub 下载了一个我和我的朋友正在开发的项目 但是当我尝试运行时 npm run serve 我收到这个错误 src main js 中的错误 Module build failed from node modules babe
  • 为什么我不能在 AngularJS 中使用 data-* 作为指令的属性名称?

    On the t他的笨蛋 http plnkr co edit l3KoY3 p preview您可以注意到属性名称模式的奇怪行为data 在指令中 电话 Test of data named attribute br
  • 在 vue.js 中访问数组对象属性

    给定以下数组vue js packageMaps Object packageMap 0 Object Id 16 PackageType flag list ProductCode F BannerBase packageMap 1 Ob
  • 如何在 pg-promise 中设置模式

    我正在搜索的文档pg 承诺 https github com vitaly t pg promise特别是在创建客户端时 但我无法找到设置连接中使用的默认架构的选项 它始终使用public架构 我该如何设置 通常 为数据库或角色设置默认架构
  • 在 React.js 中编辑丰富的数据结构

    我正在尝试为数据结构创建一个简单的基于网格的编辑器 但我在使用 React js 时遇到了一些概念问题 他们的文档对此没有太大帮助 所以我希望这里有人可以提供帮助 首先 将状态从外部组件传输到内部组件的正确方法是什么 是否有可能将内部组件中
  • 在 ASP.NET Core MVC 中访问从视图到控制器的隐藏值

    我需要帮助使用 jQuery 从 ASP NET Core razor 视图页面传递隐藏控件值 jQuery 用于获取动态控件选定的值 section scripts
  • Javascript/Jquery:确定用户是否使用鼠标滚轮、滚动条或键盘滚动

    我正在尝试让用户界面正常工作 如果他们使用鼠标滚轮 我需要让它以一种方式滚动 如果他们使用滚动条 我需要让它以另一种方式滚动 如果他们使用键盘 我需要让它以另一种方式滚动 我相信滚轮和滚动条都充当鼠标事件 但是当单击滚动条时我无法让 jav
  • 导致回发到与弹出窗口不同的页面

    我有一个主页和一个详细信息页面 详细信息页面是从主页调用的 JavaScript 弹出窗口 当单击详细信息页面上的 保存 按钮时 我希望主页 刷新 是否有一种方法可以调用主页的回发 同时还可以从详细信息页面维护保存回发 Edit 使用win
  • 如何从图像输入中获取 xy 坐标?

    我有一个输入设置为图像类型

随机推荐

  • 不同命名空间中模板的特化

    我正在使用 C 开发一个跨平台库 MSVC 编译得很好 但 g 给我带来了问题 假设我有以下 Enum 辅助类 File Enum h ifndef ENUM H define ENUM H include
  • javascript正则表达式匹配特定域名

    我一直在尝试制作一个正则表达式来将 URL 与特定域名相匹配 所以如果我想检查这个网址是否来自 example com 什么 reg exp 应该是最好的 此 reg exp 应匹配以下类型的 URL http api example co
  • 如何在新标签页上打开谷歌广告?

    每当访问者点击网站上的 Google 广告时 该广告就会在同一页面中打开 从而取代我的网站 我就会失去该访问者 我们是否可以采取一些措施 以便每当网站访问者点击 Google 广告时 它就会在新标签中打开 有什么脚本需要修改吗 我尝试了一个
  • MongoDB:具有稀疏值的唯一稀疏复合索引

    我正在尝试存储以下链接 URL hostname i imgur com webid qkELz jpg 我想要在这两个字段上有一个唯一且稀疏的复合索引 因为 的组合hostname and webid应该是独一无二的 webid总是会被查
  • ggplot2:geom_ribbon,alpha 取决于每个 x 沿 y 轴的数据密度

    ggplot2 中有没有一种方法可以根据点的密度生成具有不同 alpha 的 geom ribbon 或其他基于区域的 geom 以下代码生成 50 个有噪声的正弦波 每个样本具有随机 x 值 我不想绘制每一个点 因为我可能需要一千次或更多
  • 获取单个 Windows 应用程序当前音量输出级别,如音频混合器中所示

    我正在尝试编写一个 C 代码 该代码从每个访问声音输出的 Windows 应用程序输出当前的音频输出级别 如音量混合器不断变化的绿色条所示 该程序将每 10 毫秒检查一次 并输出如下内容 Windows Media Player 30 Mo
  • 比较 PHP 中的多维数组

    如何在 php 中比较多维数组 有简单的方法吗 我知道的最简单的方法 a b 请注意 您还可以使用 它们之间的区别是 With 双等于 顺序很重要 a array 0 gt a 1 gt b b array 1 gt b 0 gt a va
  • c recv() 读取直到出现换行符

    我正在用 C 语言编写 IRC 机器人 但遇到了障碍 在我的主函数中 我创建了套接字并连接 所有这些快乐的事情 然后我有一个 几乎 无限循环来读取从服务器发回的内容 然后我将读取的内容传递给辅助函数 processLine char lin
  • 在 jekyll 博客中支持标签的简单方法

    我正在使用标准 jekyll 安装来维护博客 一切都很顺利 但我真的很想标记我的帖子 I can使用 YAML Front Matter 标记帖子 但如何为每个标签生成可以列出该标签的所有帖子的页面 这是一个解决方案在单个页面上按字母顺序排
  • TableLayoutPanel 的行/列着色(vs2008、winform)

    我可以为 TableLayoutPanel 中的整个行或列添加特定颜色吗 如何 请提供示例代码 如果有 提前致谢 是的你可以 使用 TableLayoutPanel 的 CellPaint 事件来测试哪一行 列调用了该事件 然后使用矩形的
  • 使用 tf.trainable_variables() 显示可训练变量的名称

    我正在处理weights in a RNNCell 我有以下代码 var names for var in tf trainable variables var names append var name 在另一个名为model py 我正
  • 正则表达式验证密码强度

    我的密码强度标准如下 8个字符长度 2 个大写字母 1 个特殊字符 2 个数字 0 9 3 个小写字母 有人可以给我同样的正则表达式吗 密码必须满足所有条件 您可以使用积极的前瞻断言来执行这些检查 A Z A Z 0 9 0 9 a z a
  • 我如何在discord.py中创建一个有效的斜杠命令

    我正在尝试使用 discord py 创建斜杠命令 我已经尝试了很多东西 但它似乎不起作用 如有帮助 将不胜感激 注意 我将在最后包含 pycord 的版本 因为我认为它更简单 也是最初的答案 不和谐 py版本 首先确保您安装了最新版本的d
  • Algolia 搜索网络错误

    我正在将 Algolia 与我拥有的 Firebase 项目连接起来 我使用 Firebase Cloud Functions 来使 Algolia 索引与 Firebase 数据库中发生的所有更改保持同步 但每当我打电话 索引 saveO
  • 为什么 CMP(比较)有时会在 8086 汇编中设置进位标志?

    我一直在阅读 8086 指令集 它说 CMP 比较 可以设置进位标志 我知道比较会减去两个操作数 但我想知道在这种情况下是否有人可以提供一个示例 我只是无法理解添加数字和负数将设置进位标志的想法 我已经阅读了借用标志 但我只需要一个示例来阐
  • Bootstrap:移动显示上的列之间的间隙

    我正在使用 bootstrap 3 0 制作一个网站 我希望 HTML 和 CSS 能够在桌面 平板电脑和移动设备上清晰地看到 我遇到的一个问题是 当您在移动显示器上查看该网站时 该列会堆叠在一起 我并不是在批评它 因为它会尽可能地停止滚动
  • 白名单不适用于人行横道离子

    我使用 ionic 创建了一个工作应用程序 从我的网站获取数据没有问题 一切都很好 然后我去添加人行横道 现在当我在 Android 手机上运行它时出现错误 W XWalkCordovaResourceClient URL blocked
  • 无法从传输连接读取数据:控制台应用程序中的连接已关闭错误

    我在控制台应用程序中有这段代码 它在循环中运行 try HttpWebRequest request HttpWebRequest WebRequest Create search request Headers Add Accept La
  • 使用 TextFieldParser 处理包含未转义双引号的字段

    我正在尝试使用导入 CSV 文件文本字段解析器 一个特定的 CSV 文件由于其非标准格式而给我带来了问题 相关 CSV 的字段用双引号括起来 当特定字段中有一组附加的未转义双引号时 就会出现此问题 这是一个过于简单的测试用例 突出了这个问题
  • 谷歌地图 api v3 - 从外部点击打开信息窗口

    所以我有一个 V3 地图 其初始化如下 function init var mapCenter new google maps LatLng 51 5081289 0 128005 var map new google maps Map d