<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Mapbox  |  takeHo（たけほ）のへなちょこ台帳</title>
	<atom:link href="https://blog.takeho.com/tag/mapbox/feed/" rel="self" type="application/rss+xml" />
	<link>https://blog.takeho.com</link>
	<description>いわゆる自由帳ってところです。</description>
	<lastBuildDate>Thu, 26 Jun 2025 08:54:54 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.6</generator>

<image>
	<url>https://blog.takeho.com/wp-content/uploads/2024/08/icon-150x150.png</url>
	<title>Mapbox  |  takeHo（たけほ）のへなちょこ台帳</title>
	<link>https://blog.takeho.com</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Google Mapsからの卒業？ OpenStreetMapが“無料で自由”な開発を叶える最強地図APIの実力とは</title>
		<link>https://blog.takeho.com/graduation-from-google-maps-openstreetmaps-powerful-map-api-enables-free-and-free-development/</link>
					<comments>https://blog.takeho.com/graduation-from-google-maps-openstreetmaps-powerful-map-api-enables-free-and-free-development/#respond</comments>
		
		<dc:creator><![CDATA[たけほ]]></dc:creator>
		<pubDate>Fri, 20 Jun 2025 21:41:00 +0000</pubDate>
				<category><![CDATA[OpenStreetMap]]></category>
		<category><![CDATA[Leaflet]]></category>
		<category><![CDATA[Mapbox]]></category>
		<guid isPermaLink="false">https://blog.takeho.com/?p=1121</guid>

					<description><![CDATA[目次 はじめに：Google Mapsの壁にぶつかっていませんか？OpenStreetMapとは？ 一言で言えば「みんなで作る、世界地図」Google MapsとOpenStreetMapの“決定的な違い”「OpenSt [&#8230;]]]></description>
										<content:encoded><![CDATA[

  <div id="toc" class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-2"><label class="toc-title" for="toc-checkbox-2">目次</label>
    <div class="toc-content">
    <ol class="toc-list open"><li><a href="#toc1" tabindex="0">はじめに：Google Mapsの壁にぶつかっていませんか？</a></li><li><a href="#toc2" tabindex="0">OpenStreetMapとは？ 一言で言えば「みんなで作る、世界地図」</a></li><li><a href="#toc3" tabindex="0">Google MapsとOpenStreetMapの“決定的な違い”</a></li><li><a href="#toc4" tabindex="0">「OpenStreetMapって扱いにくいんじゃないの？」という誤解</a></li><li><a href="#toc5" tabindex="0">どんな開発に向いている？ OSM活用シーンの例</a><ol><li><a href="#toc6" tabindex="0">1. 地図付きのブログや旅行記サイト</a></li><li><a href="#toc7" tabindex="0">2. 不動産・店舗検索サイト</a></li><li><a href="#toc8" tabindex="0">3. 災害支援アプリや避難所マップ</a></li><li><a href="#toc9" tabindex="0">4. 公共交通・ルート検索サービス</a></li></ol></li><li><a href="#toc10" tabindex="0">デメリットは？あえて正直に言うなら</a></li><li><a href="#toc11" tabindex="0">コスト比較：商用開発における現実的な差</a></li><li><a href="#toc12" tabindex="0">よくある質問（FAQ）</a></li><li><a href="#toc13" tabindex="0">まとめ：OSMは「地図開発の自由」を取り戻す鍵</a></li></ol>
    </div>
  </div>

<h2 class="wp-block-heading"><span id="toc1">はじめに：Google Mapsの壁にぶつかっていませんか？</span></h2>



<p>「地図をWebアプリやサイトに表示したい」<br>「位置情報を使ったサービスを提供したい」<br>――そんなとき、多くの開発者が真っ先に思い浮かべるのがGoogle Maps APIでしょう。</p>



<p>Googleが提供するこのサービスは確かに強力ですが、年々厳しくなる利用制限や価格設定、APIキーの発行と制御など、商用利用や中〜大規模サービスの構築時には「コスト」と「制約」の壁にぶつかります。</p>



<p>たとえばこんな課題、心当たりはありませんか？</p>



<ul class="wp-block-list">
<li>月額の無料枠を超えて突然発生する高額課金</li>



<li>APIキーの管理やレート制限に神経を使う毎日</li>



<li>サービス停止を恐れてキャッシュの工夫に追われる</li>



<li>「やりたいことができない」ライセンスの縛り</li>
</ul>



<p>そんなあなたにこそ知ってほしいのが、自由と開放の象徴――OpenStreetMap（OSM）です。</p>



<h2 class="wp-block-heading"><span id="toc2">OpenStreetMapとは？ 一言で言えば「みんなで作る、世界地図」</span></h2>



<p>OpenStreetMap（以下OSM）は、イギリス発のオープンソース地図プロジェクトで、ユーザー自身が地図データを追加・編集・改善していけるのが最大の特徴です。</p>



<p>OSMの魅力は何といってもその「自由さ」です。</p>



<ul class="wp-block-list">
<li>地図データはすべて<strong>無料で使える</strong>（商用利用OK）</li>



<li>データの所有権は誰にも奪われない（<strong>データポータビリティ</strong>）</li>



<li>データを加工・分析・再利用することができる（<strong>ライセンスの緩さ</strong>）</li>
</ul>



<p>要するに「地図データという“資産”を、誰でも無償で使える」これがOSM最大の価値です。</p>



<h2 class="wp-block-heading"><span id="toc3">Google MapsとOpenStreetMapの“決定的な違い”</span></h2>



<p>ここで、Google Maps APIとOSMの主要な違いを一覧で見てみましょう。</p>



<figure class="wp-block-table"><table class="has-fixed-layout"><thead><tr><th>比較項目</th><th>Google Maps API</th><th>OpenStreetMap + ライブラリ</th></tr></thead><tbody><tr><td>利用料金</td><td>有料（従量課金）</td><td>無料（完全フリー）</td></tr><tr><td>商用利用</td><td>制限あり／契約必要</td><td>完全OK（ライセンス表示だけ）</td></tr><tr><td>カスタマイズ性</td><td>限定的（スタイル変更のみ）</td><td>自由自在（地物ごとのスタイル定義可能）</td></tr><tr><td>データの再利用</td><td>不可（2次利用NG）</td><td>可能（CC BY-SAライセンス）</td></tr><tr><td>表示APIの自由度</td><td>Googleに依存</td><td>Leaflet.jsやOpenLayersなど複数選択肢</td></tr></tbody></table></figure>



<p><strong>コストゼロ、自由度100％</strong>――この対比がOSMを選ぶ理由になります。</p>



<h2 class="wp-block-heading"><span id="toc4">「OpenStreetMapって扱いにくいんじゃないの？」という誤解</span></h2>



<p>「自由すぎて逆に使いにくそう……」という声もあるかもしれません。</p>



<p>でも心配は無用。OSMを「Google Mapsと同じ感覚で使う」ための便利なライブラリが存在します。それが以下の2大ライブラリです。</p>



<ul class="wp-block-list">
<li><strong>Leaflet.js</strong>：軽量・モバイル対応・直感的なJavaScriptライブラリ</li>



<li><strong>OpenLayers</strong>：高機能・GIS対応・大規模プロジェクト向け</li>
</ul>



<p>中でもLeaflet.jsは初心者にも扱いやすく、コードも非常にシンプルです。</p>



<pre class="wp-block-preformatted"><code>&lt;div id="map" style="height: 400px;">&lt;/div><br>&lt;script><br>  var map = L.map('map').setView([35.681236, 139.767125], 13);<br>  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {<br>    attribution: '&amp;copy; OpenStreetMap contributors'<br>  }).addTo(map);<br>&lt;/script><br></code></pre>



<p>これだけで、<strong>即座に地図表示</strong>ができます。Google MapsのようなAPIキー取得・課金登録・SDK初期化などは不要です。</p>



<h2 class="wp-block-heading"><span id="toc5">どんな開発に向いている？ OSM活用シーンの例</span></h2>



<h3 class="wp-block-heading"><span id="toc6">1. 地図付きのブログや旅行記サイト</span></h3>



<p>写真やエピソードに地図を添えることで説得力アップ。無料で使えるからPVに左右されず継続可能。</p>



<h3 class="wp-block-heading"><span id="toc7">2. 不動産・店舗検索サイト</span></h3>



<p>カスタムマーカーやルート表示も思いのまま。独自スタイルで見やすさもUP。</p>



<h3 class="wp-block-heading"><span id="toc8">3. 災害支援アプリや避難所マップ</span></h3>



<p>地域貢献型のアプリにも最適。自治体や市民団体でも活用されています。</p>



<h3 class="wp-block-heading"><span id="toc9">4. 公共交通・ルート検索サービス</span></h3>



<p>GTFS（公共交通データ）と組み合わせれば、複雑なルート表示も可能。</p>



<h2 class="wp-block-heading"><span id="toc10">デメリットは？あえて正直に言うなら</span></h2>



<p>OpenStreetMapにも課題はあります。以下が代表的なものです。</p>



<ul class="wp-block-list">
<li><strong>表示スタイルがやや地味</strong>：ただしスタイル変更・独自タイル導入で解決可能</li>



<li><strong>公式サーバーの使用制限</strong>：大量アクセス用途には独自タイルサーバー構築が必要</li>



<li><strong>一部地域で情報が不完全</strong>：ローカル情報はコミュニティ次第</li>
</ul>



<p>とはいえ、これらの多くは「自分で制御できる」範囲にあります。Google Mapsのように「ルールに縛られる」のではなく「ルールを作れる」というのが大きな違いです。</p>



<h2 class="wp-block-heading"><span id="toc11">コスト比較：商用開発における現実的な差</span></h2>



<p>Google Maps APIは2025年現在、月200ドル分の無料枠を超えると以下の課金が発生します。</p>



<ul class="wp-block-list">
<li>地図の表示：1,000回あたり7ドル</li>



<li>ジオコーディング：1,000回あたり5ドル</li>
</ul>



<p>月に20万回以上表示されるような中〜大規模サービスでは、<strong>月数十万円の請求</strong>が発生することもザラです。</p>



<p>一方でOSMは無料。タイルの表示も、Leafletや独自ホスティングで<strong>維持費ゼロまたは数千円レベル</strong>に抑えることができます。</p>



<h2 class="wp-block-heading"><span id="toc12">よくある質問（FAQ）</span></h2>



<p><strong>Q. 商用サイトでも本当に無料で使えますか？</strong><br>A. はい。ライセンス表示（©OpenStreetMap contributors）さえ守れば、商用利用も問題ありません。</p>



<p><strong>Q. APIキーは必要ですか？</strong><br>A. 不要です。地図表示もジオコーディングも、APIキー不要なライブラリやサービスがあります。</p>



<p><strong>Q. 自社スタイルの地図が作れますか？</strong><br>A. 可能です。TileMillやMapbox Studioなどを使えば完全なカスタム地図が作成できます。</p>



<h2 class="wp-block-heading"><span id="toc13">まとめ：OSMは「地図開発の自由」を取り戻す鍵</span></h2>



<p>地図を使った開発は、今やあらゆるWebサービスにおいて必要不可欠です。<br>ですが、その地図が“企業依存”である限り、あなたのサービスは自由ではありません。</p>



<p>OpenStreetMapは、誰でも・無料で・無制限に使える「インフラとしての地図」です。<br>それを支えるのは、世界中のユーザーが育てる地図データと、それを支えるオープンな開発コミュニティ。</p>



<p>Google Mapsのように簡単に使える一方で、自由度と持続可能性は段違い。<br>この機会に、あなたのサービスにも「地図の自由」を取り戻してみませんか？</p>



<div class="wp-block-cocoon-blocks-tab-caption-box-1 tab-caption-box block-box not-nested-style cocoon-block-tab-caption-box"><div class="tab-caption-box-label block-box-label box-label"><span class="tab-caption-box-label-text block-box-label-text box-label-text">OSM開発に役立つリンク集</span></div><div class="tab-caption-box-content block-box-content box-content">
<ul class="wp-block-list">
<li><a class="" href="https://leafletjs.com/">Leaflet.js 公式サイト</a></li>



<li><a class="" href="https://www.openstreetmap.org/">OpenStreetMap公式</a></li>



<li><a>OpenStreetMap Wiki（日本語）</a></li>



<li><a>Mapbox Studio（カスタムスタイル）</a></li>



<li><a class="" href="https://nominatim.org/">Nominatim（ジオコーディング）</a></li>



<li><a class="" href="https://openstreetmap.jp/">日本のOSMコミュニティ</a></li>
</ul>
</div></div>
]]></content:encoded>
					
					<wfw:commentRss>https://blog.takeho.com/graduation-from-google-maps-openstreetmaps-powerful-map-api-enables-free-and-free-development/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>OpenStreetMapに標高データを組み込む &#8211; 標高データの概要とデータについて理解を深める</title>
		<link>https://blog.takeho.com/incorporating-elevation-data-into-openstreetmap-get-an-overview-of-elevation-data-and-an-understanding-of-the-data/</link>
					<comments>https://blog.takeho.com/incorporating-elevation-data-into-openstreetmap-get-an-overview-of-elevation-data-and-an-understanding-of-the-data/#respond</comments>
		
		<dc:creator><![CDATA[たけほ]]></dc:creator>
		<pubDate>Sun, 08 Jun 2025 08:06:41 +0000</pubDate>
				<category><![CDATA[OpenStreetMap]]></category>
		<category><![CDATA[Mapbox]]></category>
		<category><![CDATA[Open-Elevation]]></category>
		<category><![CDATA[OpenTopography]]></category>
		<category><![CDATA[国土地理院]]></category>
		<guid isPermaLink="false">https://blog.takeho.com/?p=1088</guid>

					<description><![CDATA[OpenStreetMap（以下OSM）は、ユーザー主導で自由に編集・利用できる地図データとして非常に優れています。しかし、登山やハイキング、サイクリングといったアウトドア用途のルート検索では「標高情報」が欠落しているた [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>OpenStreetMap（以下OSM）は、ユーザー主導で自由に編集・利用できる地図データとして非常に優れています。しかし、登山やハイキング、サイクリングといったアウトドア用途のルート検索では「標高情報」が欠落しているため、急勾配や山岳地域の経路選定に必要な高度差を考慮できず、推奨できません。そこで本記事では、OSMに標高データを組み込むための概要解説と「自前でデータを取得・組み込む」方法をステップバイステップでご紹介します。</p>



<h2 class="wp-block-heading">標高データAPIの現状と課題</h2>



<p>インターネット上には無料で利用できる標高データAPIがいくつか存在します。代表的なものを以下に挙げます（※APIリクエスト制限や有料プランへの誘導が多い点にご留意ください）。</p>



<ol class="wp-block-list">
<li><strong>Google Maps Elevation API</strong>
<ul class="wp-block-list">
<li>無料枠あり。ただし1日あたり2,500リクエストまで。超過時は課金。</li>
</ul>
</li>



<li><strong>Open-Elevation API</strong>
<ul class="wp-block-list">
<li>完全無料。ただしリクエスト遅延、運営不安定の報告あり。</li>
</ul>
</li>



<li><strong>Mapbox Terrain-RGB</strong>
<ul class="wp-block-list">
<li>無料枠あり。高精度だが、商用利用ではプラン契約必須。</li>
</ul>
</li>



<li><strong>USGS Elevation Point Query Service</strong>
<ul class="wp-block-list">
<li>アメリカ国内限定。無料だが日本国内では未対応。</li>
</ul>
</li>



<li><strong>OpenTopography</strong>
<ul class="wp-block-list">
<li>無料プランあり。リクエスト制限・APIキー取得が必要。</li>
</ul>
</li>
</ol>



<p>これらのAPIを利用すると手軽ですが、多くが利用規約やリクエスト制限に縛られ、継続運用コストや安定性に課題があります。そこで本記事では、API依存せず、自ら標高データを取得しOSMに組み込む手法を最終目標とします。</p>



<h2 class="wp-block-heading">標高データの代表的提供元とその取得方法</h2>



<p>国内における最も信頼性が高い標高データ提供元は国土地理院（GSI）の「基盤地図情報 数値標高モデル（DEM）」です。以下、主要な提供元との比較と、国土地理院を選ぶ理由をまとめます。</p>



<figure class="wp-block-table"><table class="has-fixed-layout"><thead><tr><th>提供元</th><th>データ精度</th><th>利用条件</th><th>メリット</th><th>デメリット</th></tr></thead><tbody><tr><td>Google Maps Elevation API</td><td>高精度</td><td>無料枠制限、商用利用課金</td><td>開発者向けSDK豊富、信頼性高い</td><td>リクエスト制限、課金体系が複雑</td></tr><tr><td>Open-Elevation API</td><td>中精度</td><td>完全無料</td><td>APIキー不要、シンプル</td><td>遅延・メンテ不安</td></tr><tr><td>Mapbox Terrain-RGB</td><td>高精度</td><td>無料枠制限、商用利用課金</td><td>カラーマップで可視化容易</td><td>ライセンス条件厳格</td></tr><tr><td>国土地理院 DEM</td><td>1m/5m/10m</td><td>完全無料、商用･非商用問わず可</td><td>日本全国を公的機関が提供、最新データ</td><td>データサイズ大、取り扱いが煩雑</td></tr><tr><td>OpenTopography</td><td>可変</td><td>無料枠制限、APIキー必要</td><td>多様なフォーマット対応</td><td>日本国内利用時やや不便</td></tr></tbody></table></figure>



<p><strong>国土地理院を選ぶ理由</strong></p>



<ul class="wp-block-list">
<li><strong>公的機関提供</strong><br>データの信頼性・正確性が高い</li>



<li><strong>ライセンス自由度</strong><br>商用・非商用問わず再配布や加工が可能</li>



<li><strong>更新頻度</strong><br>最新の標高データが定期的に公開</li>
</ul>



<h2 class="wp-block-heading">国土地理院データ取得の手順</h2>



<p>以下の手順で「基盤地図情報ダウンロードサービス」から数値標高モデルを入手します。</p>



<figure class="wp-block-image size-large"><img fetchpriority="high" decoding="async" width="1280" height="685" src="https://blog.takeho.com/wp-content/uploads/2025/06/893748923-1280x685.png" alt="" class="wp-image-1093" srcset="https://blog.takeho.com/wp-content/uploads/2025/06/893748923-1280x685.png 1280w, https://blog.takeho.com/wp-content/uploads/2025/06/893748923-640x342.png 640w, https://blog.takeho.com/wp-content/uploads/2025/06/893748923-768x411.png 768w, https://blog.takeho.com/wp-content/uploads/2025/06/893748923.png 1333w" sizes="(max-width: 1280px) 100vw, 1280px" /><figcaption class="wp-element-caption">基盤地図情報 ダウンロードサービス</figcaption></figure>



<p></p>



<ol class="wp-block-list">
<li>ブラウザで「基盤地図情報ダウンロードサービス」<br>（<a>https://service.gsi.go.jp/kiban/app/</a>）にアクセス。</li>



<li>「基盤地図情報」の一覧から「数値標高モデル」を選択し移動。</li>



<li>データ形式として<strong>1mメッシュ</strong>／<strong>5mメッシュ</strong>／<strong>10mメッシュ</strong>を選択可能。
<ul class="wp-block-list">
<li>※本記事ではバランスの取れた<strong>5mメッシュ</strong>を選択します。</li>
</ul>
</li>



<li>地図上で埼玉県所沢市周辺を拡大し、スケールを2,000ピクセル程度に設定。<br>タイル番号「533953」をクリックしてダウンロードリストに追加。</li>



<li>「ダウンロード・解凍」ボタンを押下し、XML形式データ（100ファイル）が取得できることを確認。</li>



<li>ダウンロードした100ファイルの中から「FG-GML-5339-53-01-DEM5A-20250214.xml」をテキストエディタで開く。</li>



<li><code>&lt;gml:tupleList></code>要素を探すと、33750個の標高データが並ぶリストが存在。</li>
</ol>



<h2 class="wp-block-heading">&lt;gml:tupleList>のデータ構造と意味</h2>



<p><code>&lt;gml:tupleList&gt;</code>には、5mメッシュの各格子点に対応する標高値が「空白区切り」の数値として格納されています。33750という数字は、<strong>縦225点 × 横150点</strong>のグリッドに相当し、以下のように配列されています。</p>



<ul class="wp-block-list">
<li><strong>並び順</strong>：<br>1行目の左上から右方向に150点分、<br>続いて2行目の左端から右方向に150点分、<br>…を繰り返して225行分。</li>



<li><strong>解釈例</strong>：
<ul class="wp-block-list">
<li>最初の数値＝タイル左上の標高（m）</li>



<li>150番目の数値＝タイル上辺の右端標高</li>



<li>151番目＝2行目左端の標高</li>
</ul>
</li>
</ul>



<h2 class="wp-block-heading">5mメッシュタイルの面積計算</h2>



<p>5mメッシュ1格子の面積：5m × 5m = 25㎡<br>タイル全体の格子数：33750点<br>→ タイル面積 = 25㎡ × 33750 = <strong>843,750㎡</strong>（約0.844km²）</p>



<p>100ファイル分を用いると、所沢市を含むタイル群の合計面積を算出できます。<br>（例：東京多摩地域全体をカバーするエリアなど応用可能）</p>



<h2 class="wp-block-heading">メッシュ解像度とサーバ要件</h2>



<p><strong>1mメッシュ</strong></p>



<ul class="wp-block-list">
<li>データ量は5mメッシュの約25倍（225×5=1125行、150×5=750列→843,750点）</li>



<li>高性能なストレージ・メモリ・CPUが必須</li>
</ul>



<p><strong>5mメッシュ</strong></p>



<ul class="wp-block-list">
<li>バランス良く用途が多いが、標高解析が多岐にわたる場合は尚更高性能環境が望ましい</li>
</ul>



<p><strong>10mメッシュ</strong></p>



<ul class="wp-block-list">
<li>データ量はさらに軽量で、まずはこちらで運用実績を積み、パフォーマンス確認をおすすめします</li>



<li>次のステップアップとして5mメッシュ導入を検討</li>
</ul>



<h2 class="wp-block-heading">まとめ</h2>



<p>本記事では、OSMに標高データを組み込むための前提知識と、国土地理院を活用したデータ取得手順、データ構造の解説、面積計算例、解像度別の運用提案までをご紹介しました。次回以降では、実際に取得したXMLデータをGeoJSONやタイル形式に変換し、Leaflet.js上で可視化するステップに進みます。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://blog.takeho.com/incorporating-elevation-data-into-openstreetmap-get-an-overview-of-elevation-data-and-an-understanding-of-the-data/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
