|
|
楼主 |
发表于 2006 年 1 月 14 日 12:56:42
|
显示全部楼层
把Google Maps加到自己的Blog里
< >首先需要到<A href="http://www.google.com/apis/maps/">http://www.google.com/apis/maps/</A>申请一个API key，你需要用你的GmailID登录。申请成功以后你会得到一个API key，和一段添加到网页的事例代码，去掉一些没有用的Html代码以后剩下：</P><RE><CODE><script src="http://maps.google.com/maps?file=api&v=1&key=
[API key]" type="text/java script"></script>
<div id="map" style="width: 500px; height: 400px"></div>
<script type="text/java script">
//<![CDATA[
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);
//]]>
</script></CODE></PRE>
<><A id=more-299></A><BR>其中<BR><CODE><div id="map" style="width: 500px; height: 400px"></div></CODE></P>
<P>这行可以自定义显示Google Maps的宽（width）和高（height）。</P>
<P><CODE>map.centerAndZoom(new GPoint(-122.1419, 37.4419), 4);</CODE></P>
<P>这行算是整段代码最重要的部分，可以用来调整Google Maps显示的地理位置（<CODE>-122.1419, 37.4419</CODE>）和大小（<CODE>4</CODE>）。我们下面要做的就是把这两行代码替换成适合自己的。</P>
<P>到<A href="http://maps.google.com/">http://maps.google.com</A>在地图上找到自己所在的位置，用鼠标双击，你双击的那点就会显示在地图的中央，然后点击右上角的<A href="http:///#">Link to this page</A>，地址栏里的地址就包含了你的坐标信息，比如我在的大连地址是：</P>
<P><CODE>http://maps.google.com/?ll=38.794768,121.294556&spn=1.051049,2.04071</CODE></P>
<P>其中<CODE>38.794768,121.294556</CODE>，就是大连的坐标，把他们替换到代码里:</P>
<P><CODE>map.centerAndZoom(new GPoint(121.294556, 38.794768), 15);</CODE></P>
<P>因为Google Maps显示的中国的信息有限，所以不要把最后的数值设得太小，我写的是15（最大到16），具体自己把握就行。</P>
<P>如果想在自己的位置上加个标记，那把下面这段代码加到<CODE>map.centerAndZoom...</CODE>这行下面：</P>
<P><CODE>map.addOverlay(new GMarker(new GPoint(121.294556, 38.794768)));</CODE></P>
<P>还想在标记上加上弹出气泡的功能，就加入下面一段：</P><PRE><CODE> var dalian = new GMarker (new GPoint (121.294556, 38.794768));
GEvent.addListener (dalian, "click", function() {
dalian.openInfoWindowHtml ("我在大连 Oh!Yeah!");
});
map.addOverlay (dalian);</CODE></PRE>
<P>最后的代码就是这些：</P><PRE><CODE><script src="http://maps.google.com/maps?file=api&v=1&key=
[API key]" type="text/java script"></script>
<div id="map" style="width: 400px; height: 300px"></div>
<script type="text/java script">
//<![CDATA[
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(121.294556, 38.794768), 15);
var dalian = new GMarker (new GPoint (121.294556, 38.794768));
GEvent.addListener (dalian, "click", function() {
dalian.openInfoWindowHtml ("我在大连 Oh!Yeah!");
});
map.addOverlay (dalian);
//]]>
</script></CODE></PRE> |
|
IP卡
狗仔卡
发表于 2006 年 1 月 14 日 12:56:42
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
显身卡
发表于 2006 年 1 月 14 日 13:46:25
