Googleマップでマーカーを回転

私はこれを使用してGoogleマップのマーカーを回転させましたが、角度度は220に設定されています。ユーザーが角度を入力してボタンを回転させると、 googleマップで。このコードを編集してテキストボックスから値を取得するにはどうすればよいですか？ <canvas>で可能ですか？Googleマップでマーカーを回転

コードはここにある：

var angleDegrees = 220;

付：

<body onload="xz()" onunload="GUnload()"> 

<div id="map" style="width: 400px; height: 300px"></div> 

<script type="text/javascript"> 

function xz() 
{ 

if (GBrowserIsCompatible()) { 
    var angleDegrees = document.getElementById('angle').value; 
    var map = new GMap2(document.getElementById("map")); 
    var arrowIcon = new Image(); 

    var marker = new ELabel(new GLatLng(55.50, 2.50), '<canvas id="arrowcanvas" width="32" height="32"><\/canvas>', null, new GSize(-16, 16)); 

    arrowIcon.src = "http://i49.tinypic.com/mafqee.png"; 

    map.addOverlay(marker); 

    map.setCenter(new GLatLng(53.85, -1.80), 3); 

    var canvas = document.getElementById("arrowcanvas").getContext('2d'); 
    var angleRadians = (angleDegrees/180) * Math.PI; 

    var cosa = Math.cos(angleRadians); 
    var sina = Math.sin(angleRadians); 

    canvas.clearRect(0, 0, 32, 32); 
    canvas.save(); 
    canvas.rotate(angleRadians); 
    canvas.translate(16 * sina + 16 * cosa, 16 * cosa - 16 * sina); 
    canvas.drawImage(arrowIcon, -16, -16); 
    canvas.restore(); 
} 
} 
</script> 

<form> 
    <input type="text" size="13" id="angle" name="angle" value=""> </input> 

    <input type="submit" id="button2" value="Prika?i" class="btnsearch" onsubmit="xz(); return false;"> 


</form> 
</body>

出典

2012-05-12 Josip

この時点でどのようなエラーや問題が発生しているのかご教示ください。 –

これを起動して角度を入力すると、取得したものだけがGoogleマップに読み込まれます。コードでangleDegreesを何らかの値に設定すると、Googleマップ上にマーカーが表示されます。私は問題が何であるか分かりません – Josip

あなたはこのラインを自分のコードをコピーして置き換えることができます

var angleDegrees = document.getElementById('myTextbox').value;

ここで 'myTextbox'は入力フィールドに割り当てられたIDです。

出典

2012-05-12 16:54:50

しかし、うまくいきません：/ – Josip

@Josip私は 'angleDegress'と 'angleDegress'を最初に入力しましたが、正しいスペルを使用してください。それでも問題が解決しない場合は、使用しているコードで質問を更新してください。 –

質問が更新されます。 – Josip

Googleマップでマーカーを回転

答えて

関連する問題