Google 地图 v3 与 MeteorJS 加载同步问题

2024-04-07

我的应用程序在 MeteorJS 框架上运行并使用谷歌地图(javascript api v3)。谷歌地图加载方案类似于此中解释的方案post https://stackoverflow.com/a/16797219/942899,和官方的很相似tutorial https://developers.google.com/maps/documentation/javascript/tutorial#HelloWorld。但有时加载应用程序会抛出重复的异常:

未捕获的类型错误:无法读取 null 的属性“lat”

下面的代码导致了这个问题(不幸的是,被缩小了):

function $H(a, b, c, d) {
    var e = c[B], f = new jB(d);
    f[p]("title", e);
    b[p]("draggableCursor", e, "cursor");
    var g = e.Nb;
    Q("click dblclick rightclick mouseover mouseout mousemove mousedown mouseup".split(" "), function(d) {
        S[z](b, d, function(e, q, s) {
            var v = a[Wp](e, !0);
            e = new U(v.lat(), v.lng()); //here, v is probably null 
        })
    })
}

我很确定这是加载同步问题:a)应用程序工作正常,并且仅在加载的第一秒内就抛出错误。 b) 这种情况在生产中经常发生,自然加载时间更长。

附:如果有帮助的话,我可以链接到我的应用程序。


我就是这样解决的google-maps v3在我的应用程序中加载,基本上它涉及声明一个反应性ready上的方法GoogleMaps一旦我们确定脚本已加载,该对象就会设置为 true。

client/lib/google-maps.js :

GoogleMaps={
  // public methods
  config:function(options){
    _.extend(this,options);
  },
  ready:function(){
    this._loadingDependency.depend();
    return this._ready;
  },
  // private methods
  _loaded:function(){
    this._ready=true;
    this._loadingDependency.changed();
  },
  // public members
  apiKey:"",
  // private members
  _ready:false,
  _loadingDependency:new Deps.Dependency()
};

_googleMapsLoaded=function(){
  GoogleMaps._loaded();
};

Meteor.startup(function(){
  if(!GoogleMaps.apiKey){
    throw new Meteor.Error(-1,"API key not set, use GoogleMaps.config({apiKey:YOUR_API_KEY});");
  }
  $.getScript("https://maps.googleapis.com/maps/api/js?key="+GoogleMaps.apiKey+"&callback=_googleMapsLoaded");
});

现在我们可以使用ready里面的方法GoogleMapsView模板rendered打回来 :

client/views/google-maps-view/google-maps-view.js :

<template name="GoogleMapsView">
  <div class="google-maps-view"></div>
</template>

Template.GoogleMapsView.rendered=function(){
  this.autorun(_.bind(function(){
    if(GoogleMaps.ready()){
      this.mapOptions={
        center:new google.maps.LatLng(48.8582,2.2945),
        zoom:15
      };
      this.map=new google.maps.Map(this.find(".google-maps-view"),this.mapOptions);
    }
  },this));
};
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Google 地图 v3 与 MeteorJS 加载同步问题 的相关文章

随机推荐

  • 我的应用程序由于 Android 上的权限问题而终止

    我正在编写这段代码来获取 GPS 位置 我已经 在 Android 属性上标记了 ACCESS COARSE LOCATION 和 ACCESS FINE LOCATION 我还确认了它是否在 AndroidManifest xml 中 但
  • 关闭键盘 - iOS 7 中的多个 UITextField

    下面您将找到我的主视图控制器的 h 和 m 文件 我有 3 个问题 1 因为我有多个 uitextfields 我是否必须为每个字段设置自己的 resignFirstResponder 语句 2 我会在哪里 用什么方法做到这一点 3 我辞去
  • UIButton 第一次点击后不可点击

    我试图在单击按钮时从底部引入一个子视图 但只有第一次该按钮是可点击的 动画按钮后第二次单击不可单击 这是代码 class AnimateView UIView var button UIButton var menuView UIView
  • 我在Excel中有3个时间段 - 我需要知道最长连续时间段的持续时间

    请帮忙 理想情况下 我真的很想仅使用公式来解决这个问题 而不是 VBA 或任何我认为 花哨 的东西 我所工作的项目为持续参与提供奖金 我们有三个 有时更多 参与时间段 这些时间段可能会重叠和 或可能有没有参与的空间 神奇的数字是 84 天的
  • 如何在另一个线程中设置文本视图的文本

    我试图在另一个线程 即子线程 中设置文本 但对于以下代码 它给出了错误 只有创建视图层次结构的原始线程才能触摸其视图 public void onCreate Bundle savedInstanceState super onCreate
  • 为什么 eclipse 无法正确部署我的动态 Web 项目?

    问题是 我在源代码控制下有一个 java 动态 Web 项目 并在我的 Eclipse 工作区中检出 之前 我能够从 eclipse 中在本地 Tomcat 服务器上运行 servlet 但是 我进行了一些更改 删除了一些文件并添加了一些新
  • 如何在 JavaScript 中旋转图像?

    我想在单击打开按钮时旋转风扇图像 单击关闭按钮 旋转停止 我的代码是 img src fan png width 200 br
  • Android 支持库 ActionBar NullPointerException 版本 2.2(级别 8) - 与preferences.xml冲突

    我正在使用 v7 支持库在 Android 2 x 上显示 ActionBar 当我将应用程序部署到 IDE Intellij IDEA 中的设备时 应用程序运行正常 当我使用 maven 构建并打包要部署到 Play 商店的应用程序时 我
  • 在 IPython Notebook 之间共享数据

    如果我有多个 IPython 笔记本在同一台服务器上运行 有什么办法可以在它们之间共享数据吗 例如 从另一个笔记本导入变量 谢谢 这对我有用 store 命令允许您在两个不同的之间传递变量 笔记本 data 这是我想要传递到不同笔记本的字符
  • DateTimePicker 控件不显示 AM/PM

    我在使用自定义格式 其中包括两个字母的 A M P M 的 DateTimePicker 控件时遇到问题 缩写 使用 en US CultureInfo DateTimeFormat ShortTimePattern 会导致 时 嗯tt 但
  • Python 运行守护进程子进程并读取标准输出

    我需要运行一个程序并将其输出收集到标准输出 该程序 socat 需要在 python 脚本运行期间在后台运行 Socat 一旦运行就会处于守护进程模式 但首先它会将一些行输出到标准输出 我的脚本的其余部分需要这些行 命令 socat d d
  • 如何访问证书扩展(信息)值?

    我有一个由变量访问的 X509Certificate 当我尝试获取证书的详细信息时 我设法通过提供的函数轻松获取 CriticalExtensions 值 但是我想要达到的是存储在证书中并由对象 ID 2 5 29 32 表示的非关键扩展
  • 在 Windows Server 2019 Core 中强制安装不兼容的 .inf 驱动程序 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我正在尝试在我的第六代 NUC 上安装 Server 2019 Core 尽管安装进展顺利 但当它在没有任何网络连接的情况下启动时 我想起
  • 用 C 处理 TCP 的部分返回

    我一直在读Beej 的网络编程指南 http beej us guide bgnet 获取 TCP 连接的句柄 在其中一个示例中 简单 TCP 流客户端的客户端代码如下所示 if numbytes recv sockfd buf MAXDA
  • 如何序列化和反序列化 JavaScript 对象?

    我需要序列化和反序列化 JavaScript 对象以将它们存储在数据库中 请注意 这些对象包含函数 因此我无法将它们存储为 JSON 因此无法使用 json2 js JavaScript 对象 当然是 JavaScript 的 反 序列化的
  • 在jmeter中设置整个请求url

    我有一个请求 它提供上传网址作为响应正文 uploadUrl https test com 9000 sample uploadurl I m able to extract the uploadUrl using JSON extract
  • Neo4j 中的自动增量

    有没有办法像在 Neo4j 的 MySQL 中一样设置 auto increment 例如 当我使用 GraphDatabaseService 对象创建节点时 我希望节点以 1000000000 等数字开头 非常感谢 看看这个答案 我可以在
  • 从 XSD 生成 Ruby 类

    有没有办法从 XSD 生成 Ruby 类 甚至可能是 ActiveResource 类 以便它们包含将类序列化为对初始 XSD 有效的 xml 的方法 我知道soap4r有xsd2ruby 但似乎生成的ruby类无法轻松序列化为xml 无耻
  • Android:滚动后 RecyclerView 内容混乱[关闭]

    Closed 这个问题需要调试细节 help minimal reproducible example 目前不接受答案 我使用 RecyclerView 来显示标记列表 并且值的每个标记都显示为 CardView 但是在RecyclerVi
  • Google 地图 v3 与 MeteorJS 加载同步问题

    我的应用程序在 MeteorJS 框架上运行并使用谷歌地图 javascript api v3 谷歌地图加载方案类似于此中解释的方案post https stackoverflow com a 16797219 942899 和官方的很相似