地図
Home
/ map
地図
03 Leaflet
2020.02.09 当サイト内で使用している地図をLeaflet+地理院地図に置き換えるためのテスト版
https://leafletjs.com/
サンプル 0 基礎
01 地図の表示(国土地理院標準地図)
02 地図の表示(国土地理院淡色地図)
03 アイコンの表示
04 任意の画像を使用したアイコンの表示
05 ポップアップ内に画像
06 ポップアップ内にリンクつき画像
サンプル 1 データ処理
11 ソース内GeoJSONの表示デフォルトアイコン
12 ソース内GeoJSONの表示オリジナルアイコン
13 外部GeoJSONからの表示アイコンのみ
14 外部GeoJSONからの表示ポップアップつき
15 URLリンク(GET)からの地図操作
16 中心経度緯度表示
サンプル 2 デザイン
21 全体にサイトスタイル
22 ポップアップにもサイトスタイル
23 ブラウザリサイズ対応
24 レイヤーコントロール&出典詳細追加
25 GeoJSONをオーバーレイとして追加
26 ズームレベル表示
地理院タイル 出典詳細
02 YOLP - Yahoo!地図
2020.02.12 置き換えたYOLP版 更新停止
YOLP版 撮影地地図
2019.03.22 当サイト内で使用している地図を Yahoo!地図に置き換えるためのテスト版
サンプル 0 基礎
01 地図の表示
02 マウス操作できる地図
03 コントロール付きの地図
04 アイコンの表示
05 任意の画像を使用したアイコンの表示
06 アイコンマウスオーバーでアイコンタイトルを表示
07 アイコンクリックで情報ウィンドウを表示
08 情報ウィンドウ内をHTMLで記述する
09 情報ウィンドウ内にリンク付き写真
サンプル 1 データ処理
11 ソース内JSONの表示
12 外部JSONからの表示
13 外部JSONからの複数表示
14 読み込み中のプログレス表示(動作不良)
15 URLリンク(GET)からの地図操作Pan
16 URLリンク(GET)からの地図操作Zoom
17 中心緯度経度表示static
18 中心緯度経度表示dynamic
19 中心点表示(オプション)
サンプル 2 デザイン
21 全体にサイトスタイル
22 情報ウィンドウ内にサイトスタイル
23 ブラウザリサイズ対応
01 GoogleMap
2019.03.23 置き換えたGoogleMap版 更新停止
GoogleMap版 撮影地地図