个人中心
gpt4 book ai didi

javascript - Google Map JS V3 异步加载 - 未捕获类型错误 : undefined is not a function

转载 作者：行者123 更新时间：2023-11-28 07:45:13 24 4
gpt4 key购买 nike

已寻找解决方案并尝试了迄今为止找到的大部分内容。我对 Google map 和 Javascript 都是新手。希望有人能看到我在这里缺少的东西(提前谢谢你!)。

我直接使用 Google Maps Tutorial 中的示例。我正在按照页面中间大约一半处的异步加载 API 的说明进行操作。

我已经按照指定的方式处理了代码。在页面上创建 div 元素，确保 body 和 div 都有高度和宽度。在使用调试器单步调试代码时，它会通过 loadScript 成功在 DOM 上设置脚本。然后它在完成后立即失败(看起来是这样)。据我所知，初始化函数似乎未定义？不确定我需要做什么。

再次，我们将非常感谢您的帮助/见解。我的额头瘀青了;)

bower.json

{ "name": "移动那里", “私有(private)”:真实， “依赖项”:{ “Angular ”:“〜1.2.28”， "json3": "^3.3.0", “Angular 引导”:“〜0.12.0”， " Bootstrap ": "~3.2.0", "Angular 动画": "~1.2.28", “Angular cookies ”:“〜1.2.28”， “Angular 资源”:“~1.2.28”， “Angular 路线”:“〜1.2.28”， “Angular 清理”:“~1.2.28”， “Angular 触摸”:“〜1.2.28”， “洛达什”:“〜2.4.1” }, “开发依赖项”:{ “Angular 模拟”:“〜1.2.28”， “Angular 场景”:“~1.2.28” }, “应用程序路径”:“应用程序”， “决议”:{ “Angular ”:“1.2.28” }}

记录控制台输出###

  • 未捕获类型错误:未定义不是函数 VM23109:1
  • (匿名函数)main.js:13
  • (匿名函数)main.js:26
  • (匿名函数)main.js:25
  • Jf main.js:26
  • Zf main.js:54
  • (匿名函数)main.js:54
  • google.maps.Load js?v=3.exp&callback=initialize:21
  • (匿名函数)main.js:55
  • (匿名函数)

app.js

//app.js
//
angular.module('MovnThereUI',[
    'ui.bootstrap',
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch'
  ]).run([
        '$rootScope',
        '$location',
        '$http',
        '$window',
        'AuthFactory',
        'UserFactory',
        'TypeAheadFactory',
        function(
            $rootScope,
            $location,
            $http,
            $window,
            AuthFactory,
            UserFactory,
            TypeAheadFactory
        ) {
            'use strict';
            $rootScope.$on('$routeChangeStart', function(event, next) {

                if (AuthFactory.isAuthenticated()) {
                    if (AuthFactory.isAuthenticated()) {
                        $http.defaults.headers.common['Authorization'] = 'Token token=' + $window.sessionStorage.getItem('movnThereUI.user');
                    }

                    UserFactory.fetch();
                } else {
                    if (($location.path() !== '/login') && ($location.path() !== '/signup')) {
                        $location.path('/login');
                    }
                }
            });



            function initialize() {
                debugger;
              var mapOptions = {
                zoom: 8,
                center: new google.maps.LatLng(-34.397, 150.644)
              };

              var map = new google.maps.Map(document.getElementById('map-canvas'),
                  mapOptions);
            }

            function loadScript() {
              var script = document.createElement('script');
              script.type = 'text/javascript';
              script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&' +
                  'callback=initialize';
              document.body.appendChild(script);
            }

            window.onload = loadScript;



        }
    ]
);
/* app.css */
html, body, #map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

.nav, .pagination, .carousel, .panel-title a {
  cursor: pointer;
}
<!-- index.html -->
</head>
  <body ng-app="MovnThereUI">

    <ng-include src="'views/partials/navbar.html'"></ng-include>

    <ng-view></ng-view>
    <div id="map-canvas"></div>
    
    .......snip

最佳答案

只是我的两分钱，initialize 应该绑定(bind)到 window 对象，无论加载 gmap 脚本的上下文如何。

所以我想解决这个问题，你可以尝试使用window.initialize = function(){..} 。但有些人可能不想要这个!

关于javascript - Google Map JS V3 异步加载 - 未捕获类型错误 : undefined is not a function，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27513991/

24 4 0
文章推荐： c# - PInvoke - 方法的类型签名与 PInvoke 不兼容
文章推荐： c++ - 泛化模型中的数据访问。避免宏的方法？
文章推荐： c++ - 索引字符串和国际化
文章推荐： javascript - 为什么子框架可以重定向父框架？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com