这里 JavaScript API 3.0 - 如何实现可拖动标记

我想用最近发布的 JavaScript API 3.0 实现一个可拖动标记。

使用旧的 API 非常简单。将draggable 属性设置为true 后，您可以移动地图上的标记。

位于[此处][1]的新 API 3.0 的迁移指南指出，在地图对象上启用事件并将“draggable”属性设置为“true”后，必须实现相应的事件。

marker.addEventListener('dragstart', function() {
//handle drag start here
});
marker.addEventListener('drag', function() {
//handle drag here
});
marker.addEventListener('dragend', function() {
//handle drag end here
});

但我不确定如何在相应的事件中实现此拖动功能。当然必须计算新位置，但是要使标记根据鼠标位置移动会是什么样子呢？以下代码片段需要以某种方式扩展......

marker.addEventListener('drag', function(evt) {
  var coord = map.screenToGeo(evt.currentPointer.viewportX,
            evt.currentPointer.viewportY);
  evt.target.setPosition( coord );
});

感谢您的帮助， 塞帕尔

事件[1]：http://developer.here.com/documentation/download/maps_js_html5_nlp/3.0.5/Maps%20API%20for%20JavaScript%20v3.0.5%20Migration%20Guide.pdf http://developer.here.com/documentation/download/maps_js_html5_nlp/3.0.5/Maps%20API%20for%20JavaScript%20v3.0.5%20Migration%20Guide.pdf "here"

创建的工作示例可拖动的中的标记HERE JavaScript 3.0 地图 API可以在找到最近的标记 http://developer.here.com/api-explorer#maps-js/finding-the-nearest-marker例子。设置分为三个部分。

• 首先设定marker.draggable = true所以它可以接收drag events

  marker = new H.map.Marker(...);
  marker.draggable = true;
  map.addObject(marker);
  

• 其次禁用底层地图的默认可拖动性 （i.e.的实例H.mapevents.Behavior) 开始拖动时 标记对象：

  map.addEventListener('dragstart', function(ev) {
    var target = ev.target;
    if (target instanceof H.map.Marker) {
      behavior.disable();
    }
  }, false);
  
  
  map.addEventListener('dragend', function(ev) {
    var target = ev.target;
    if (target instanceof mapsjs.map.Marker) {
      behavior.enable();
    }
  }, false);
  

• 三、听者drag事件，并使用更新标记setPosition()

  map.addEventListener('drag', function(ev) {
    var target = ev.target,
        pointer = ev.currentPointer;
    if (target instanceof mapsjs.map.Marker) {
      target.setPosition(map.screenToGeo(pointer.viewportX, pointer.viewportY));
    }
  }, false);