<?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/"
		xmlns:xhtml="http://www.w3.org/1999/xhtml"
>

<channel>
	<title>ke-tai.org &#187; モバイル地図</title>
	<atom:link href="http://ke-tai.org/blog/tag/%e3%83%a2%e3%83%90%e3%82%a4%e3%83%ab%e5%9c%b0%e5%9b%b3/feed/" rel="self" type="application/rss+xml" />
	<link>http://ke-tai.org/blog</link>
	<description>ke-tai.org　ケータイプログラマのためのコミュニティサイト。携帯電話向けWeb開発の技術情報を扱っています。</description>
	<lastBuildDate>Tue, 15 May 2012 05:32:22 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://ke-tai.org/blog/tag/%e3%83%a2%e3%83%90%e3%82%a4%e3%83%ab%e5%9c%b0%e5%9b%b3/feed/" />
		<item>
		<title>「Google Static Maps API」を使って携帯でGoogleマップを表示する(ライン表示編)</title>
		<link>http://ke-tai.org/blog/2008/05/13/gmap2/</link>
		<comments>http://ke-tai.org/blog/2008/05/13/gmap2/#comments</comments>
		<pubDate>Tue, 13 May 2008 14:34:58 +0000</pubDate>
		<dc:creator>matsui</dc:creator>
				<category><![CDATA[ソフト紹介]]></category>
		<category><![CDATA[API]]></category>
		<category><![CDATA[GoogleMap]]></category>
		<category><![CDATA[モバイルマップ]]></category>
		<category><![CDATA[モバイル地図]]></category>

		<guid isPermaLink="false">http://ke-tai.org/blog/?p=292</guid>
		<description><![CDATA[以前ご紹介した、「Google Static Maps APIを使って携帯でGoogleマップを表示する」という記事の続編です。 今回は地図をただ表示するだけではなく、もう少し実践的な内容をお伝えしようと思います。 「G [...]]]></description>
			<content:encoded><![CDATA[<p>以前ご紹介した、<a href="http://ke-tai.org/blog/2008/02/26/gmapstatic/" target="_blank">「Google Static Maps APIを使って携帯でGoogleマップを表示する」</a>という記事の続編です。</p>
<p>今回は地図をただ表示するだけではなく、もう少し実践的な内容をお伝えしようと思います。</p>
<p>「Google Static Maps API」をご存じない方のために簡単に説明すると、PC向けのJavaScriptで表示するタイプのGoogleMapとは違い、画像で表示するタイプの地図になります。<br />
静止画なので、グリグリ動かせたりはしませんが、ケータイからも利用することができます。</p>
<p class="spacer-small">&nbsp;</p>
<p>今回は地図の上に、順路を示すラインを引いてみることにします。</p>
<p>ラインは「path」パラメータを指定することで表示できます。</p>
<pre class="super-pre-small"><code>path=[色],[線の太さ]|[緯度1],[経度1]|[緯度2],[経度2]・・・</code></pre>
<p>[色]の部分は「rgb:#ff0000」のように、よくあるRGB形式での色指定を書きます。<br />
それに加え、「rgba:#ff000066」のように、「rgba:（aを追加）」と書くことで、透明度を指定することもできます。<br />
上記の例だと色が「#ff0000（赤）」、透明度が「66」ということになります。</p>
<p>[線の太さ]は、「weight:5」のように引きたい線の幅をピクセルで指定すればOKです。</p>
<p>[緯度]・[経度]を「|（パイプ）」で続けて指定していくことで、それぞれがラインで繋がれていき、線を引いていくことができます。</p>
<p class="spacer-small">&nbsp;</p>
<p>具体例としては次のようになります。</p>
<pre class="super-pre-small"><code>&lt;img src="http://maps.google.com/staticmap?
center=43.054794,141.375856
&amp;zoom=17
&amp;size=220x300
&amp;maptype=mobile
&amp;markers=43.055294,141.375356,reds%7C43.053894,141.376147,bluei
&amp;path=rgba:0x0000ff66,weight:6|43.055294,141.375356|43.055243,141.37534|
43.055135,141.375171|43.054041,141.376389|43.053959,141.376249
&amp;key=[APIキー(GoogleMapと共通)]"
 /&gt;
</code></pre>
<p>表示例：<br />
<img src="http://ke-tai.org/blog/wp-content/uploads/2008/05/20080513_staticmap11.gif" alt="" title="20080513_staticmap11" width="220" height="300" class="alignnone size-medium wp-image-294" />&nbsp;<img src="http://ke-tai.org/blog/wp-content/uploads/2008/05/20080513_staticmap2.gif" alt="" title="20080513_staticmap2" width="220" height="300" class="alignnone size-full wp-image-295" /></p>
<p>ケータイ用のGoogleMapでは、拡大縮小が自由に行えないため、ズームレベルの違う2種類の画像を用意しておくと親切かもしれません。</p>
<p class="spacer-small">&nbsp;</p>
<p>なお、詳しいAPI仕様はこちらの公式リファレンス（英語）を参照してください。</p>
<p>→　<a href="http://code.google.com/apis/maps/documentation/staticmaps/" target="_blank">Google Code　Google Static Maps API</a> <small>[google.com]</small></p>
<p class="spacer">&nbsp;</p>
<p><strong><em>関連：</em></strong></p>
<ul>
<li><em><a href="http://ke-tai.org/blog/2008/02/26/gmapstatic/">「Google Static Maps API」を使って携帯でGoogleマップを表示する  </a></em></li>
<li><em><a href="http://ke-tai.org/blog/2008/05/12/gcrawler/">Google、モバイル向けクローラーの情報公開へ</a></em></li>
<li><em><a href="http://ke-tai.org/blog/2008/04/24/adsenseimg/">携帯向けGoogle AdSenseがバナー広告に対応</a></em></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://ke-tai.org/blog/2008/05/13/gmap2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://ke-tai.org/blog/2008/05/13/gmap2/" />
	</item>
	</channel>
</rss>

