这里映射 api：行为在 Microsoft Web 浏览器 ActiveX

编程问答 2022-05-28

问题描述

我在 Here maps about draggable Marker 中尝试了示例： Draggable Marker | Here

第一次尝试地图没有显示在 AX2009 Microsoft Web 浏览器 ActiveX 中。我从 vector 切换到 raster 并添加了 engineType: H.map.render.RenderEngine.EngineType.P2 IE11、Chrome 等默认网络浏览器中的标记，边缘工作正常，我可以拖动标记。但是在 AX2009 上的 ActiveX 中，标记没有拖动，但我可以像在默认 Web 浏览器中一样看到地图 istelf。任何想法我应该添加到代码中？任何帮助表示赞赏。

 <!DOCTYPE html>
<html>
  <head>
    <Meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <Meta
      name="viewport"
      content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"
    />
    <script src="https://js.api.here.com/v3/3.1/mapsjs-core.js"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-core-legacy.js"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-mapevents.js"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-service.js"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-service-legacy.js"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-ui.js"></script>
    <link
      rel="stylesheet"
      type="text/css"
      href="https://js.api.here.com/v3/3.1/mapsjs-ui.css"
    />
    <title>Simple Map</title>
    <style>
      html,body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 100%;
      }
    </style>
  </head>
  <body>
    
    <div id="map"></div>
    <script>
var point = {lat:56.983849,lng:24.237360};
var apikey = "xxx",platform = new H.service.Platform({
          apikey: apikey,}),pixelRatio = window.devicePixelRatio || 1,ppi,defaultLayers,mapElement = document.getElementById("map"),tileSize,map,behavior,ui;
      if (pixelRatio > 1) {
        ppi = 250;
      }
      defaultLayers = platform.createDefaultLayers({
        ppi: ppi,});
      map = new H.Map(mapElement,defaultLayers.raster.normal.map,{
        zoom: 14,center: point,renderBaseBackground: { lower: 2,higher: 2 },pixelRatio: pixelRatio,engineType: H.map.render.RenderEngine.EngineType.P2D,});
      window.addEventListener("resize",function () {
        map.getViewPort().resize();
      });

      function addDraggableMarker(map,behavior){

var marker = new H.map.Marker(point,{
  // mark the object as volatile for the smooth dragging
  volatility: true
});
// Ensure that the marker can receive drag events
marker.draggable = true;
map.addobject(marker);

// disable the default draggability of the underlying map
// and calculate the offset between mouse and target's position
// when starting to drag a marker object:
map.addEventListener('dragstart',function(ev) {
  var target = ev.target,pointer = ev.currentPointer;
  if (target instanceof H.map.Marker) {
    var targetPosition = map.geoToScreen(target.getGeometry());
    target['offset'] = new H.math.Point(pointer.viewportX - targetPosition.x,pointer.viewportY - targetPosition.y);
    behavior.disable();
  }
},false);


// re-enable the default draggability of the underlying map
// when dragging has completed
map.addEventListener('dragend',function(ev) {
  var target = ev.target;
  if (target instanceof H.map.Marker) {
    behavior.enable();
  }
},false);

// Listen to the drag event and move the position of the marker
// as necessary
 map.addEventListener('drag',pointer = ev.currentPointer;
  if (target instanceof H.map.Marker) {
    target.setGeometry(map.screenToGeo(pointer.viewportX - target['offset'].x,pointer.viewportY - target['offset'].y));
  }
},false);
      }

      behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
      ui = H.ui.UI.createDefault(map,defaultLayers);


      addDraggableMarker(map,behavior);

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

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）