<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
	<channel>
		<title>Mapbox on akky@サイボウズラボ・ブログ</title>
		<link>https://labs.cybozu.co.jp/blog/akky/tags/mapbox/</link>
		<description>Recent content in Mapbox on akky@サイボウズラボ・ブログ</description>
		<generator>Hugo</generator>
		<language>ja</language>
		
		
		
		
			<lastBuildDate>Wed, 18 Jul 2018 00:00:00 +0000</lastBuildDate>
		
			<atom:link href="https://labs.cybozu.co.jp/blog/akky/tags/mapbox/index.xml" rel="self" type="application/rss+xml" />
			<item>
				<title>都市の道路が向いてる方角を調べられるインタラクティブ地図</title>
				<link>https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/</link>
				<pubDate>Wed, 18 Jul 2018 00:00:00 +0000</pubDate>
				<guid>https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/</guid>
				<description>&lt;p&gt;&lt;a href=&#34;https://mourner.github.io/road-orientation-map/#12/40.734/-73.992&#34;&gt;Road Orientations Interactive Map&lt;/a&gt;は、都市の道路の方角を円形のヒストグラムにまとめたインタラクティブ地図です。&lt;/p&gt;&#xA;&lt;p&gt;360度を64分割し、それぞれの方角を向いた道路の長さをカウントしていくと、表示中の都市がどの方角に向いた道路をどれぐらい持っているか、が右上に表示されます。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-tokyo.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-tokyo_hu_796e551711eaa0f8.webp 480w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-tokyo_hu_62c1938bec3ec1b3.webp 768w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-tokyo_hu_5ce1043a2c85e2b6.webp 859w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-tokyo.png&#34; width=&#34;859&#34; height=&#34;763&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://mourner.github.io/road-orientation-map/#12.44/35.69836/139.72867&#34;&gt;東京都心部&lt;/a&gt;を表示すると、こんな分布に。どの方角にも同じぐらいの長さの道路が存在する、つまり、特に方角など気にせず、ランダムに近い方角に道路が伸びているというのがわかります。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-kyoto.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-kyoto_hu_d7910aa27afefc4.webp 480w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-kyoto_hu_b62201579fa4e440.webp 768w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-kyoto_hu_5549235185b1f011.webp 859w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-kyoto.png&#34; width=&#34;859&#34; height=&#34;771&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;対して、&lt;a href=&#34;https://mourner.github.io/road-orientation-map/#13.48/35.00396/135.75999&#34;&gt;京都&lt;/a&gt;を表示してみるとこんな結果に。ほとんどの道路は東西・南北に向いていて、それ以外の方角に向いた道は非常に少なそう。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-sapporo.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-sapporo_hu_5e42761f404b0b2c.webp 480w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-sapporo_hu_189bd76062ca1992.webp 768w, https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-sapporo_hu_ef1b26a9f20bb3a9.webp 852w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2018/07/road-orientation-interactive-map/road-orientation-map-sapporo.png&#34; width=&#34;852&#34; height=&#34;761&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;こちらは&lt;a href=&#34;https://mourner.github.io/road-orientation-map/#12.16/43.08035/141.34778&#34;&gt;札幌&lt;/a&gt;。札幌も碁盤目の街という印象でしたが、こちらは京都と違って東西南北の向きには向いてないのですね。また、場所によって四方の方角が異なっていて、集計結果としては多い方角は8つ出てくるのがわかります。&lt;/p&gt;&#xA;&lt;p&gt;右下の検索ボックスで、世界中のどの場所でも表示できるのがいいですね。&lt;/p&gt;&#xA;&lt;p&gt;この地図、&lt;a href=&#34;https://openstreetmap.jp/&#34;&gt;OpenStreetMap&lt;/a&gt; のデータを使った&lt;a href=&#34;https://www.mapbox.com/maps/&#34;&gt;Mapbox&lt;/a&gt;のサービスを使って描画されています。表示されている地図の範囲の道路データから方角と距離を取り出し、集計するのは&lt;a href=&#34;https://github.com/mourner/road-orientation-map/&#34;&gt;コンパクトな JavaScript&lt;/a&gt; で済んでいます。&lt;/p&gt;&#xA;&lt;p&gt;# 作者はMapboxの中の人のようです&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://blog.mapbox.com/visualizing-street-orientations-on-an-interactive-map-1eefa6002afc&#34;&gt;作者のウラディミール・アガフォンキンさん(Vladimir Agafonkin)は&lt;/a&gt;、アメリカの主要都市について同様の円形ヒストグラムをまとめた&lt;a href=&#34;http://vizual-statistix.tumblr.com/post/80468941142/unlike-like-emperor-kuzco-i-was-actually-born&#34;&gt;Vizual Statistix の記事を見て&lt;/a&gt;、「地図の任意の都市について簡単に同じように調べられたらいいな」と思って今回の開発を思い立ったということ。&lt;/p&gt;</description>
			</item>
	</channel>
</rss>
