Question

有人能告诉我如何从这里的地图中获得简单的嵌入代码吗？我根本无法找到我认为应该在任何地图网站上的嵌入按钮。具有讽刺意味的是我在这里制作一个网站所以我不允许得到谷歌地图。感谢

Answer 1

对于一个简单的静态HERE地图，您应该看Map Image API - 这将嵌入一个简单的图像。但是，如果您想要一张可移动地图，可以使用IFrame中的HERE Maps API for JavaScript并传递您选择的纬度，经度和缩放级别，例如：类似的东西：

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  <link rel="stylesheet" type="text/css"
    href="http://js.api.here.com/v3/3.0/mapsjs-ui.css" />
  <script type="text/javascript" charset="UTF-8"
    src="http://js.api.here.com/v3/3.0/mapsjs-core.js"></script>
  <script type="text/javascript" charset="UTF-8"
    src="http://js.api.here.com/v3/3.0/mapsjs-service.js"></script>
  <script type="text/javascript" charset="UTF-8"
    src="http://js.api.here.com/v3/3.0/mapsjs-mapevents.js"></script>
  <script type="text/javascript"  charset="UTF-8"
    src="http://js.api.here.com/v3/3.0/mapsjs-ui.js"></script>
</head>
<body>
  <div id="map" style="width: 100%; height: 100%; background: grey" />
  <script  type="text/javascript" charset="UTF-8" >


/**
 * Obtains a value from a query string
 * @param  {String} name key in the query string
 * @return {String}      value
 */
function getParameterByName(name) {
  name = name.replace(/[\[]/,  '\\\[').replace(/[\]]/, '\\\]');
  var regex = new RegExp('[\\?&]'  + name + '=([^&#]*)'),
  results = regex.exec(location.search);
  return results === null ? '' :
    decodeURIComponent(results[1].replace(/\+/g, ' '));
}

/**
 * Moves the map to display at  agiven location
 * @param  {H.Map} map      A HERE Map instance within the application
 */
function moveMap(map, location, zoom){
    var lat = getParameterByName('lat'),
    lng = getParameterByName('lng');
    zoom = getParameterByName('zoom');

  map.setCenter({lat: lat, lng: lng});
  map.setZoom(zoom);
}


/**
 * Boilerplate map initialization code starts below:
 */

//Step 1: initialize communication with the platform
var platform = new H.service.Platform({
  app_id: '<YOUR APP ID>',
  app_code: '<YOUR APP CODE>',
  useHttps: true
});
var defaultLayers = platform.createDefaultLayers();

//Step 2: initialize a map  - not specificing a location will give a whole world view.
var map = new H.Map(document.getElementById('map'),
  defaultLayers.normal.map);

//Step 3: make the map interactive
// MapEvents enables the event system
// Behavior implements default interactions for pan/zoom (also on mobile touch environments)
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));

// Create the default UI components
var ui = H.ui.UI.createDefault(map, defaultLayers);

// Now use the map as required...
moveMap(map);


  </script>
</body>
</html>

可以调用Iframe来指定高度和宽度：

<iframe src=".../path-to-file/embed.html?lat=40.7057&lng=-73.9306&zoom=12" width="600" height="450" frameborder="0" style="border:0"></iframe>

结果是这样的：

Embedded New York

当然，您可以添加所有常用的其他内容，例如添加标记等，以使地图执行您想要的内容，而不仅仅是提供商提供的内容。为什么要限制为地图提供者提供的单一外观？

HERE Maps嵌入代码

1 个答案: