openlayers 3アイコンのオフセットと回転

Question

私は次の問題があります：http://imgur.com/a/gORfM。

JSFiddleが追加さ：https://jsfiddle.net/AJR80/phwq2v1k/

をこれは私が矢印に使用するコードです...残りはJSFiddleで見ることができます。写真で

var style2 = new ol.style.Style({ 
     image: new ol.style.Icon(({ 
      anchor: [0, 0], 
      anchorXUnits: "pixels", 
      anchorYUnits: "pixels", 
      offset: [0,0], 
      offsetOrigin: 'bottom-left', 
      src: 'https://i.imgur.com/YKy2qfG.png', 
      rotation: 0 
     })) 
    }); 

矢印が1 ol.Style.Iconあり、白丸で「背景画像」とは、別のol.Style.Iconで、テキストはol.Style.Textです。すべて同じ座標を持ち、アンカー設定を使用することで、テキストと背景を画面上の正しい場所に移動できます。矢印は私を泣かせるものです...

背景の白い円の中で矢印を回転させたいので矢印のアンカーを使用できません。矢印のオフセットを変更しようとすると、画像がカットされます。

「中央」を背景の白い円の真ん中に移動したいだけです。それはできますか？これまでのところ私は解決策を見いださなかった...誰かがそれを見つけるのを助けることができる？

非常に高く評価されました！

アンティ

Answer 1

答えはここにある：https://jsfiddle.net/phwq2v1k/4/

var vectorLayer = new ol.layer.Vector({ 
    updateWhileAnimating: true, 
    updateWhileInteracting: true, 
    source: vectorSource, 
    style: function(feature, resolution) { 
    var coords = feature.getGeometry().getCoordinates(); 
    coords[0] += 2 * resolution; 
    coords[1] += 17 * resolution; 
    style2.setGeometry(new ol.geom.Point(coords)); 
    style2.getImage().setRotation(feature.get('rotation')); 
    return styleArray; 
    } 
});