今も現サイトではgooglemap表示するのに「Mapperプラグイン」を利用させてもらっています。
ただ、近々MovableTypeを5.2系から最新バージョンの6へ変更すべく、開発環境作ってそっちでテンプレートを制作しつつ、プラグインが引き続き使用できるかどうか調査しています。
その過程で、残念ながら「Mapperプラグイン」は長らく更新がされていないため、googlemap ver3に対応しておらず、再構築時に見事にエラーを吐きました・・・。
このプラグインはもう使えないので、どうしようかなーと思っていたのですが、GoogleMap ver3のチュートリアルにまんま解決方法が掲載してありました。ありがたいことです。とはいってもほんの少しだけ改造したので一応備忘録として残しておこうと思います。
Mapperを使用していた時は、緯度・経度を入力するのにLon・Latというカスタムフィールドを作ってそこに値を入力することでとりあえずピンだけ立てる簡単な仕様だったので、今回も凝ったことはせずに、この仕様を引き継ぐことにしました。というわけで以下ソースコード
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', function()
{
var lng = <mt:Lon>;
var lat = <mt:Lat>;
var latlng = new google.maps.LatLng(lat, lng);
var mapOptions = {
zoom: 12,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true
};
var mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions);
var marker = new google.maps.Marker({
position: latlng,
map: mapObj
});
});
</script>
MovabeTypeのカスタムフィールドを使用するときは頭にmt:を付けないのいけないので、それぞれ下記のようにカスタムフィールドの値を変数に代入しています。元ソースコードから改変したところと言ったらここだけです。実に単純ですね・・・。
var lng = <mt:Lon>;
var lat = <mt:Lat>;
まぁとりあえず、これでGoogleMapで訪れたところを引き続き表示することができそうです。