<?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>D.A.C.S.I.T - Web &#187; Google map</title>
	<atom:link href="http://thietkeweb.dacsit.com/tag/google-map/feed" rel="self" type="application/rss+xml" />
	<link>http://thietkeweb.dacsit.com</link>
	<description>Thiết kế web, Ảnh đẹp, Wordpress, Joomla, Template, Theme, Thủ thuật ...</description>
	<lastBuildDate>Tue, 20 Apr 2010 16:36:40 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Hướng dẫn đưa google map vào site</title>
		<link>http://thietkeweb.dacsit.com/2010/03/huong-dan-dua-google-map-vao-site.html</link>
		<comments>http://thietkeweb.dacsit.com/2010/03/huong-dan-dua-google-map-vao-site.html#comments</comments>
		<pubDate>Tue, 09 Mar 2010 04:39:31 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Thủ thuật khác]]></category>
		<category><![CDATA[Google map]]></category>

		<guid isPermaLink="false">http://thietkeweb.dacsit.com/?p=149</guid>
		<description><![CDATA[Trong website, bạn muốn hiện bản đồ Google map của 1 địa điểm nào đó (ví dụ 105 Bà Huyện Thanh Quan). Vậy phải làm thế nào? Hướng dẫn dưới [...]]]></description>
			<content:encoded><![CDATA[<p>Trong website, bạn muốn hiện bản đồ Google map của 1 địa điểm nào đó (ví dụ 105 Bà Huyện Thanh <span id="IL_AD4">Quan</span>). Vậy phải làm thế nào? Hướng dẫn dưới đây:</p>
<p>Bước 1: Đăng ký một tài khoản mail với google nếu bạn chưa có tài khoản nào<br />
Bước 2 : nhập URL : <a href="http://code.google.com/apis/maps/" target="_blank">http://code.google.com/apis/maps/</a></p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/1.jpg"><img src="http://hoacat.plus.vn/img/1.jpg" border="0" alt="" /></a></p>
<p>Chọn : Sign up for a Google Maps API key<br />
Bước 3 : nhập địa chỉ site của bạn vào</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/2.jpg"><img src="http://hoacat.plus.vn/img/2.jpg" border="0" alt="" /></a></p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/3.jpg"><img src="http://hoacat.plus.vn/img/3.jpg" border="0" alt="" /></a></p>
<p>Bước 4 : Google sẽ phát sinh cho bạn một key :</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/4.jpg"><img src="http://hoacat.plus.vn/img/4.jpg" border="0" alt="" /></a></p>
<p>Bước 5 : Chép đoạn <span id="IL_AD2">code</span> sau bỏ vào trước tag   trong <span id="IL_AD3">trang</span> web của bạn</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/5.jpg"><img src="http://hoacat.plus.vn/img/5.jpg" border="0" alt="" /></a></p>
<p>Bước 6 : Trở qua trang web google, click vào link Loading the Maps API</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/6.jpg"><img src="http://hoacat.plus.vn/img/6.jpg" border="0" alt="" /></a></p>
<p>Sẽ xuất hiện đoạn code mẫu như bên dưới. Hãy chép đoạn code chứa hàm initialize (xem hình dưới) vào trước kết thúc   trang web của bạn.</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/7.jpg"><img src="http://hoacat.plus.vn/img/7.jpg" border="0" alt="" /></a></p>
<p>Bước 7 : Đưa vào tag Body sự kiện onload và onunload . Đưa tag div vào trong tag body như hình</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/8.jpg"><img src="http://hoacat.plus.vn/img/8.jpg" border="0" alt="" /></a></p>
<p>Các thông số cần chú ý :</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/9.jpg"><img src="http://hoacat.plus.vn/img/9.jpg" border="0" alt="" /></a></p>
<p>Bước 8: Thêm mô tả cho vị trí hiện bản đồ<br />
Nhắp sau dòng map.setCenter(new GLatLng(37.4419,-122.1419), 13);  (xem hình trên) rổi Enter xuống hàng gõ lệnh sau :<br />
map.openInfoWindow(map.getCenter(), document.createTextNode(&#8221;Góc Tú Xương, Quận 3, TPHCM&#8221;));<br />
Bước 9: Chỉnh kinh độ , vĩ độ , độ zoom phù hợp nơi bạn muốn hiện bản đồ.  Ví dụ kinh độ/vĩ độ của 105 bà huyện thanh quan góc Tú xương là 10.779622500015304,106.68488502502441<br />
Bước 10: F12 xem thử trang web, bạn sẽ thấy bản đồ như sau :</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/11.jpg"><img src="http://hoacat.plus.vn/img/11.jpg" border="0" alt="" /></a></p>
<p>- Ngoài ra ta có thể chỉnh độ rộng cao của div chứa bản đồ :</p>
<p>Lab bổ sung: Vậy làm sao biết địa chỉ góc Tú Xương Bà Huyện Thanh Quan là 10.779622500015304,106.68488502502441 ? Hãy theo hướng dẫn cách chọn tọa độ của địa điểm mà bạn muốn hiện bản đồ:<br />
Bước 1 : bạn gõ địa chỉ sao vào trang : <a href="http://open.atlas.free.fr/GMapsTransparenciesImgOver.php" target="_blank">http://open.atlas.free.fr/GMapsTrans&#8230;iesImgOver.php</a><br />
- Chọn Map :<br />
- Bạn Chọn Zoom out : đến cập độ 2 và chọn vị trí là nước Việt Nam</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/12.jpg"><img src="http://hoacat.plus.vn/img/12.jpg" border="0" alt="" /></a></p>
<p>Bước 2 : Nhắp double vào nước vị trí Việt Nam ,chọn TP HCM và Zoom In đến level 16. Chọn vị trí bạn muốn xác định tọa độ , click double vào vị trí muốn xác định tọa độ</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/13.jpg"><img src="http://hoacat.plus.vn/img/13.jpg" border="0" alt="" /></a></p>
<p>- Sau đó ta nhìn xuống phía dưới trang sẽ thấy tọa độ được lấy :</p>
<p><a onclick="return hs.expand(this)" href="http://hoacat.plus.vn/img/14.jpg"><img src="http://hoacat.plus.vn/img/14.jpg" border="0" alt="" /></a></p>
<p>Lấy tọa độ thu được đưa vào code như sau :</p>
]]></content:encoded>
			<wfw:commentRss>http://thietkeweb.dacsit.com/2010/03/huong-dan-dua-google-map-vao-site.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
