Openlayers 3 OL3：选择要拖放到另一个坐标的图像/标记（视觉问题OpenLayers 3）

我正在用图像测试地图上的标记。不幸的是，我还不了解选择和拖放的概念。以下是我的例子：

正如你所看到的。。。有一个标记（图像），可以拖动，但视觉效果不是我喜欢的：

问题: -为什么我要用这个奇怪的蓝色圆圈来选择/拖动图像？如何更改此视觉效果？事实上，我喜欢完全隐藏蓝色选择圈，应该只有一个图像。 -我是否可以选择在整个图像上拖动图像（而不仅仅是在图像的位置上）？如果我选择蓝色标记，标记现在是可拖动的，但我喜欢在整个图像区域上进行拖动

欢迎任何提示！

---

感谢提供样式，您需要在覆盖层和修改交互中设置样式。从你自己的角度来看

对于根据图标形状进行选择，我没有确切的答案：您可以使用

pixelTolerance

作为中间解决方案

---

似乎添加拖动功能会更好，特别是对于图标形状问题

您需要的是拖动功能的交互。但不幸的是，这种互动目前并不存在。据我所知，在ol3 GitHub中还没有公开的问题。谢谢！这很简单，但了解整个风格确实很有帮助。我将玩pixelTolerance。更新答案，因为WIP在拖动交互上

    // Create the background layer
var layer = ga.layer.create('ch.swisstopo.pixelkarte-farbe');

// Create a map
var map = new ga.Map({
  target: 'map',
  layers: [layer],
  view: new ol.View2D({
    resolution: 1,
    center: [600000, 200000]
  })
});

// Create a local GeoJson
var myGeoJson = {
    "type": "FeatureCollection",
    "features": [
        {
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [
                    600000.0000000001,
                    200000.00000000006
                ]
            }
        },
        {
            "type": "Feature",
            "geometry": {
                "type": "Point",
                "coordinates": [
                    668900.0000000001,
                    162000.00000000003
                ]
            }
        }
    ]
};

// Define a geojson data source 
var source = new ol.source.GeoJSON();

// Read the local geojson 
var features = source.readFeatures(myGeoJson);

// Create a vector source and assign the GeoJson features to it
var vectorSource = new ol.source.Vector({
  features: features
});

// Create a vector layer using the vector source
var vectorLayer = new ol.layer.Vector({
  source: vectorSource
});

// Create a point icon style
var iconStyle = new ol.style.Style({
  image: new ol.style.Icon(({
    src: '//map.geo.admin.ch/1403704943/img/marker.png',
    offset: [1,1],
  }))
});

// Apply the style to the vector layer
vectorLayer.setStyle(iconStyle);

// Add the vector layer in the map
map.addLayer(vectorLayer);




var featureOverlay = new ol.FeatureOverlay({
  map: map,  
  image: new ol.style.Icon({src: '//map.geo.admin.ch/1403704943/img/marker.png'})
});


var highlight;
var displayFeatureInfo = function(pixel) {

  var feature = map.forEachFeatureAtPixel(pixel, function(feature, layer) {
    return feature;
  });


  if (feature !== highlight) {
    if (highlight) {
      featureOverlay.removeFeature(highlight);
    }
    if (feature) {
      featureOverlay.addFeature(feature);
    }
    highlight = feature;
  }

};



$(map.getViewport()).on('mousemove', function(evt) {
  var pixel = map.getEventPixel(evt.originalEvent);
  displayFeatureInfo(pixel);
});



var modify = new ol.interaction.Modify({
  features: featureOverlay.getFeatures(),
  // the SHIFT key must be pressed to delete vertices, so
  // that new vertices can be drawn at the same position
  // of existing vertices
  deleteCondition: function(event) {
    return ol.events.condition.shiftKeyOnly(event) &&
        ol.events.condition.singleClick(event);
  }
});
map.addInteraction(modify);