地図をたくさん張ると結構重いのでサンプルだけページを分離した。
さらに追加→PukiwikiでGoogleMaps2サンプル2, PukiwikiでGoogleMaps2サンプル3
&googlemaps2(width=300px, height=200px, mapctrl=small); &googlemaps2_icon(神社, image=ihttp://reddog.s35.xrea.com/img/googlemaps/mm_sample.png, shadow=http://www.google.com/mapfiles/shadow50.png, iw=20, ih=34, sw=37, sh=34, ianchorx=10, ianchory=34, sanchorx=10, area="1 7 7 0 13 0 19 7 19 12 13 20 12 23 11 34 9 34 8 23 6 19 1 13 1 7", transparent=http://reddog.s35.xrea.com/img/googlemaps/transparent.png); -&googlemaps2_mark(35.039379, 135.729248, title=金閣寺, caption=足利義満の別荘。先日変な男が光ケーブルを接続するために車で突っ込んだ。東側の門は暇そうな警備員が守りを固めている。（長文サンプル）, image=http://reddog.s35.xrea.com/img/googlemaps/img_kinkaku.jpg);~ -&googlemaps2_mark(35.031087, 135.735106, title=北野天満宮, caption=菅原道真を祭ってる, icon=神社);~ -&googlemaps2_mark(35.028723, 135.712963, title=仁和寺,caption=和尚が名物(嘘）);~ -&googlemaps2_mark(35.034477, 135.718348, title=龍安寺,caption=石庭のうずまきが有名);~
| 貴船神社奥宮 | 宝ヶ池 | 西陣京極 |
|&googlemaps2(mapname=tmap0, lat=35.128982, lng=135.765094, width=100px, height=100px, mapctrl=smallzoom, type=n, typectrl=none, zoom=16);|&googlemaps2(mapname=tmap1, lat=35.058877, lng=135.780415, width=100px, height=100px, mapctrl=smallzoom, type=n, typectrl=none, zoom=16);|&googlemaps2(mapname=tmap2, lat=35.025717, lng=135.743486, width=100px, height=100px, mapctrl=smallzoom, type=n, typectrl=none, zoom=16);| |CENTER:貴船神社奥宮|CENTER:宝ヶ池|CENTER:西陣京極|
あまりたくさんにすると重くなるのでほどほどにしたほうがいいような。
&googlemaps2(lat=35.7643434, lng=136.933593, mapname=hng, width=400px, height=300px, mapctrl=small, typectrl=normal, zoom=6); &googlemaps2_mark(0, 0, define=hngml, map=hng, formatlist=%title%, zoom=10, noicon=1, noinfowindow=1); &googlemaps2_mark(0, 0, define=hngmm, map=hng, formatlist=%title%, zoom=14); -&googlemaps2_mark(35.063725, 135.705871, class=hngml, title=本陣); --&googlemaps2_mark(35.010328, 135.768285, class=hngmm, title=織田信長); --&googlemaps2_mark(35.036912, 135.753969, class=hngmm, title=織田信忠); --&googlemaps2_mark(35.013373, 135.581932, class=hngmm, title=明智光秀); -&googlemaps2_mark(34.685169, 135.488891, class=hngml, title=南部戦線); --&googlemaps2_mark(34.687781, 135.52597, class=hngmm, title=丹羽長秀); --&googlemaps2_mark(34.582026, 135.468957, class=hngmm, title=徳川家康); --&googlemaps2_mark(34.605625, 136.532507, class=hngmm, title=織田信雄); -&googlemaps2_mark(35.603718, 135.123596, class=hngml, title=北部戦線); --&googlemaps2_mark(35.565764, 135.147661, class=hngmm, title=細川忠興); -&googlemaps2_mark(36.659606, 138.317871, class=hngml, title=東部戦線, zoom=10); --&googlemaps2_mark(36.813631, 137.397122, class=hngmm, title=柴田勝家); --&googlemaps2_mark(36.392667, 139.061208, class=hngmm, title=滝川一益); --&googlemaps2_mark(36.565771, 138.196442, class=hngmm, title=森長可); -&googlemaps2_mark(34.714524, 133.879394,34, class=hngml, title=西部戦線); --&googlemaps2_mark(34.693832, 133.82206, class=hngmm, title=羽柴秀吉);
&googlemaps2(lat=34.984326, lng=135.709562, mapname=ovtest, width=400px, type=sat, mapctrl=smallzoom, height=250px, overviewctrl=show, overviewwidth=120, overviewheight=120); &googlemaps2_mark(34.984326,135.709562, map=ovtest, title=桂離宮, nolist=1, alink=0);
&googlemaps2(mapname=tgtest, width=300px, height=200px, mapctrl=small, togglemarker=true, typectrl=none, zoom=6); &googlemaps2_icon(default, define=menicon, image=http://reddog.s35.xrea.com/img/googlemaps/mm_udon.png, shadow=http://www.google.com/mapfiles/shadow50.png, iw=20, ih=34, sw=37, sh=34, ianchorx=10, ianchory=34, sanchorx=10, area="1 7 7 0 13 0 19 7 19 12 13 20 12 23 11 34 9 34 8 23 6 19 1 13 1 7", transparent=http://reddog.s35.xrea.com/img/googlemaps/transparent.png); &googlemaps2_icon(うどん派, class=menicon, image=http://reddog.s35.xrea.com/img/googlemaps/mm_udon.png); &googlemaps2_icon(そば派, class=menicon, image=http://reddog.s35.xrea.com/img/googlemaps/mm_soba.png); &googlemaps2_icon(きしめん派, class=menicon, image=http://reddog.s35.xrea.com/img/googlemaps/mm_kisimen.png); &googlemaps2_mark(0,0, define=tgmark, map=tgtest, nolist=1, noinfowindow=1); &googlemaps2_mark(34.070862, 134.516601, class=tgmark, icon=うどん派); &googlemaps2_mark(34.252676, 133.923339, class=tgmark, icon=うどん派); &googlemaps2_mark(33.669496, 133.527832, class=tgmark, icon=うどん派); &googlemaps2_mark(33.815666, 132.758789, class=tgmark, icon=うどん派); &googlemaps2_mark(34.633207, 133.923339, class=tgmark, icon=うどん派); &googlemaps2_mark(34.415973, 132.495117, class=tgmark, icon=うどん派); &googlemaps2_mark(35.012002, 135.681152, class=tgmark, icon=うどん派); &googlemaps2_mark(34.705493, 136.494140, class=tgmark, icon=うどん派); &googlemaps2_mark(35.155845, 136.933593, class=tgmark, icon=きしめん派); &googlemaps2_mark(35.442770, 136.735839, class=tgmark, icon=きしめん派); &googlemaps2_mark(34.669358, 135.505371, class=tgmark, icon=うどん派); &googlemaps2_mark(34.723554, 135.175781, class=tgmark, icon=そば派); &googlemaps2_mark(34.687427, 135.791015, class=tgmark, icon=そば派); &googlemaps2_mark(36.066862, 136.208496, class=tgmark, icon=そば派); &googlemaps2_mark(36.650663, 138.180327, class=tgmark, icon=そば派); &googlemaps2_mark(35.478564, 134.187011, class=tgmark, icon=そば派); &googlemaps2_mark(35.012002, 138.427734, class=tgmark, icon=そば派);
googlemaps2でオプションにtogglemarker=trueを指定する。
&googlemaps2(mapname=drawtest, lat=35.021511, lng=135.773460, width=400px, height=400px, scalectrl=normal, mapctrl=small, typectrl=normal, zoom=12); &googlemaps2_draw(circle, map=drawtest, weight=10, lat=35.02, lng=135.73, color=#FF0000, opacity=0.5, radius=1.1, fillopacity=0); &googlemaps2_draw(circle, weight=10, lat=35.045, fillcolor=#0000FF, fillopacity=0.5); &googlemaps2_draw(arc, weight=10, lat=35.02, lng=135.76, inradius=0, stangle=0, edangle=290, fillopacity=0); &googlemaps2_draw(arc, weight=10, lat=35.045, inradius=0.4, fillopacity=0.5, fillcolor=#00FF00); &googlemaps2_draw(ngon, rotate=0, n=3, lat=34.995, lng=135.73, weight=0, fillcolor=#AAAA00, fillopacity=1.0); &googlemaps2_draw(ngon, rotate=0, n=4, lng=135.76, fillopacity=0.8); &googlemaps2_draw(ngon, rotate=0, n=5, lng=135.79, fillopacity=0.6); &googlemaps2_draw(ngon, rotate=0, n=6, lng=135.82, fillopacity=0.4);
&googlemaps2(mapname=crosstest, lat=34.718598, lng=135.304849, width=300px, height=300px, mapctrl=small, typectrl=normal, zoom=15, crossctrl=show);
&googlemaps2(mapname=maxurltest, lat=34.989503, lng=135.751876, width=300px, height=300px, mapctrl=small, typectrl=normal, zoom=9); &googlemaps2_mark(34.989503,135.751876, map=maxurltest, title=cookiejar, caption=maxurlでPukiwikiの別のページを開くサンプル。このマーカーに地理的な意味は無い, maxurl=cookiejar, nolist=1);
マーカーを最大化してcookiejarを表示しています。
&googlemaps2(lat=35.7643434, lng=136.933593, mapname=zoommk, width=400px, height=300px, mapctrl=small, typectrl=normal, zoom=6); &googlemaps2_icon(default, define=sensen, shadow=, iw=30, ih=100, sw=0, sh=0, ianchorx=15, ianchory=50, transparent=); &googlemaps2_icon(本陣, class=sensen, image=http://reddog.s35.xrea.com/img/googlemaps/mztCenter.gif, ih=50, ianchory=25); &googlemaps2_icon(東部戦線, class=sensen, image=http://reddog.s35.xrea.com/img/googlemaps/mztEast.gif); &googlemaps2_icon(西部戦線, class=sensen, image=http://reddog.s35.xrea.com/img/googlemaps/mztWest.gif); &googlemaps2_icon(南部戦線, class=sensen, image=http://reddog.s35.xrea.com/img/googlemaps/mztSouth.gif); &googlemaps2_icon(北部戦線, class=sensen, image=http://reddog.s35.xrea.com/img/googlemaps/mztNorth.gif); &googlemaps2_mark(0, 0, define=zoommkwide, map=zoommk, formatlist=%title%, minzoom=0, maxzoom=7, noinfowindow=1, nolist=1); &googlemaps2_mark(0, 0, define=zoommkdetail, map=zoommk, formatlist=%title%, minzoom=8, maxzoom=17, nolist=1); &googlemaps2_mark(35.063725, 135.705871, class=zoommkwide, title=本陣, icon=本陣); &googlemaps2_mark(35.010328, 135.768285, class=zoommkdetail, title=織田信長); &googlemaps2_mark(35.036912, 135.753969, class=zoommkdetail, title=織田信忠); &googlemaps2_mark(35.013373, 135.581932, class=zoommkdetail, title=明智光秀); &googlemaps2_mark(34.685169, 135.488891, class=zoommkwide, title=南部戦線, icon=南部戦線); &googlemaps2_mark(34.687781, 135.52597, class=zoommkdetail, title=丹羽長秀); &googlemaps2_mark(34.582026, 135.468957, class=zoommkdetail, title=徳川家康); &googlemaps2_mark(34.605625, 136.532507, class=zoommkdetail, title=織田信雄); &googlemaps2_mark(35.603718, 135.123596, class=zoommkwide, title=北部戦線, icon=北部戦線); &googlemaps2_mark(35.565764, 135.147661, class=zoommkdetail, title=細川忠興); &googlemaps2_mark(36.659606, 138.317871, class=zoommkwide, title=東部戦線, icon=東部戦線); &googlemaps2_mark(36.813631, 137.397122, class=zoommkdetail, title=柴田勝家); &googlemaps2_mark(36.392667, 139.061208, class=zoommkdetail, title=滝川一益); &googlemaps2_mark(36.565771, 138.196442, class=zoommkdetail, title=森長可); &googlemaps2_mark(34.714524, 133.879394,34, class=zoommkwide, title=西部戦線, icon=西部戦線); &googlemaps2_mark(34.693832, 133.82206, class=zoommkdetail, title=羽柴秀吉);
ズームの広域(0～7)と、ズームの詳細(8～)で表示するマーカーを切り替えています。
マーカーの数が多くなったらこういう風にして、表示するマーカーを間引いていくと速度が稼げる。
&googlemaps2(mapname=gbartest, lat=34.718598, lng=135.304849, width=300px, height=300px, mapctrl=small, typectrl=normal, zoom=15, googlebar=1);
PukiwikiでGoogleMaps2 CategoryJavaScript CategoryGoogle CategoryPukiwiki