1

我正在尝试将 Here 地图集成到我的 Nodejs 网站中。我想要做的是在我的 app.js 文件中创建一个如下所示的地图对象。

var map = new H.Map(
          document.getElementById('mapContainer'),
          maptypes.normal.map,
          {
              zoom: 10,
              center: { lng: 13.4, lat: 52.51 }
          });

然后我想将此地图对象传递给我的 ejs 文件以显示。但我无法弄清楚如何将以下脚本加载到我的应用程序中。这些文件是Here maps提供的脚本,创建地图对象需要加载。

<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<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>

如果我尝试将这些文件加载​​到我的 ejs 文件中,我会收到一条错误消息,指出H is not defined。有人可以告诉我如何在我的应用程序中加载这些脚本,以便我可以访问新的 H.map(...)。以及如何使这些变量在我的 ejs 文件中可用

长话短说我想将以下代码添加到我的 nodejs 应用程序中,将 js 文件中 script 标签内的代码和 HTML 部分分隔为 EJS 文件

<html>
  <head>
  <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  <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>
  </head>
  <body>
  <div style="width: 640px; height: 480px" id="mapContainer"></div>
  <script>
    // Initialize the platform object:
    var platform = new H.service.Platform({
    'app_id': '{YOUR_APP_ID}',
    'app_code': '{YOUR_APP_CODE}'
    });

    // Obtain the default map types from the platform object
    var maptypes = platform.createDefaultLayers();

    // Instantiate (and display) a map object:
    var map = new H.Map(
    document.getElementById('mapContainer'),
    maptypes.normal.map,
    {
      zoom: 10,
      center: { lng: 13.4, lat: 52.51 }
    });
  </script>
  </body>
</html>

4

1 回答 1

1

由于您使用的是 EJS,因此您可能需要查看以下内容: 如何将外部 .js 文件包含到 ejs 节点模板页面

简而言之,EJS 中的脚本在页面发送到客户端之前在服务器端运行。

要使用第三方脚本,请尝试将它们安装在您的服务器端。

npm i here-js-api

然后将它们加载到您的脚本中: 将本地脚本文件添加到 EJS 视图

于 2018-11-15T01:48:47.510 回答