GoogleマップV3で画像を回転しますか？

Question

Googleマップv3でJavaScriptが必要です。イメージがあり、それを有効にする必要があります。それはうまくいきますが、実際の問題はマーカーを呼び出す方法がわからず、マーカーを修正することができないためです。

onload=function(){ 
rotate.call(document.getElementById('im'),50); 
} 
</script> 
<img id="im" src="http://www.sl2o.com/tc/picture/Fleche.PNG" width="97" height="100" /> 

だからここにある：その後、私はこれを持って

sURL = 'http://www.sl2o.com/tc/picture/Fleche.PNG'; 
iWidth = 97; 
iHeight = 100; 

mImage = new google.maps.MarkerImage(sURL, new google.maps.Size(iWidth,iHeight), new google.maps.Point(0,0), new google.maps.Point(Math.round(iWidth/2),Math.round(iHeight/2))); 

var oMarker = new google.maps.Marker({ 
'position': new google.maps.LatLng(iStartLat,iStartLon), 
'map': map, 
'title': 'mon point', 
'icon': mImage 
}); 

：

マーカー：私はあなたのコードの一部を示しています。あなたが見ることができるように、私はこのイメージを作り出しています、そして、私は実際にマーカーを完成させる必要があります。どうしたらいいですか？何時間も何時間も働いています。ありがとうございました ！！

Answer 1

残念ながら、Google Maps APIはimg要素にアクセスするための方法を提供していません（私は何度もそれを探してきました）。 img要素はDOMツリーに混在しているため、検索可能です。すなわち：これは、指定されたsrcを持つすべてのIMG-elmentsを向けるだろう

var imgElements = document.getElementsByTagName('img'), 
    i = 0; 
for (i = 0; i < imgElements.length; i+= 1) { 
    if (imgElements[i].src === 'http://www.sl2o.com/tc/picture/Fleche.PNG') { 
     rotate.call(imgElements[i], 50); 
    } 
} 

、あなたはより具体的にはif文にさらに条件を追加することができます。

しかし、これは通常、多くのマーカーが同じimg srcを持つので、通常は良い解決策ではありません。

私は複数のイメージを作成し、Photoshop（または他のイメージ操作ツール）でそれらを回転させ、使用するそれぞれのバリアントに対して新しいMarkerImageを作成します。また、.setIcon（）でマーカーの画像を変更します。すなわち：私のプロジェクトで

oMarker.setIcon(mImage); 

..fredrik

Answer 2

私は、画像を回転したいです。私はmarkerImagesの多くを構築する理由 ザッツ：（VAR I = 1; I < 31; I ++）のための { nadelimages [i]は=新しいgoogle.maps.MarkerImage（ 」./static/map/Kompass_'+i+ '.png'、 新しいgoogle.maps.Size（w、w）、 新しいgoogle.maps.Point（0,0）、 新しいgoogle.maps.Point（w/2、w/2） ）;今

： VAR rotatePin =関数（）{ のNi =のNI + 1 IF（NI> 29）NI = 1。 nadelMarkers [1] .setIcon（nadelimages [ni]）; setTimeout（rotatePin、100）; setIcon上記溶液に }

は更新いけないが、それは新しいマーカ画像を挿入。マーカーの数が増えています。

するvar rotatePin =関数（）{ のNi =のNI + 1 （NI> 29）場合NI = 1。 nadelMarkers [1] .setIcon（ './ static/map/Kompass _' + ni + '。png'）; setTimeout（rotatePin、100）; }

この場合は正常ですが、中心は画像の中心ではなく中心の底です。

その他のソリューション？

ライナー