gepponkoku.blog.fc2.com Open in urlscan Pro
199.48.210.116  Public Scan

Submitted URL: http://gepponkoku.blog.fc2.com/
Effective URL: https://gepponkoku.blog.fc2.com/
Submission: On May 11 via api from US — Scanned from DE

Form analysis 2 forms found in the DOM

Name: barFormGET

<form name="barForm" method="get" action="" target="blank">
  <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'">
  <input type="hidden" name="charset" value="utf-8">
  <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索">
</form>

GET https://gepponkoku.blog.fc2.com/

<form action="https://gepponkoku.blog.fc2.com/" method="get">
  <p class="plugin-search" style="text-align:left">
    <input type="text" size="20" name="q" value="" maxlength="200"><br>
    <input type="submit" value=" 検索 ">
  </p>
</form>

Text Content

携帯ホームページ


超現実的異世界「月本國」を創造するぶろぐ

現代和風架空想像国家「月本國」の地図描画や世界観の創造をしています。


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8183]

 月本地図の方の更新が停滞気味であったが、留守になる時間が長くなっている中でシステム開発が続いていたので、何卒御容赦あれ。かくしてそのシステムができたので、この度満を持して更新した。
 さてどこがどう変わったのやら!?それは見ればすぐ分かるだろうが、まずはブラウザのアドレスバー表示を有効にして頂きたい。URLの表示が、今までよりも長くなっているはずである。地図のページのパス自体は・・・/gvgmap.htmlなのだが、その後で?に続けて従来のcrs座標系とズームレベルが表示されるようになった。これは一般的にクエリパラメータと称され、そのページ内の情報を操作するための変数が羅列されている。一般的なwebサイトでごく普通に見られるものだが、そいつを月本地図にも搭載してみた。
 これは月本地図の起動時には、初期位置である首都:大都の国会議事堂に照準が合う。スクロールやズーム操作に応じて、Y・X・Zの値が変動するが、Zは今回新たに表示されたズームレベルである。操作を続ければブラウザには履歴が積み重なるが、そこを直接操作することでその位置へ戻ることができる。又、アドレスバーのクエリパラメータの数値を直接書き換えれば、その場所へ移動することも可能である。
 ただ、不本意ながらブラウザの戻る・進むボタンは通常は機能しない。履歴を直接操作した後ならばそれが効くのだが、広く出回っている実在世界のデジタル地図でも無理なようなので、そこは同様の操作とさせて頂く。システム的にはjavascriptのHistoryAPIという機能にそれが存在しないせいで実現できなかったわけだが、いつの日かそんな機能が付くかもしれない。ただ、ブラウザの戻るや進むボタンはセキュリティー的には少々難があるとか…。

 * 2024-05-11 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8182]

 何だか違和感があったのだが、数日留守にしていても誰からも突っ込みが無かったのは実に虚しいものである。
No.8180の術式だが、指示通りにやっても多分strCenterが未定義だぞ~!…と叱られて動かないのではないか!?
 てなわけで以下の関数が抜け落ちていたので、posset()とiconPos()の間ぐらいに追加されたし。これは文字列の中心を定めるiconAnchorを計算するための術式で、縦横共通で機能する。引数は2つで、fsはフォントサイズ、strは実際に表示する文字列である。戻り値は2次元配列だが、横書きは[0]、縦書きは[1]を用いて、iconAnchorにそのまま代入すればよい。データベースのSTキーのフラグが横書き0で縦書き1というのは、そういう理由だったわけである。
function strCenter(fs,str) {
var cenH = fs/2, cenW = str.length * cenH;
return [[cenW, cenH],[cenH, cenW]];
};

 あまりに融通が利き過ぎるシステムに仕上がったわけだが、万能型という条件下ならばこれでよいだろう。文字列ならばフォントの設定がほぼすべてと言えるが、サイズにせよ色にせよ、地図で用いるとなれば大抵共通になるだろう。よって、ある程度クラスを用意して固定化しておいた方が、値の入力に迷うことは無いはずである。
 ところでここまで苦労して開発したはいいが、こいつの使いどころやいかに!?当然ながら作者自身も使う前提でやったわけだが、文字を見れば察しが付くだろう。これは主に地形の名称を記すための術式として使うことを想定している。例えば一言で海と言っても、月本海や太汪洋といった広大な外海から、内海や大都湾のような限定的な海域まで様々である。他にも湖・ダム・沼、山脈・山地…どれを取ってもその大きさや形状は様々なわけで、それに合わせてフォントを設定するのも迷うところだろう。現時点で文字列表記は詳細図に限定する予定だが、将来的に広域図に配置する機会があるとしても、これならば柔軟に対応できるはずである。

 * 2024-05-10 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8181]

 データベース
nameListの中身を参照すれば分かるだろうが、各キーで用意されている値はすべて自由に設定可能である。既出なので察しが付くだろうが一通り解説してみよう。
 nameキーは3個の配列で、[0]が実際に地図上に表記される文字列となり、普通は漢字である。[1]と[2]はポップアップで表示される文字列だが、システム上は両者は改行をはさんで並べて表示される。月本地図では仮名と英文の併記となるが、別にどんな使い方でも構わない。
 次にposキーは何度も出てきたので今更説明不要だろう。今回の改良では、山の名称設定で登場したタイル単位での座標設定も可能になっている。「春霞島」は従来のcrs座標系のままだが、今回追加した「月本海」の方は試しに後者を使ってみた。座標を変換する関数
iconPos()は山のものと共用なので、そのまま放置しておいて頂きたい。
 次のsizeキーはフォントサイズをpx単位で数値入力すればよい。どんなサイズにもできてしまうが、小さ過ぎれば豆粒のようで読めないし、非常識に大き過ぎれば動作は保障しかねるので悪しからず。その次のcolorは、フォントの色を#〇〇〇による数値入力となる。これもスタイル設定で有効な値の範囲内ならば問題無く対応できるはずである。
 その後のSTキーだが、横書は0、縦書は1を入力すればよい。
degキーは文字列を傾ける角度で、+では右方向、-では左方向に傾く。最後にlayerキーはlayar00~03のいずれかより上に表示させるための設定値だが、単純にズームレベルと同じになる。

 * 2024-05-09 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8180]

 更に調べていくうちに、未解決だった謎の真相が解けた。L.divIcon()の呪文はデフォルト状態で唱えると白い四角が出てしまうが、これはLeaflet-div-iconというクラスがもれなく付いてくるかららしい。こいつの中身だが、
{background:#fff; border:1px; solid:#666;}
…という仕様である。てことは、我々にとって災厄をもたらしていた容疑者は、このborderだったわけである。ならばこいつを無効化する呪文を唱えて、災いから解放せねばなるまい。
 いずれにせよ、white-space:nowrapとfont関連の呪文は同時に唱えないと無効のようなので、やはり
No.8178の議論で嘆きながらも、こればかりは避けられないらしい。
 かくして、誠に強引過ぎて遺憾なのだが、以下の方法でようやく動く術式となった。

//データベースの用意
const nameList = [
{name:['春霞島','はるかじま','Haruka Island'], pos:[7370,-10385], size:24,
color:'#666666', ST:0, deg:0, layer:0 },
{name:['月本海','げほんかい','the Sea of Gapan'], pos:[-44,-31,0,100], size:32,
color:'#7700CC', ST:1, deg:30, layer:0 },
];

//classに追加
.nosolid border: 0px;

//既存の「let strT='はるかじま'」~の術式を削除して置き換え

for(var i = 0; i< nameList.length; i++) {
let lname;
if(nameList[i].layer == 0)lname = layer00;
else {
if(nameList[i].layer == 1)lname = layer01;
else {
if(nameList[i].layer == 2)lname = layer02;
else lname = layer03;
}
}
let str = nameList[i].name[0];
let strP = nameList[i].name[1] +'<br>'+ nameList[i].name[2];
let strCen = strCenter(nameList[i].size, str);
let namepos = iconPos(nameList[i].pos);
let popup = L.popup().setContent(strP);
let fontST;
if(!nameList[i].ST) fontST = 'strS';
else fontST = 'strT';
let divName = L.divIcon({
className:'nosolid',
html:'<span class=" ' + fontST +' " style=" font-size:' + nameList[i].size +
'px; color:' + nameList[i].color + '; white-space: nowrap; line-height:100%;
transform: rotate(' + nameList[i].deg + 'deg);">' + str + '</span>',
iconAnchor: strCen[nameList[i].size, nameList[i].ST]
});
L.marker(namepos, {icon:divName}).bindPopup(popup).addTo(lname);
}

 * 2024-05-08 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8179]

 なかなか突破口が開けないもので、前回の強引過ぎる方法をやってみたのだが、結局うまく行かなかった。そういえば過去にそれをやろうとしてハマったことがあったと今更ながら思い出した。
 そして以前から導入を検討していたのが、css変数というものである。スタイルの共通要素を変数のように扱って制御する方法だが、こいつを使えないものかと試したところ、一度は動いたけれどほんの一時の糠喜びに終わってNG…。
 その原因を問う前に、一体何をどうやったらそんなことが起きたのか?
リストが1行ならば動いたのだが、そこで2行目を用意したところ、すべて2行目で設定したスタイルに変化してしまったということである。まあこの様子だと、それまでの設定はすべて無になって最終行のスタイルに統一されてしまうということだろう。
 css変数は今回初めて手を付けたこともあって、その仕様は未知のところが多い。情報を漁っても便利だとは書かれていても、ここで使う場面は果たしてあるのやら!?

 * 2024-05-07 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8178]

 万能型を目指して開発を始めてみたものの、途中段階で早くもこいつはかなり融通の利かないシステムになってしまいそうで、この先開発を続行しようか迷うところである。強引に完成させたところで、データベースの1行1行がかなりもっさりしている。そして術式の方もまた、もっさりした多分岐を多用せざるを得ない。これでは少量の配置でも効果はあまり期待できないのではないか!?
 その理由を議論するならば、文字列に対してまず設定を要するのはfont-sizeとcolorである。設定を個別に行うとなれば、データベース的には数値のみで事足りるだろう。ではそれを制御する術式はどうなる?
文字列をspanやdivで囲って、styleで'font-size'+変数名+'; color:'+変数
…という術式を唱えることになるだろうが、これだけでも強引な印象を受ける。既に文字列の縦横設定を決めるclassのstrS・strTと、文字列を傾けるtransformの呪文がやむを得ず唱えられているので、そこに追加するぐらいならば大差無いか…。
 とはいえ、Laefletの文字列配置で唱える呪文はこれだけではない。他にもデフォルトでwhite-space:nowrapとline-height:100%が強制的に課せられる。だがこれらはfont-sizeと同時に唱えないと無効らしい。となると、全部styleに入れなければ動かないではないか…。さすがにそれは強引過ぎるにもほどがあるだろう。

 * 2024-05-06 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8177]

 いい加減に初期段階でやったscript内の数値の直接入力を一掃したいと思わないか?
文字列を地図上に記した第一歩は「春霞島」だったが、もう随分と過去の話のように思えてしまう。それだけ長い間ダラダラと議論してきたわけだが、この期間で読者の皆様もそれなりに経験値が積まれたと信じたい。それでは更に実用的なシステムへ切り替えていくとしよう。
 てなわけでまずはちょっと惜しい気もするが、この「春霞島」を初歩的な直接入力から万能型のシステムへと切り替える作業である。あらゆるニーズに対応すべき万能型を求めるならば、フォントのサイズと色・縦書きor横書き・傾ける角度・表示レイヤー…以上を一通り設定可能にする必要があるだろう。更にアイコンの有無や種類まで設定できれば、一つのデータベースをループさせるだけで事足りるはずである。
 だがここまで徹底的に追求することに関しては、少々迷うところである。確かにサンプルのような狭い範囲で、少数のアイコンと文字列を配置するのであれば、この方が手っ取り早いだろう。一方、月本地図のように大量のアイコンと文字列を配置する場合はどうか?
同じカテゴリーであればスタイルも共通なわけで、万能型では機能を持て余してしまう。たとえるならば、何でもできてしまうスマホで通話とメール以外の機能を全く使わないようなものだろう。
 万能型システムは以下同文の余計な条件分岐が増えるので、何十万もの処理を繰り返すとなれば、微々たる時間の積み重ねでも負担がかかってしまう。よって、必要最低限の設定にまとめたコンパクトなシステムを用いた方が現実的である。ならば月本地図では万能型のデータベースの出番は皆無ということか?
多分そうかもしれないが、作っておいて損は無い…といったところか。何だかんだ言っても、どうやら架空地図の作者の皆様も国家単位での規模でやっている人は多くないらしい。それじゃあもう万能型データベースを作ってみようか…。だけどさすがに国道番号のような複雑な処理までは収まり切れないので、文字列の表記に限定させて頂くとする。

 * 2024-05-05 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8176]

 symbolListの方は書き換えとは言ったものの、尻尾にlayerキーを追加しただけである。少量なので1個1個ちまちまコピペしてもすぐ終わったのだが、これがもし何百何千ものデータを作成した後で必要になったらどうする!?さすがに同じ方法でやろうとするのは複雑骨折を引き起こすだろう。htmlのエディタには、検索や置換の機能が普通に付いている。この場合は「},」
を「, layer:0},」とでも置換すればよいわけで、後から数値を設定すればよい。逆にlayerを設定した後で不要になったならば、逆の操作をすればよい。「,
layer:0},」から「, layer:3},」まで個別に作業をしたって4回の操作で済むのである。
 続いて各レイヤー名を変数lnameに入力して間接的に操作する作業となるが、
No.8173ではswitch文の中で唱えていた呪文を外へ出して、if文でちまちまと分岐させている。多分岐なのでこちらもswitch文で構わない。
 ここで各レイヤーに対してlayer00~03まで変数名が付いているわけだから、数値で合理的な操作ができないものか!?という考えに及ぶかもしれない。確かに変数var
nとでも設定して、'layer0'+nのようにすれば、ちまちまと分岐させるよりもスッキリするだろう。だがこのままでは動かないのである。それはlnameは変数名だが、文字列と数値の組合せで変数名を合成させるのは単純なようで一筋縄ではいかない。それを実現させるにはevalという呪文を唱える必要があるのだが、一般にはリスクが高いので禁忌とされている。その詳細は調べればいくらでも出てくるだろうが、しまいにはevalだかevilだか混乱しそうな悪魔の呪文である。とにかく使わないのが無難ということで、地道に多分岐を唱るしかないわけである。

 * 2024-05-04 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8175]

 それでは月本地図で実際に用いているレイヤー別の切替制御を公開する。地図の密度等の事情に応じて、同一のカテゴリーであっても各アイコン単体で表示させるレイヤーを指定する方法となる。前回の
symbolListを改造してやってみよう。

//symbolListの書き換え
const symbolList = [
{name:'吹出岬', pos:[7087,-10031],anc:[18,-6], iname:0 , layer:2},
{name:'吹出バスターミナル', pos:[7153,-10100], anc:[116,8], iname:70 , layer:1},
{name:'金田バスターミナル', pos:[7156,-11020], anc:[116,8], iname:70 , layer:1},
{name:'春霞空港', pos:[6806,-10526], anc:[56,8], iname:71 , layer:0},
{name:'春霞島(吹出港)
フェリー発着場', pos:[7151,-10092], anc:[42,-12], iname:72 , layer:0},
];

//script側の書き換え
for(var i = 0; i< symbolList.length; i++) {
let iconName, lname;
if(symbolList[i].layer == 0) lname = layer00;
else {
if(symbolList[i].layer == 1) lname = layer01;
else {
if(symbolList[i].layer == 2) lname = layer02;
else lname = layer03;
}
}
switch(symbolList[i].iname) {
case 70:
iconName = msBus; break;
case 71:
iconName = msAirport; break;
case 72:
iconName = msFerryport; break;
default: iconName = dot;
};
let symIcon = L.divIcon({
className: 'defstr',
html: symbolList[i].name,
iconAnchor: symbolList[i].anc
});
L.marker(symbolList[i].pos, {icon:iconName}).addTo(lname);
L.marker(symbolList[i].pos, {icon:symIcon}).addTo(lname);
}




 * 2024-05-03 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8174]

 元々サンプルでは、それぞれのシンボルはマーカーに応じてswitch文で制御していた。今回はそれを流用することで、データベース側を書き換えることなく、簡単な術式の書き換えで済ませることができた。本当に手っ取り早い方法だったが、ズームレベル0で空港と港、1でバスターミナル、2で岬が表示されるようになったはずである。
 もっとも、これはあくまでサンプルによるズームレベルに応じた簡素な表示テストだったので、本格的に大量のアイコンや文字列を制御させるとなると、使い勝手がよくない。現状では特定のカテゴリーのアイコンに対して表示レイヤーが固定されているが、実用的には同じカテゴリーでも地図の密度に対して臨機応変に振り分けなければ、高密度の領域で表示し切れない。そもそもアイコンの数が膨大になれば、こんな簡素なswitch文で全部まとめるのでは効率が悪い。カテゴリー別に制御を完全に分離させた方が効率的だろう。
 てなわけで、この術式は実際の月本地図でも用いておらず、本当に手っ取り早く簡素なテスト向けに用意したものである。それでも変数名lnameや、締めでアイコンをレイヤーに追加する.addto(lname)は実際のものを流用している。よって、変数lnameによる制御によって表示させるレイヤーを切り替える基本構造は、これだけで理解できるだろう。

 * 2024-05-02 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8173]

 ズームレベルの範囲に応じて、アイコンと文字列の表示切替ができるようになった。
そこでNo.8171で予告したことをやってみるとしよう。サンプルのデータベースでは、
symbolListがごちゃ混ぜにまとめられている。ではこれらをレイヤー別に表示を振り分けてみよう。まずは手っ取り早く、No.8169のsymbolListの術式から、for文のみの書き換えのみで済ませるとする。
 
for(var i = 0; i< symbolList.length; i++) {
let iconName, lname;
switch(symbolList[i].iname) {
case 70:
iconName = msBus; lname = layer01; break;
case 71:
iconName = msAirport; lname = layer00; break;
case 72:
iconName = msFerryport; lname = layer00; break;
default: iconName = dot; lname = layer02;
};
let symIcon = L.divIcon({
className: 'defstr',
html: symbolList[i].name,
iconAnchor: symbolList[i].anc
});
L.marker(symbolList[i].pos, {icon:iconName}).addTo(lname);
L.marker(symbolList[i].pos, {icon:symIcon}).addTo(lname);
}

 * 2024-05-01 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8172]

 zoomReset() とchangeMaxBD()は、いずれも
No.8160で出てきた術式をサンプルで使えるようにしたものである。よってその内容や解説はそちらを参照すればよい。そして今回はzoomReset()
の中で、ズームレベルnowzoomに応じてlayer00~03の表示切替を制御する術式が追加されている。ズームレベルが最大の3ならば、layer00~03がすべて表示される。そこから1段階下がるごとに表示レイヤーは03から1枚ずつ減っていく。そしてズームレベル-1以下では、すべて非表示になる構造である。表示・非表示切替の呪文はタイルレイヤーと同様に、.addLayerと.removeLayerである。
 それから画面左下のスケールバーの切替制御の術式が、No.8166ではchangeMaxBD() に追加するような指示が出ていたが、今回はzoomReset()
内で唱えられている。実際はどちらでも動くのだが、その理由はNo.8167で記されている。
 No.8169の長い術式の解説はこんなところだが、ズームレベルを新版地図や広域図まで下げてから詳細図へ戻すと、照準がかなりブレるはずである。changeMaxBD()
で詳細図と新版地図の閲覧範囲は限定されているが、広域図は全国閲覧可能になっているからである。ちなみに月本地図では詳細図の下地画像がまだ全部できてないが、閲覧範囲に制限は無い。詳細図で下地画像の無い範囲は海が虚しく表示されるだけなので、収拾がつかなくなったら広域図まで下げて戻して頂きたい。

 * 2024-04-30 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8171]

 従来はズームレベルの切替範囲が詳細図の1~3に限定されていたが、今回から月本地図と同様に3~-4までの8段階になっている。詳細図が0~3の4段階となったことで、アイコンと文字列のレイヤーも従来は01のみだったのが00~03に増えている。ここで突っ込みたくなる人も居るだろうが、作者の異世界言語に関する知識はこの程度なので悪しからず。
 これにより、最初に記した「春霞島」の文字と国道番号はlayer00へ移行したが、他にも地味に変更されている。要するに.addTo()の括弧内にlayer00~04のいずれかを振り分ければよい。システム的には、この4つをあらかじめ変数で定義しておいて、zoomReset()でnowzoomに応じて分岐、.addLayerとremoveLayer
を立て続けに唱えて表示・非表示を切り替えている。
 その先はしばらくアイコンと文字列を表示させる術式が続くが、データベースを別ファイルへ移動しただけで、かなりすっきりしただろう。現状では各カテゴリーごとに表示されるレイヤーは固定されているが、月本地図では同じカテゴリーでも高密度で表示し切れない等の事情で、異なるレイヤーに振り分けられて表示されるものもある。その方法は後で公開するが、簡単なようでちょっと融通が利かないことだけ予告しておこう。

 * 2024-04-29 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8170]

 今回はできればPCだけでなくスマホでも試して頂きたい。htmlをブラウザでプレビューできればよいのだが、無理ならば以下からリンクされたし。スマホやタブレットではピンチイン・ピンチアウト操作でズームレベルが切り替わるが、この地図ではズームレベル0~-1と-2~-3がタイルセットの切り替わる境界となる。https://gepponkoku.nation.jp/gvgmap/leaflettest.html
 アップロードしたこのファイルを通常のネット環境で開いてみたのだが、文字化けという事態に遭遇して右往左往したのであった。確かに従来はヘッダーが簡素だったので納得である。要するに
utf-8が抜けていたせいだが、今回はそこからちゃんと手抜きせずに唱えているので大丈夫だろう。
 今回はメインであるタイルの切替の他にも色々と追加している。まずは起動時のズームレベルと初期位置の座標を変数で制御していることである。今後柔軟に対応するための術式を施しておいた。最初にグローバル変数を定義しているので、ついでだからそこで初期位置を入力してみた。これによりwhenReadyの方では二重に唱えないように呪文が端折られた。又、cenposはposset()内でしか登場する機会が無いので、グローバル変数から除外してローカル変数へ移動している。
 地味に追加されたのがL.tileLayerのオプションの
attributionである。これはデフォルトで画面右下にLaefletのロゴが表示されるが、そこに地図の著作や出典を併記するための呪文である。月本地図でも導入済だが、地図画像は作者の皆様が各自で著作権を所持しているだろうから、ここに記しておくとよいだろう。

 * 2024-04-28 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop


架空創造地図描画日記2024(LEAFLET攻略編)[NO.8169]

 データベースを抜き出したことで、htmlの方がスリムになって作業しやすくなった。それはあくまで開発者の立場の話なのだが、これでデータベースの編集でもいちいちこちらを参照する必要が無くなった。よってコピペユーザーにとっても作業しやすくなるはずである。では久々にフルコードを詠唱するか…。今回のブログの記事は、開国以来23年余りで最長となるだろう。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="crossorigin=""></script>
<script src="gvtest.js" charaset="utf-8"></script>
<script
src="https://unpkg.com/leaflet.markercluster@1.4.1/dist/leaflet.markercluster.js"></script>
</head>
<style type="text/css">
#meswindow{
position:absolute; top:0%; left:0px;
width:100% ; height:8%;
padding:0px;
border:0px;
background-color: #FFFFFF;
}
#mainwindow{
position:absolute; top:8%; left:0px;
width:100% ; height:92%;
padding:0px;
border:0px;
overflow: hidden;
}
.leaflet-control-container::after {
content: url('https://gepponkoku.nation.jp/gvgmap/files/centerspot.png');
z-index: 1000;
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
}

.defstr{font-size: 12px; color: #666666; white-space: nowrap; line-height:100%;}
.stricon{font-size: 24px; color: #000000; white-space: nowrap;
line-height:100%;}
.strT{writing-mode: vertical-rl;text-orientation: upright;}
.strS{display: inline-block;}

.mticon{color: #336600; font-size: 12px; white-space: nowrap; line-height:100%;}
.doticon{background-color: #666666;}
.roadnum{color: #ffffff; font-size: 8px; font-family: "monospace";
line-height:100%;}
</style>
<body>
<DIV id="meswindow">
<DIV style="position:absolute; bottom:10px; left:0px;"><span
id="lat_span"></span> <span id="lng_span"></span></DIV>
</DIV>
<DIV id="mainwindow"></DIV>
<script>
//初期位置設定 (グローバル変数、ズームレベルと座標の常時監視)
var nowzoom = 0, beforezoom = nowzoom, nowlat = 7190, nowlng = -10165;

//マップ初期化、各レイヤー定義
var gpmap = L.map('mainwindow', {
crs: L.CRS.Simple,
maxBoundsViscosity: 1.0,
wheelPxPerZoomLevel: 1000,
scrollWheelZoom: 'center'
});

var gmd = L.tileLayer('https://gepponkoku.nation.jp/gvgmap/dm/{z}/{x}/{y}.png',
{
tileSize: 500,
minNativeZoom: 1,
minZoom: -1,
maxNativeZoom: 1,
maxZoom: 3,
errorTileUrl: 'https://gepponkoku.nation.jp/gvgmap/files/gmxxxsea.png',
attribution: "<a href='https://gepponkoku.nation.jp/' target='_blank'>Simulation
Country GAPAN</a>"
});

var gmh = L.tileLayer('https://gepponkoku.nation.jp/gvgmap/dm/{z}/{x}/{y}.png',
{
tileSize: 500,
minNativeZoom: -3,
minZoom: -4,
maxNativeZoom: -2,
maxZoom: 0,
errorTileUrl: 'https://gepponkoku.nation.jp/gvgmap/files/gmxxxsea.png',
attribution: "<a href='https://gepponkoku.nation.jp/' target='_blank'>Simulation
Country GAPAN</a>"
});

var layer00 = L.markerClusterGroup({
spiderfyOnMaxZoom: false,
showCoverageOnHover: false,
zoomToBoundsOnClick: false,
animate: false,
disableClusteringAtZoom : 0
});

var layer01 = L.markerClusterGroup({
spiderfyOnMaxZoom: false,
showCoverageOnHover: false,
zoomToBoundsOnClick: false,
animate: false,
disableClusteringAtZoom : 1
});

var layer02 = L.markerClusterGroup({
spiderfyOnMaxZoom: false,
showCoverageOnHover: false,
zoomToBoundsOnClick: false,
animate: false,
disableClusteringAtZoom : 2
});

var layer03 = L.markerClusterGroup({
spiderfyOnMaxZoom: false,
showCoverageOnHover: false,
zoomToBoundsOnClick: false,
animate: false,
disableClusteringAtZoom : 3
});

//スケールバー定義
var gScale = L.control({ position: "bottomleft"});
gScale.onAdd = function (gpmap) {
this.scalebar = L.DomUtil.create("div");
this.scalebar.id = "scalezoomid";
return this.scalebar;
};
gScale.addTo(gpmap);

//起動時初期位置設定
if(nowzoom < 0) gmh.addTo(gpmap);
else gmd.addTo(gpmap);
gpmap.setView([nowlat,nowlng], nowzoom);




let strT='はるかじま';
let tooltip = L.tooltip().setContent(strT);
let strObj = L.divIcon({
className: 'stricon',
html:'<span class="strS" style="transform: rotate(0deg);">春霞島</span>',
iconAnchor: [36,12],
tooltipAnchor: [24,40]
});
L.marker([7370,-10385], {icon:strObj}).bindTooltip(tooltip).addTo(layer00);

var dot = L.divIcon({
className: 'doticon',
iconSize:[4, 4]
});
var msBus = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/bus.png',
iconSize:[15, 15]
});
var msAirport = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/airport.png',
iconSize:[15, 15]
});
var msFerryport = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/ferryport.png',
iconSize:[15, 15]
});
for(var i = 0; i< symbolList.length; i++) {
let iconName;
switch(symbolList[i].iname) {
case 70:
iconName = msBus; break;
case 71:
iconName = msAirport; break;
case 72:
iconName = msFerryport; break;
default: iconName = dot;
};
let symIcon = L.divIcon({
className: 'defstr',
html: symbolList[i].name,
iconAnchor: symbolList[i].anc
});
L.marker(symbolList[i].pos, {icon:iconName}).addTo(layer01);
L.marker(symbolList[i].pos, {icon:symIcon}).addTo(layer01);
}

var msPost = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/msPost.png',
iconSize: [7, 8],
});
for(var i = 0; i< postList.length; i++) {
let popup = L.popup().setContent(postList[i].name);
L.marker(postList[i].pos, {icon:msPost}).bindPopup(popup).addTo(layer02);
}

var msMt = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/mt.png',
iconSize:[9, 7],
});
for(var i = 0; i< mtList.length; i++) {
let str = mtList[i].name[0] +'<br>'+ mtList[i].name[3];
let strP = mtList[i].name[1] +'<br>'+ mtList[i].name[2];
let mtpos = iconPos(mtList[i].pos);
if(mtList[i].name[4]) strP += '<br>'+ mtList[i].name[4];
let popup = L.popup().setContent(strP);
var mtIcon = L.divIcon({
className: 'mticon',
html: str,
iconAnchor: mtList[i].anc,
});
L.marker(mtpos, {icon:msMt}).bindPopup(popup).addTo(layer00);
L.marker(mtpos, {icon:mtIcon}).bindPopup(popup).addTo(layer00);
}

let nrIcon = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/NRn.png',
iconSize: [16, 15]
});
for(var i = 0; i< nrList.length; i++) {
let strcen = (String(nrList[i].data).length)*3-1.2;
let nrNum = L.divIcon({
className: 'roadnum',
html:nrList[i].data,
iconAnchor: [strcen , 3.4]
});
let nrpos = nrList[i].pos;
for(var j = 0; j< nrpos.length; j++) {
L.marker(nrpos[j], {icon:nrNum}).addTo(layer00);
L.marker(nrpos[j], {icon:nrIcon}).addTo(layer00);
}
}

var prIcon = L.icon({
iconUrl: 'https://gepponkoku.nation.jp/gvgmap/files/icon/PRx.png',
});
for(var i = 0; i< prList.length; i++) {
let strcen = (String(prList[i].data).length)*3-1.2;
let prWidth = 16;
if(strcen > 8) prWidth += 6;
prIcon.options.iconSize = [prWidth , 14];
let prNum = L.divIcon({
className: 'roadnum',
html:prList[i].data,
iconAnchor: [strcen , 3.4]
});
let prpos = prList[i].pos;
for(var j = 0; j< prpos.length; j++) {
L.marker(prpos[j], {icon:prNum}).addTo(layer01);
L.marker(prpos[j], {icon:prIcon}).addTo(layer01);
}
}

gpmap.whenReady(function() {
zoomReset();
changeMaxBD();
posset();
});

gpmap.on('resize', function() {
changeMaxBD();
});

gpmap.on('moveend', function() {
posset();
});

gpmap.on('zoomend', function() {
zoomReset();
changeMaxBD();
posset();
});

gpmap.on('zoom', function() {
nowzoom = gpmap.getZoom();
if(nowzoom == beforezoom) return;
gpmap.setMaxBounds([250000, -250000],[-250000,250000]);
});

function zoomReset() {
if (nowzoom != beforezoom){
switch(beforezoom) {
case 0:
if(nowzoom == -1){
gmd.remove(gpmap);
gmh.addTo(gpmap);
gpmap.setView([nowlat*0.8, nowlng*0.8], -1,{animate:false});
}
else gpmap.setView([nowlat, nowlng], 1, {animate:false});
break;
case -1:
if(nowzoom == 0){
gmh.remove(gpmap);
gmd.addTo(gpmap);
gpmap.setView([nowlat/0.8, nowlng/0.8], 0,{animate:false});
}
else gpmap.setView([nowlat, nowlng], -2, {animate:false});
break;
case -2:
if(nowzoom == -3) gpmap.setView([nowlat /= 2.5, nowlng /= 2.5],
-3,{animate:false});
else gpmap.setView([nowlat, nowlng], -1, {animate:false});
break;
case -3:
if(nowzoom == -2) gpmap.setView([nowlat *= 2.5, nowlng *= 2.5],
-2,{animate:false});
else gpmap.setView([nowlat, nowlng], -4, {animate:false});
break;
default: gpmap.setView([nowlat, nowlng], nowzoom, {animate:false});
}
beforezoom = gpmap.getZoom();
}
if (nowzoom >= 3) gpmap.addLayer(layer03);
else gpmap.removeLayer(layer03);
if (nowzoom >= 2) gpmap.addLayer(layer02);
else gpmap.removeLayer(layer02);
if (nowzoom >= 1) gpmap.addLayer(layer01);
else gpmap.removeLayer(layer01);
if (nowzoom >= 0) {
if (gpmap.hasLayer(gmh)){
gmh.remove(gpmap);
gmd.addTo(gpmap);
}
gpmap.addLayer(layer00);
}
else{
if (gpmap.hasLayer(gmd)){
gmd.remove(gpmap);
gmh.addTo(gpmap);
}
gpmap.removeLayer(layer00);
}
document.getElementById("scalezoomid").innerHTML = "<img
src='https://gepponkoku.nation.jp/gvgmap/files/scale"+ nowzoom +".png'
width='128px' height='32px'>";
}

function changeMaxBD() {
var windowHd = Math.ceil(document.getElementById('mainwindow').clientHeight );
var windowWd = Math.ceil(document.getElementById('mainwindow').clientWidth );
var NW,SE;
if(nowzoom >= 0){
if(nowzoom == 1){windowHd /=2; windowWd /=2;}
else{
if(nowzoom == 2){windowHd /=4; windowWd /=4;}
else{windowHd /=8; windowWd /=8;}
}
NW = L.latLng(8750 + windowHd, -12500 - windowWd);
SE = L.latLng(6000 - windowHd, -8750 + windowWd);
}
else{
if(nowzoom >= -2){
if(nowzoom == -2){windowHd *= 2; windowWd *= 2;}
NW = L.latLng(7000 + windowHd, -10000 - windowWd);
SE = L.latLng(4800 - windowHd, -7000 + windowWd);
}
else{
if(nowzoom == -3){windowHd *= 4; windowWd *= 4;}
else{windowHd *= 8; windowWd *= 8;}
NW = L.latLng(20000 + windowHd, -28000 - windowWd);
SE = L.latLng(-28000 - windowHd, 12000 + windowWd);
}
}
var bnds = L.latLngBounds(NW, SE);
gpmap.setMaxBounds(bnds);
};

function posset() {
var cenpos = gpmap.getCenter();
nowlat = Math.round(cenpos.lat);
nowlng = Math.round(cenpos.lng);
var nowTileY = -Math.ceil(nowlat / 250);
var nowTileX = Math.floor(nowlng / 250);
var nowTilePosY = -nowlat % 250;
if (nowTilePosY < 0) nowTilePosY = 250 + nowTilePosY;
var nowTilePosX = nowlng % 250;
if (nowTilePosX < 0) nowTilePosX = 250 + nowTilePosX;
document.getElementById('lat_span').innerHTML = 'Y:'+ nowlat +' X:'+ nowlng;
document.getElementById('lng_span').innerHTML = ' {Tile[X:'+ nowTileX+',
Y:'+nowTileY+'] [Y:'+ nowTilePosY +', X:'+ nowTilePosX+']}';
};

function iconPos(datapos) {
if(datapos.length == 2) return datapos;
var poslat = -(datapos[1] * 250 + datapos[2]);
var poslng = datapos[0] * 250 + datapos[3];
return [poslat, poslng];
};

</script>
</body>
</html>

 * 2024-04-27 :
 * 架空創造地図描画日記2024(Leaflet攻略編) :
 * コメント : 0 :
 * トラックバック : 0

Pagetop
ホーム  次のページ »
Pagetop
管理人



 * 著者:ごとりん
 *  架空想像国家「月本國」の全国地図描画作業を地味に続けている貧乏クリエーター。このブログの毎日更新が途切れない限り、無事に生存しているものと関知して下さい。

Simulation Country GAPAN 月本國



 「月本國」では、2D-RPG向け現代和風素材の無償配布の他、開国(平成13年12月16日)~平成17年2月28日までの過去ログを扱っています。
「旧:月本国政府広報」
[No.1~1171]
 又、連載物「RPG制作雑記」「徒然なる200x裏技集」(↓のカテゴリーで★が付いているもの)等のwardファイル版過去ログを扱っています。このblogの過去ログが読みにくい場合は是非御利用下さい。

・現代和風RPG「月影の駅」Ver2
 RPGツクール2000製フリーウェア。駅から始まり駅で終わる、オトナのドライな人間模様。
 ゲーム宣伝動画配信中!

・「Made in GAPAN 歩 ~Ayumu~」
 2D-RPG向け歩行グラフィック合成ソフト。当局開発の32規格8方向部品セット他、一般的な部品セットも利用可能。各使用環境に合わせた既存素材の組み直しや、顔グラ等の合成もOK。
(上記の管理人画像はこれで合成したものです。)
ブログ内検索




カテゴリー(★:「月本國」にward版あり)
 * 現代和風RPG開発後記2019(「月影の駅」Ver2攻略情報) (38)
 * 現代和風RPG「月影の駅」Ver2(開発日記FINAL) (30)
 * 「Made in GAPAN 歩」操作ガイド(概論/他) (31)
 * 「Made in GAPAN 歩」操作ガイド(データファイル/ディレクトリ) (25)
 * 「Made in GAPAN 歩」操作ガイド(ウディタ⇔ツクール組み直し) (30)
 * 「Made in GAPAN 歩」操作ガイド(ImageFormツールウィンドウ) (23)
 * 「Made in GAPAN 歩」操作ガイド(Select) (10)
 * 「Made in GAPAN 歩」操作ガイド(その他のコマンド) (13)
 * ウディタ事始&32×32素材(雑記) (19)
 * ウディタ攻略「マップ組み」 (69)
 * ウディタ攻略「自作文章表示」 (37)
 * ウディタ攻略「自作戦闘システム」 (177)
 * 架空都市設定資料「首都:大都」 (68)
 * 架空創造地図描画日記2019 (207)
 * 架空創造地図描画日記2020 (350)
 * 架空創造地図描画日記2021 (205)
 * 架空創造地図描画日記2022 (213)
 * 架空創造地図描画日記2023 (249)
 * 架空創造地図描画日記2024(Leaflet攻略編) (132)
 * 2023年備讃遠征 (48)
 * 2022年北アルプス遠征 (35)
 * 2022年中国地方遠征 (34)
 * 2022年東北遠征 (83)
 * 2021年九州遠征 (92)
 * 2021年PC改造計画 (37)
 * 架空国家創造物語 (165)
 * 架空国家創造物語Ⅱ (202)
 * 架空国家創造物語2017 (31)
 * 架空国家創造物語2018 (184)
 * 架空国家創造物語2019 (90)
 * RPG制作企画会議 (182)
 * 歩行グラ部品セット操作ガイド(gw32_1規格) (127)
 * 32×32素材(歩行グラ) (102)
 * 32×32素材(歩行グラⅡ) (36)
 * 32×32素材(歩行グラⅢ) (61)
 * 32×32素材(フィールドタイル) (91)
 * ウディタ事始(基本システム) (2)
 * 現代和風RPG「月影の駅」制作後記(攻略情報) (17)
 * 現代和風RPG「月影の駅」開発物語(攻略情報) (167)
 * RPGツクール 比較論 (61)
 * RPGツクールXP 事始 (30)
 * 現代和風RPG開拓戦記 (38)
 * RPGツクールVXAceLite 概論 (51)
 * RPGツクールVX 攻略覚書「タイルセット」 (47)
 * RPGツクールVX 事始 (11)
 * RPGツクール改造論 (48)
 * ★RPG制作覚書「戦闘システム(2000)」 (118)
 * ★RPG制作覚書(シナリオ/台詞) (33)
 * ★RPG制作覚書(変数/自作システム) (29)
 * ★RPG制作覚書(バグ対策) (61)
 * ★RPG制作覚書(処理落ち対策) (32)
 * ★RPG制作覚書(プログラミング) (20)
 * ★RPG制作覚書(256色png画像素材) (13)
 * ★RPGツクールfor mobile覚書(概論) (22)
 * RPGツクールfor mobile(制作後記) (0)
 * ★RPGツクールfor mobile覚書(容量節約) (17)
 * ★200x裏技集「マップ組みを極めよ(イベント配置編)」 (78)
 * ★200x裏技集 「マップ組みを極めよ」 (37)
 * ★RPG制作雑記(シナリオ編) (60)
 * ★RPG制作雑記(配慮編) (59)
 * ★RPG制作雑記(演出編) (37)
 * ★RPG制作雑記(システム編) (34)
 * ★RPG制作雑記(戦闘編) (58)
 * RPGツクール雑記 (5)
 * 開発日記2018 (181)
 * 開発日記2017 (334)
 * 開発日記2016 (335)
 * 開発日記2015 (302)
 * 開発日記2014 (222)
 * 開発日記2013 (147)
 * 開発日記2012 (254)
 * 開発日記2011 (107)
 * 日記/雑記 (295)
 * バトン回答 (1)
 * 動作テスト (3)
 * ●緊急告知●(24.5.17) (1)
 * ●緊急告知●(21.1.28) (1)
 * 開国10周年 (7)
 * 開国5000日 (4)
 * 開国15年 (31)
 * 開国20年カウントダウン (31)
 * 開国20周年 (16)

カレンダー

04 | 2024/05 | 06 日 月 火 水 木 金 土 - - - 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
18 19 20 21 22 23 24 25 26 27 28 29 30 31 -

月別アーカイブ
 * 2024年05月 (11)
 * 2024年04月 (30)
 * 2024年03月 (31)
 * 2024年02月 (29)
 * 2024年01月 (31)
 * 2023年12月 (31)
 * 2023年11月 (30)
 * 2023年10月 (31)
 * 2023年09月 (30)
 * 2023年08月 (31)
 * 2023年07月 (31)
 * 2023年06月 (30)
 * 2023年05月 (31)
 * 2023年04月 (30)
 * 2023年03月 (31)
 * 2023年02月 (28)
 * 2023年01月 (31)
 * 2022年12月 (31)
 * 2022年11月 (30)
 * 2022年10月 (31)
 * 2022年09月 (30)
 * 2022年08月 (31)
 * 2022年07月 (31)
 * 2022年06月 (30)
 * 2022年05月 (31)
 * 2022年04月 (30)
 * 2022年03月 (31)
 * 2022年02月 (28)
 * 2022年01月 (31)
 * 2021年12月 (31)
 * 2021年11月 (30)
 * 2021年10月 (31)
 * 2021年09月 (30)
 * 2021年08月 (31)
 * 2021年07月 (31)
 * 2021年06月 (30)
 * 2021年05月 (31)
 * 2021年04月 (30)
 * 2021年03月 (31)
 * 2021年02月 (28)
 * 2021年01月 (31)
 * 2020年12月 (31)
 * 2020年11月 (30)
 * 2020年10月 (31)
 * 2020年09月 (30)
 * 2020年08月 (31)
 * 2020年07月 (31)
 * 2020年06月 (30)
 * 2020年05月 (31)
 * 2020年04月 (30)
 * 2020年03月 (31)
 * 2020年02月 (29)
 * 2020年01月 (31)
 * 2019年12月 (31)
 * 2019年11月 (30)
 * 2019年10月 (31)
 * 2019年09月 (30)
 * 2019年08月 (31)
 * 2019年07月 (31)
 * 2019年06月 (30)
 * 2019年05月 (31)
 * 2019年04月 (30)
 * 2019年03月 (31)
 * 2019年02月 (28)
 * 2019年01月 (31)
 * 2018年12月 (31)
 * 2018年11月 (30)
 * 2018年10月 (31)
 * 2018年09月 (30)
 * 2018年08月 (31)
 * 2018年07月 (31)
 * 2018年06月 (30)
 * 2018年05月 (31)
 * 2018年04月 (30)
 * 2018年03月 (31)
 * 2018年02月 (28)
 * 2018年01月 (31)
 * 2017年12月 (31)
 * 2017年11月 (30)
 * 2017年10月 (31)
 * 2017年09月 (30)
 * 2017年08月 (31)
 * 2017年07月 (31)
 * 2017年06月 (30)
 * 2017年05月 (31)
 * 2017年04月 (30)
 * 2017年03月 (31)
 * 2017年02月 (28)
 * 2017年01月 (31)
 * 2016年12月 (31)
 * 2016年11月 (30)
 * 2016年10月 (31)
 * 2016年09月 (30)
 * 2016年08月 (31)
 * 2016年07月 (31)
 * 2016年06月 (30)
 * 2016年05月 (31)
 * 2016年04月 (30)
 * 2016年03月 (31)
 * 2016年02月 (29)
 * 2016年01月 (31)
 * 2015年12月 (31)
 * 2015年11月 (30)
 * 2015年10月 (31)
 * 2015年09月 (30)
 * 2015年08月 (31)
 * 2015年07月 (31)
 * 2015年06月 (30)
 * 2015年05月 (31)
 * 2015年04月 (30)
 * 2015年03月 (31)
 * 2015年02月 (28)
 * 2015年01月 (31)
 * 2014年12月 (31)
 * 2014年11月 (30)
 * 2014年10月 (31)
 * 2014年09月 (30)
 * 2014年08月 (31)
 * 2014年07月 (31)
 * 2014年06月 (30)
 * 2014年05月 (31)
 * 2014年04月 (30)
 * 2014年03月 (31)
 * 2014年02月 (28)
 * 2014年01月 (31)
 * 2013年12月 (31)
 * 2013年11月 (30)
 * 2013年10月 (31)
 * 2013年09月 (30)
 * 2013年08月 (31)
 * 2013年07月 (31)
 * 2013年06月 (30)
 * 2013年05月 (31)
 * 2013年04月 (30)
 * 2013年03月 (31)
 * 2013年02月 (28)
 * 2013年01月 (31)
 * 2012年12月 (31)
 * 2012年11月 (30)
 * 2012年10月 (31)
 * 2012年09月 (30)
 * 2012年08月 (31)
 * 2012年07月 (31)
 * 2012年06月 (30)
 * 2012年05月 (31)
 * 2012年04月 (30)
 * 2012年03月 (31)
 * 2012年02月 (29)
 * 2012年01月 (31)
 * 2011年12月 (31)
 * 2011年11月 (30)
 * 2011年10月 (31)
 * 2011年09月 (30)
 * 2011年08月 (31)
 * 2011年07月 (31)
 * 2011年06月 (30)
 * 2011年05月 (31)
 * 2011年04月 (30)
 * 2011年03月 (31)
 * 2011年02月 (28)
 * 2011年01月 (31)
 * 2010年12月 (31)
 * 2010年11月 (30)
 * 2010年10月 (31)
 * 2010年09月 (30)
 * 2010年08月 (31)
 * 2010年07月 (31)
 * 2010年06月 (30)
 * 2010年05月 (31)
 * 2010年04月 (30)
 * 2010年03月 (31)
 * 2010年02月 (28)
 * 2010年01月 (31)
 * 2009年12月 (31)
 * 2009年11月 (30)
 * 2009年10月 (31)
 * 2009年09月 (30)
 * 2009年08月 (31)
 * 2009年07月 (31)
 * 2009年06月 (30)
 * 2009年05月 (31)
 * 2009年04月 (30)
 * 2009年03月 (31)
 * 2009年02月 (28)
 * 2009年01月 (31)
 * 2008年12月 (31)
 * 2008年11月 (30)
 * 2008年10月 (31)
 * 2008年09月 (30)
 * 2008年08月 (31)
 * 2008年07月 (31)
 * 2008年06月 (30)
 * 2008年05月 (31)
 * 2008年04月 (30)
 * 2008年03月 (31)
 * 2008年02月 (29)
 * 2008年01月 (31)
 * 2007年12月 (31)
 * 2007年11月 (30)
 * 2007年10月 (31)
 * 2007年09月 (30)
 * 2007年08月 (31)
 * 2007年07月 (31)
 * 2007年06月 (30)
 * 2007年05月 (31)
 * 2007年04月 (30)
 * 2007年03月 (31)
 * 2007年02月 (28)
 * 2007年01月 (31)
 * 2006年12月 (31)
 * 2006年11月 (30)
 * 2006年10月 (25)
 * 2006年09月 (4)
 * 2006年08月 (31)
 * 2006年07月 (31)
 * 2006年06月 (30)
 * 2006年05月 (31)
 * 2006年04月 (30)
 * 2006年03月 (31)
 * 2006年02月 (28)
 * 2006年01月 (31)
 * 2005年12月 (31)
 * 2005年11月 (30)
 * 2005年10月 (31)
 * 2005年09月 (30)
 * 2005年08月 (31)
 * 2005年07月 (31)
 * 2005年06月 (30)
 * 2005年05月 (31)
 * 2005年04月 (30)
 * 2005年03月 (31)
 * 2005年02月 (3)

最近のコメント
 * :架空創造地図描画日記2024(Leaflet攻略編)[No.8142] (04/01)
 * ごとりん:架空創造地図描画日記2024(Leaflet攻略編)[No.8083] (02/01)
 * :架空創造地図描画日記2024(Leaflet攻略編)[No.8083] (02/01)
 * ごとりん:架空都市設定資料「首都:大都」[No.8036] (12/17)
 * :架空都市設定資料「首都:大都」[No.8036] (12/17)

最近のトラックバック
 * りなのブログ:RPGツクール (07/11)
 * プレイステーション2ソフト:RPGツクール-----PS2ソフト (02/12)
 * 結衣の記録:ツクール (02/04)
 * サードインパクト:悪魔の事典 (12/30)

リンク
 * 「無料低スペックMMORPG缶」:無料で低スペックのPCでも遊べるMMORPGの情報を詰め込んだ缶詰(記事)、通称「MMORPG缶」を召し上がれ!
 * 「道の顔・標識写真館」:管理人運営の別サイト
 * 管理者ページ

このブログをリンクに追加する RSSフィード
 * 最新記事のRSS
 * 最新コメントのRSS
 * 最新トラックバックのRSS

Powered by FC2 Blog



Copyright © 2024 超現実的異世界「月本國」を創造するぶろぐ All Rights Reserved.