私は一日中ドキュメントとサンプルを見て過ごしましたが、自分自身を裏返しにしています。これを行う正しい方法に導かれることを望んでいました。私はjQueryを使用しています。
目的は、物語が言及している国がどこにあるかを生徒に示す地図を作成することです。カット&ペーストソリューションを使用して一度実装しましたが、divを切り替えるとうまくいきません. ここのどこかでジオコーディングのコードを見つけました:
var geocoder = new google.maps.Geocoder();
var address = $("#infopanel .map a.header").text();
map = $("#infopanel .map div");
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
}
});
これは地図を追加するためのコードですが、ジオコーディングの結果を mapOptions の中心変数に取得する方法がわかりません。
var mapOptions = {
center: new google.maps.LatLng(*geocoded-data*),
zoom: 3,
mapTypeId: google.maps.MapTypeId.TERRAIN,
panControl: false,
zoomControl: true,
mapTypeControl: false,
scaleControl: false,
streetViewControl: false,
overviewMapControl: false
};
new google.maps.Map(map,mapOptions);
これは、この回答のサイズ変更/中央ソリューションを使用したslideToggleコードですが、ジオコーディングされたデータをsetCenterに取得するにはどうすればよいですか?
$("#infopanel ul li > div").slideToggle("fast"); // hide the content
$("#infopanel a.header").click(function(e){ // toggle the content.
var hascontent = $(this).next("div");
if (hascontent.length == 1) {
e.preventDefault();
$(this).next().slideToggle("slow", function () {
google.maps.event.trigger(map, "resize"); // resize map
map.setCenter(*geocoded-data*); // center map
});
}
});
コンテキストのために、すべてが収まる HTML を次に示します。
<li class="map"><a href="" class="header">Zimbabwe</a>
<div style="width:220px;height:220px;"><a href="http://maps.google.com.au/maps?q=Zimbabwe&z=3">Find Zimbabwe on Google Maps</a></div>
</li>
これら3つの点をどのように接続しますか?