いきなり日曜大工

好きなことを好きなだけやる

10年の眠りを覚ます Leaflet

Leaflet!

10年ぐらいソーシャルメディアやインターネット関係の技術・開発とほぼ無縁の生活を送って参りましたが、最近 Leaflet という JavaScript の web 地図ライブラリの存在を知り、にわかにさわってみたくなりました。

Leaflet logo

公式サイトのチュートリアルなど見て、これは楽しそう。Leaflet で何ができるのかはこれから詳しく学ぶとして、これを使って ゼルダの伝説 ブレス オブ ザ ワイルド の Google Maps みたいなの作ってみたい!ゲームはクリア(達成率100%)しちゃったけど、まだまだ BotW の世界に浸りたかったんです。

そんなわけである日突然 Leaflet でゼルダ BotW の web 地図を作りたくなりました。

準備・前知識

Leaflet は JavaScript のライブラリなので、とりあえず JavaScript の読み書き。それから地図ライブラリということで GIS(地理情報システム)の基礎知識もいりそうです。

  • JavaScript の読み書き
  • GIS の基礎知識
  • 地図サービス
  • 地図にのせる地物データ
  • 構築する Web サイト

昔エンジニア(今でいうとサーバサイドとフロントエンド少々?)として働いていたことがあるものの、知識は2006年ぐらいでほぼ止まっているので web サイト構築から HTML、CSS、JavaScript 他関連技術はすべてやり直しまたは一から勉強になります(地図に関しては素人です)。

開発に必要なソフトウェア・ライブラリなどは全てフリー、またフリーで利用可能なものだけを利用する予定です。

とりあえずの目標

当面の目標は Leaflet で自分の思うゼルダ BotW の web 地図を構築し、それなりのものができたらそれを使ってもう1回最初から BotW をプレイです。

web サイトを作ること自体に10年以上ブランクがありまして全部勉強しなおしつつ地図タイル制作からプログラミングまでを行うのは結構な道のりになりそうですが、このサイトではそんな突然始まる日曜大工レベルの制作過程をそのままお見せします。Leaflet に興味のある方、web まわりの技術ブランクが長い方の参考になる・・かもしれません。

地図画像について

地図画像は国内・海外の著名攻略サイトで使用されているものと同じもの、または Nintendo Switch 版で自分で撮ったスクリーンショットを加工したものを使います。画像の著作権は全て任天堂株式会社にあります。またサイト制作者は任天堂株式会社とは一切関係のない個人です。画像の著作権について権利者様からご連絡を頂く場合は こちら をご覧ください。

当サイトのスタンス・おことわり

とりあえずレンタルサーバ(これは別用途にもともと借りているものです)に WordPress を入れてカスタマイズをしながらこれを書いているところですが、まずは新しい HTML と CSS を学習中ですので、見るたびあちこち変わってたり崩れてたりするかもしれませんがご容赦ください。

あとリーズナブルなレンタルサーバを利用しておりますので正直そんなにアクセスを集めたいと思っていません。ニッチな話なのであまり人はこないと思いますが、外からリンクとか(特に SNS がらみ)いらないです。今のところ検索エンジンや RSS、ブックマーク的なものからの来訪のみを想定しています。世の中は SNS コピペ拡散インスタ映え全盛ですが、当サイトはひっそりとお楽しみください。

最新事情学習の一環として、今後 SEO 対策やら広告・アフィリエイト貼りなどなんでもトライしてみるつもりですが、基本はそんなテンションでやっているとご理解いただければ幸いです。応援していただけるぶんには喜んでサーバ代・勉強代の足しにさせていただきます。

次回から web サイトを構築しながら Leaflet 学習+地図作成をすすめていきます。趣味100%のマイペースでいきます、ご興味を持たれた方は気を長く、生暖かく見守ってくださいませ。