https://labs.cybozu.co.jp/blog/akky/tags/%E3%83%89%E3%83%A9%E3%82%AF%E3%82%A8%E9%A2%A8/ Recent content in ドラクエ風 on akky@サイボウズラボ・ブログ Hugo ja Thu, 02 Sep 2021 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/ Thu, 02 Sep 2021 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/ <p>グーグルが<a href="https://japan.googleblog.com/2012/04/google-8.html">ドラクエ風Googleマップを発表</a>したのが 2012年のエイプリルフール。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/google-april-fools-nes-google-map.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/google-april-fools-nes-google-map_hu_4a22f7b3f9802845.webp 480w, https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/google-april-fools-nes-google-map_hu_a9b02e6722b155e1.webp 768w, https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/google-april-fools-nes-google-map_hu_b1e08532ffd27e17.webp 828w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/google-april-fools-nes-google-map.png" width="828" height="443" alt="" loading="lazy" decoding="async"> </picture></a></p> <p>その時はエイプリルフールのネタでしかなかったのですが、このファミコン風Google Maps を自作した人が現れました。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map_hu_ccaaa67f2c967ae.webp 480w, https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map_hu_e966a6e924c24eba.webp 768w, https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map_hu_12c9dbc3e26a8e15.webp 920w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map.png" width="920" height="511" alt="" loading="lazy" decoding="async"> </picture></a></p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-yokohama.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-yokohama_hu_a27a6be6dd15c191.webp 410w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-yokohama.png" width="410" height="210" alt="" loading="lazy" decoding="async"> </picture></a></p> <p>ファミコン/ドラクエの祖国に敬意を表してか、<a href="https://www.youtube.com/watch?v=5vcPnk-6saw">デモ動画</a>の中では東京周辺から川崎、横浜を訪れています。(3:20頃)</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-making-tiles.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-making-tiles_hu_15155ff6dd79fb1b.webp 378w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2021/09/nes-google-maps/real-nes-google-map-making-tiles.png" width="378" height="374" alt="" loading="lazy" decoding="async"> </picture></a></p> <p>元の衛星動画をグリッドで切り、グリッド内の色の多さをカウントし、色に合わせたファミコン風のタイル地形を割り当てるという形で8bit地形図を作り、それをタイルサーバとして動かしているということ。</p> <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen" loading="eager" referrerpolicy="strict-origin-when-cross-origin" src="https://www.youtube.com/embed/5vcPnk-6saw?autoplay=0&amp;controls=1&amp;end=0&amp;loop=0&amp;mute=0&amp;start=0" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" title="YouTube video"></iframe> </div> <p>現在はラズベリーパイ上などを外に置いたままNESにつないでの動作ですが、NESのカートリッジの形に収めるようがんばりたいそう。</p> <p>via Hacker News</p>