Index

地図をたくさん張ると結構重いのでサンプルだけページを分離した。

さらに追加→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);

センタークロス (2.2から)

&googlemaps2(mapname=crosstest, lat=34.718598, lng=135.304849, width=300px, height=300px, mapctrl=small, typectrl=normal, zoom=15, crossctrl=show);

マーカーのふきだしの最大化(2.2から)

&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を表示しています。

ズームレベルによるマーカーの表示切替(2.2から)

&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~)で表示するマーカーを切り替えています。
マーカーの数が多くなったらこういう風にして、表示するマーカーを間引いていくと速度が稼げる。

Google Bar (2.3から)

&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


|New|Edit|Freeze|Diff|Backup|Upload|Copy|Rename|
Last-modified: 2011-04-05 (Tue) 17:02:11 (2271d)
HTML convert time: 0.053 sec.