目次

,

ここは旧トップページ＞日曜プログラミング

Yahoo!Map API 地図の表示

DokuWiki に Yahoo! JavaScriptマップAPI の地図を表示します。

デモ

Webサービス by Yahoo! JAPAN

PR

サンプル

【アプリケーションID】の部分を各自で取得したIDに書き換えて、このコードを挿入して下さい。 

<HTML>
<div id="map" style="width:400px; height:300px"></div>
 
<script type="text/javascript" charset="utf-8" src="https://map.yahooapis.jp/js/V1/jsapi?appid=【アプリケーションID】"></script>
<script type="text/javascript">
window.onload = function(){
    var ymap = new Y.Map("map");
    ymap.drawMap(new Y.LatLng(35.66572, 139.73100), 17, Y.LayerSetId.NORMAL);
}
</script>
<!-- Begin Yahoo! JAPAN Web Services Attribution Snippet -->
<a href="https://developer.yahoo.co.jp/about">
<img src="https://s.yimg.jp/images/yjdn/yjdn_attbtn2_105_17.gif" width="105" height="17" title="Webサービス by Yahoo! JAPAN" alt="Webサービス by Yahoo! JAPAN" border="0" style="margin:15px 15px 15px 15px"></a>
<!-- End Yahoo! JAPAN Web Services Attribution Snippet -->
</HTML>

DokuWikiの標準テンプレートの場合、スタイルシートの影響で上記だけでは表示されません。html構文的に正しくないかもしれませんが下記コードを追加しmapのスタイルシートを標準状態にしてください。 

<HTML>
<style>
  #map img{max-width:none;}
</style>
</HTML>

ここは旧トップページ＞日曜プログラミング