javascript - 这里-api 未捕获类型错误 : Cannot read property 'addDomListener' of undefined at

Question

我正在尝试将here-api map 集成到我的rails 5 应用程序中。一些背景我过去成功地完成了类(class)后，使用谷歌地图开发了一个类似的应用程序页面。使用here-api作为替代方案，因为谷歌最近在一定水平上收费。

我已经成功地能够显示带有 lng 和 lat 硬编码的此处 map 。然而当我尝试集成 Rails 数据库信息 lng 和 lng 时，我得到了一个空白屏幕， map 曾经是这样的。尝试与我过去集成谷歌时相同的命名约定和方法。我正在使用/使用过 gem 'geocoder', '~> 1.4'。当我将地址从表格转换为 lng ltd 时，我必须将其用于谷歌地图。chrome 控制台日志有错误: Uncaught TypeError: Cannot read property 'addDomListener' of undefined在行:H.Map.event.addDomListener(window, 'load', 初始化);

预期结果:本地址发生更改时，使用 addDom 进行初始化，它会使用新的 lng lat 更新数据库，并使用 var location 获取 lng 和 lat。代替成功的硬编码坐标。期望here-api使用这些lng、lat，并且它显示的 map 与硬编码版本相同。但是我得到一个空白屏幕。

工作:本地址更改时，正确的 lng 和 lat 会显示在数据库中，并且在 chrome 检查中，lng 和 lat 位于 html 中。

对于谷歌我必须使用这个:

google.maps.event.addDomListener(窗口, '加载', 初始化);

在这里我使用了(不确定其方法是否正确):H.Map.event.addDomListener(window, 'load', 初始化);

下面是不工作的应用程序的头部

<script src="http://js.api.here.com/v3/3.0/mapsjs-core.js"
          type="text/javascript" charset="utf-8"></script>
  <script src="http://js.api.here.com/v3/3.0/mapsjs-service.js"
          type="text/javascript" charset="utf-8"></script>
  <script src="http://js.api.here.com/v3/3.0/mapsjs-ui.js"
          type="text/javascript" charset="utf-8"></script>
  <link rel="stylesheet" type="text/css"
        href="http://js.api.here.com/v3/3.0/mapsjs-ui.css" />

下面是部分 View html.erb

<div class="card-body">
    <div id="mapContainer" style="width: 100%; height: 400px"></div>

    <script>
        var platform = new H.service.Platform({
            'app_id': 'my_appid_info-FROM_HERE',
            'app_code': 'myappcodeinfo_FROM HERE'
        });

        // Obtain the default map types from the platform objec

        var maptypes = platform.createDefaultLayers();



        // Instantiate (and display) a map object:
        function initialize() {
            var location = {lat: <%= @location.latitude %>, lng: <%= 
@location.longitude %>};
            var map = new 
H.Map(document.getElementById('mapContainer'), maptypes.normal.map, {
                center: location,
                zoom: 10

            });
        }


       H.Map.event.addDomListener(window, 'load', initialize);

    </script>


  </div>

非常感谢您的帮助。

Answer 1

没有这样的函数H.Map.event.addDomListener。

如果您想在窗口加载事件上调用initialize，请使用:

 window.addEventListener('load', initialize);

关于 map 事件，HERE在H.mapevents包下有一些方法。如果需要，请确保加载 mapsjs-mapevents.js。这对于在 map 对象上添加事件监听器，甚至在 map 上启用事件(如平移、缩放等)等操作非常有用。

您可以引用javascript examples .