谷歌地图API学习
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
4 <head><!-------www.dusystem.com------->
5 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
6 <title>缔友计算机信息技术有限公司-捷为工作室,各办事处在线地图</title>
7 <meta name="description" content="涂聚文,缔友计算机信息技术有限公司,经营信息流,物流,人力资源流,资本流的系统解决方案的开发与设计和服务,geoVI studio.Geovin Du. Systems Solution to Fund flow,and Information flow,and Material flow,and Control flow,and Human Resource.Applied software development,design and service。.">
8<meta name="description" content="Study,Communicate。缔友计算机信息技术有限公司 ">
9<meta name="Robots" content="all index follow ">
10<meta name="Author" content="涂聚文" />
11<meta name="keywords" content="Chinea,Guangdong Province,Shenzhen city,Nanshan District,Hi-teach industry Park, geoVI studio,Geovin Du,Systems Solution.勝利は仕事部屋である貴方にご光来を賜ることを歓迎,the original affiliation, Jiangxi Province, the Ji'an city, YongFeng coutry, Ouyang's hometown. Discussion forum, friend reason person, English, Japanese language, Korean language The music appreciation, Wan Nian calendar, the English salon, the trade market, the information, the telecommunication electron, the electric appliance, the currency foreign exchange, the news, the book, by talk, the fable, the fairy tale, the novel, the sketch philosophy, the philosophy, the national studies, the poem, the word, the prose, the tune, manages the creativity, the software technology, sound, the picture, the image data warehouse, C++, C.NET, WEB,JAVA, J2EE XML, the HTML, software engineering, the physiological, keeping in good health, the traveling, lives,geocVi のスタジオはgeovindu, 中国のGuangdong の地 域,Shenzhen のNanShan 地区すなわち高く新しい技術的な企業の 開発の地帯すなわち元の加入すなわちJiangxi の地域すなわち Ji'an 都市, 故郷coutry YongFeng Ouyang's のへ, あな たを歓迎する。議論のフォーラムすなわち友人の理由人, 英語すなわち日本語の言語すなわち韓国語の言語は 音楽感謝すなわ ちNian の弱々しいカレンダーすなわち英国の大広間すなわち貿易市場すなわち情報すなわちテレコミュニケーションの電子すなわ ち電気電気器具すなわち通貨の外国為替すなわちニュースすなわ ち本, 話によって, fable のおとぎ話すなわち小説すなわちスケ ッチの哲学すなわち哲学は, 国民調査する, 詩すなわち単語すな わち散文すなわち調子, 管理する創造性すなわちソフトウェア技 術すなわち音すなわち映像すなわちイメージ?データの倉庫 , C++, C.NET の網, ジャワ, J2EE XML, html のよい健康すなわ ち移動, 生命で保つソフトウエア工学すなわち生理学を,?geoVI ? ? ™?? geocVi ????? geovindu, ?? ? Guangdong ??, Shenzhen ? NanShan ??, ?? ??? ?? ?? ?? ?? ??, ?? affiliation, Jiangxi ?? , Ji'an ??, coutry YongFeng, Ouyang's?, ?? ? ???. ?? ????, ?? ?? ??, ??, ?? ??, ? ? ??? ?? ??, Nian ??? ??, ?? ??, ?? ??, ??, ??? ?? ??, ????, ?? ?? ??, ? ?, ?, ??????,fable ? ???? ??, ??, ??? ??, ???, ?? ????, ?, ??, ??, ?, ???? ???, ????? ??, ??, ??,?? ?? ?? , C++, C.NET ? ??, ??, J2EE XML, HTML ? ??, ??, ???? ??? ????? ????, ???">
12<link rel="shortcut icon" href="http://www.dusystem.com/favicon.ico" type="image/x-icon" />
13<link rel="icon" href="http://www.dusystem.com/favicon.ico" type="image/ico" />
14<link rel="Bookmark" href="favicon.ico">
15
16 <style>
17 .map_canvas{
18 width: 800px;
19 height: 700px;
20 margin:0 auto;
21 }
22 #map_canvas{
23 width: 800px;
24 height: 700px;
25 margin:0 auto;
26 }
27 </style>
28 <script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAAAjJ-Aw8b-vUa1mqytmMMIBTZecCRiptFc5fTOF51NsRqEX7UohRPhFk_OhDGu_VEztVmAdOlkYZDTA&hl=zh-CN" type="text/javascript"></script>
29 <script type="text/javascript">
30 document.write('<script type="text/javascript" src="src/popupmarker'+(document.location.search.indexOf('packed')>-1?'_packed':'')+'.js"><'+'/script>');
31 </script>
32 <script type="text/javascript">
33 //39.9493, 116.3975 北京
34//27.327187,115.421848永丰
35//22.543532,113.950836深圳
36//23.086304,113.315349 广州
37 function initialize() {
38 if (GBrowserIsCompatible()) {
39 var map = new GMap2(document.getElementById("map_canvas"));
40 map.setCenter(new GLatLng(23.086304,113.315349), 7);
41 /*1
42 var customUI = map.getDefaultUI();
43 // Remove MapType.G_HYBRID_MAP
44 customUI.maptypes.hybrid = false;
45 map.setUI(customUI);
46 */
47 /*2*/
48 map.removeMapType(G_HYBRID_MAP);
49 map.setCenter(new GLatLng(23.086304,113.315349), 5);
50 map.setUIToDefault();//有四种选择类型的地图
51 var mapControl = new GMapTypeControl();//地图类型切换
52 map.addControl(mapControl);//GLargeMapControl
53 map.addControl(new GScaleControl());//地图比例尺//GHierarchicalMapTypeControl
54 map.addControl(new GLargeMapControl());
55
56
57 /*3
58 var mapTypeControl = new GMapTypeControl();
59 var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
60 var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
61 map.addControl(mapTypeControl, topRight);
62 GEvent.addListener(map, "dblclick", function() {
63 map.removeControl(mapTypeControl);
64 map.addControl(new GMapTypeControl(), bottomRight);
65 });
66 map.addControl(new GSmallMapControl());
67*/
68 //map.addControl(new GMapTypeControl());
69 // map.addControl(new GScaleControl());
70 // map.addControl(new GOverviewMapControl());
71 //map.addControl(new GLargeMapControl());
72 //自定标志图
73 var icon = new GIcon();
74 icon.image = "http://www.lukfook.com.hk/image/logo.png";
75 //icon.shadow = "image/logo2.png";
76 icon.iconSize = new GSize(25, 28);
77 // icon.shadowSize = new GSize(22, 20);
78 icon.iconAnchor = new GPoint(6, 20);
79 icon.infoWindowAnchor = new GPoint(5, 1);
80 //消息框提示位置
81 var infoTabs11 = [
82 new GInfoWindowTab("分行地址", "<b>上水分行(SS1)</b><br>新界上水龍琛路39號上水廣場28 樓<br>ShopNo.235-237,Level2,39LungSumAvenue,<br>LandmarkNorth,SheungShui,N.T.<br>"),
83 new GInfoWindowTab("聯系方式", "聯系電話:2783 8822<br><br>"),
84 new GInfoWindowTab("介绍信息", "缔友计算机信息技术有限公司<br><br>")
85 ];
86 // 在注置于地的中央,并自已弹出气泡提示窗口
87
88 //放置要加的坐标
89 var point11 = new GLatLng(22.503575,114.129823);
90 var marker11 = new GMarker(point11,icon);
91
92 //加上标志方法
93 GEvent.addListener(marker11, "click", function() {
94
95 marker11.openInfoWindowTabsHtml(infoTabs11);
96 // window.setTimeout(function() { map.setCenter(new GLatLng(22.503575,114.129823));}, 1000);
97 });
98 map.addOverlay(marker11);
99//------------------------------
100
101 var opt = {text:"<img src='images/japan.jpg' width='20' height='13'>缔友计算机信息技术有限公司深圳办事处,捷为工作室<br>深圳市南山区科技园中区", draggable:true};
102 var marker1 = createMaker(new GLatLng(22.543532,113.950836), "缔友计算机信息技术有限公司", opt);
103 map.addOverlay(marker1);
104
105 var opt = {text:"<img src='images/usa.jpg' width='20' height='13'>缔友计算机信息技术有限公司<br>江西省吉安市永丰县永丰大道", draggable:true};
106 var marker2 = new PopupMarker(new GLatLng(27.327187,115.421848), opt);
107 map.addOverlay(marker2);
108 marker2.showPopup();
109 }
110 }
111
112 function createMaker(latlng, msg, opt){
113 var marker = new PopupMarker(latlng, opt);
114
115 GEvent.addListener(marker,"click", function(){
116 marker.openInfoWindowHtml(msg);
117 marker.hidePopup();
118 });
119 return marker;
120 }
121 </script>
122
123 </head>
124 <body onload="initialize()" onunload="GUnload()">
125 <div id="map_canvas" class="map_canvas"></div>
126 </body>
127</html>
128
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
4 <head><!-------www.dusystem.com------->
5 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
6 <title>缔友计算机信息技术有限公司-捷为工作室,各办事处在线地图</title>
7 <meta name="description" content="涂聚文,缔友计算机信息技术有限公司,经营信息流,物流,人力资源流,资本流的系统解决方案的开发与设计和服务,geoVI studio.Geovin Du. Systems Solution to Fund flow,and Information flow,and Material flow,and Control flow,and Human Resource.Applied software development,design and service。.">
8<meta name="description" content="Study,Communicate。缔友计算机信息技术有限公司 ">
9<meta name="Robots" content="all index follow ">
10<meta name="Author" content="涂聚文" />
11<meta name="keywords" content="Chinea,Guangdong Province,Shenzhen city,Nanshan District,Hi-teach industry Park, geoVI studio,Geovin Du,Systems Solution.勝利は仕事部屋である貴方にご光来を賜ることを歓迎,the original affiliation, Jiangxi Province, the Ji'an city, YongFeng coutry, Ouyang's hometown. Discussion forum, friend reason person, English, Japanese language, Korean language The music appreciation, Wan Nian calendar, the English salon, the trade market, the information, the telecommunication electron, the electric appliance, the currency foreign exchange, the news, the book, by talk, the fable, the fairy tale, the novel, the sketch philosophy, the philosophy, the national studies, the poem, the word, the prose, the tune, manages the creativity, the software technology, sound, the picture, the image data warehouse, C++, C.NET, WEB,JAVA, J2EE XML, the HTML, software engineering, the physiological, keeping in good health, the traveling, lives,geocVi のスタジオはgeovindu, 中国のGuangdong の地 域,Shenzhen のNanShan 地区すなわち高く新しい技術的な企業の 開発の地帯すなわち元の加入すなわちJiangxi の地域すなわち Ji'an 都市, 故郷coutry YongFeng Ouyang's のへ, あな たを歓迎する。議論のフォーラムすなわち友人の理由人, 英語すなわち日本語の言語すなわち韓国語の言語は 音楽感謝すなわ ちNian の弱々しいカレンダーすなわち英国の大広間すなわち貿易市場すなわち情報すなわちテレコミュニケーションの電子すなわ ち電気電気器具すなわち通貨の外国為替すなわちニュースすなわ ち本, 話によって, fable のおとぎ話すなわち小説すなわちスケ ッチの哲学すなわち哲学は, 国民調査する, 詩すなわち単語すな わち散文すなわち調子, 管理する創造性すなわちソフトウェア技 術すなわち音すなわち映像すなわちイメージ?データの倉庫 , C++, C.NET の網, ジャワ, J2EE XML, html のよい健康すなわ ち移動, 生命で保つソフトウエア工学すなわち生理学を,?geoVI ? ? ™?? geocVi ????? geovindu, ?? ? Guangdong ??, Shenzhen ? NanShan ??, ?? ??? ?? ?? ?? ?? ??, ?? affiliation, Jiangxi ?? , Ji'an ??, coutry YongFeng, Ouyang's?, ?? ? ???. ?? ????, ?? ?? ??, ??, ?? ??, ? ? ??? ?? ??, Nian ??? ??, ?? ??, ?? ??, ??, ??? ?? ??, ????, ?? ?? ??, ? ?, ?, ??????,fable ? ???? ??, ??, ??? ??, ???, ?? ????, ?, ??, ??, ?, ???? ???, ????? ??, ??, ??,?? ?? ?? , C++, C.NET ? ??, ??, J2EE XML, HTML ? ??, ??, ???? ??? ????? ????, ???">
12<link rel="shortcut icon" href="http://www.dusystem.com/favicon.ico" type="image/x-icon" />
13<link rel="icon" href="http://www.dusystem.com/favicon.ico" type="image/ico" />
14<link rel="Bookmark" href="favicon.ico">
15
16 <style>
17 .map_canvas{
18 width: 800px;
19 height: 700px;
20 margin:0 auto;
21 }
22 #map_canvas{
23 width: 800px;
24 height: 700px;
25 margin:0 auto;
26 }
27 </style>
28 <script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAAAjJ-Aw8b-vUa1mqytmMMIBTZecCRiptFc5fTOF51NsRqEX7UohRPhFk_OhDGu_VEztVmAdOlkYZDTA&hl=zh-CN" type="text/javascript"></script>
29 <script type="text/javascript">
30 document.write('<script type="text/javascript" src="src/popupmarker'+(document.location.search.indexOf('packed')>-1?'_packed':'')+'.js"><'+'/script>');
31 </script>
32 <script type="text/javascript">
33 //39.9493, 116.3975 北京
34//27.327187,115.421848永丰
35//22.543532,113.950836深圳
36//23.086304,113.315349 广州
37 function initialize() {
38 if (GBrowserIsCompatible()) {
39 var map = new GMap2(document.getElementById("map_canvas"));
40 map.setCenter(new GLatLng(23.086304,113.315349), 7);
41 /*1
42 var customUI = map.getDefaultUI();
43 // Remove MapType.G_HYBRID_MAP
44 customUI.maptypes.hybrid = false;
45 map.setUI(customUI);
46 */
47 /*2*/
48 map.removeMapType(G_HYBRID_MAP);
49 map.setCenter(new GLatLng(23.086304,113.315349), 5);
50 map.setUIToDefault();//有四种选择类型的地图
51 var mapControl = new GMapTypeControl();//地图类型切换
52 map.addControl(mapControl);//GLargeMapControl
53 map.addControl(new GScaleControl());//地图比例尺//GHierarchicalMapTypeControl
54 map.addControl(new GLargeMapControl());
55
56
57 /*3
58 var mapTypeControl = new GMapTypeControl();
59 var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
60 var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
61 map.addControl(mapTypeControl, topRight);
62 GEvent.addListener(map, "dblclick", function() {
63 map.removeControl(mapTypeControl);
64 map.addControl(new GMapTypeControl(), bottomRight);
65 });
66 map.addControl(new GSmallMapControl());
67*/
68 //map.addControl(new GMapTypeControl());
69 // map.addControl(new GScaleControl());
70 // map.addControl(new GOverviewMapControl());
71 //map.addControl(new GLargeMapControl());
72 //自定标志图
73 var icon = new GIcon();
74 icon.image = "http://www.lukfook.com.hk/image/logo.png";
75 //icon.shadow = "image/logo2.png";
76 icon.iconSize = new GSize(25, 28);
77 // icon.shadowSize = new GSize(22, 20);
78 icon.iconAnchor = new GPoint(6, 20);
79 icon.infoWindowAnchor = new GPoint(5, 1);
80 //消息框提示位置
81 var infoTabs11 = [
82 new GInfoWindowTab("分行地址", "<b>上水分行(SS1)</b><br>新界上水龍琛路39號上水廣場28 樓<br>ShopNo.235-237,Level2,39LungSumAvenue,<br>LandmarkNorth,SheungShui,N.T.<br>"),
83 new GInfoWindowTab("聯系方式", "聯系電話:2783 8822<br><br>"),
84 new GInfoWindowTab("介绍信息", "缔友计算机信息技术有限公司<br><br>")
85 ];
86 // 在注置于地的中央,并自已弹出气泡提示窗口
87
88 //放置要加的坐标
89 var point11 = new GLatLng(22.503575,114.129823);
90 var marker11 = new GMarker(point11,icon);
91
92 //加上标志方法
93 GEvent.addListener(marker11, "click", function() {
94
95 marker11.openInfoWindowTabsHtml(infoTabs11);
96 // window.setTimeout(function() { map.setCenter(new GLatLng(22.503575,114.129823));}, 1000);
97 });
98 map.addOverlay(marker11);
99//------------------------------
100
101 var opt = {text:"<img src='images/japan.jpg' width='20' height='13'>缔友计算机信息技术有限公司深圳办事处,捷为工作室<br>深圳市南山区科技园中区", draggable:true};
102 var marker1 = createMaker(new GLatLng(22.543532,113.950836), "缔友计算机信息技术有限公司", opt);
103 map.addOverlay(marker1);
104
105 var opt = {text:"<img src='images/usa.jpg' width='20' height='13'>缔友计算机信息技术有限公司<br>江西省吉安市永丰县永丰大道", draggable:true};
106 var marker2 = new PopupMarker(new GLatLng(27.327187,115.421848), opt);
107 map.addOverlay(marker2);
108 marker2.showPopup();
109 }
110 }
111
112 function createMaker(latlng, msg, opt){
113 var marker = new PopupMarker(latlng, opt);
114
115 GEvent.addListener(marker,"click", function(){
116 marker.openInfoWindowHtml(msg);
117 marker.hidePopup();
118 });
119 return marker;
120 }
121 </script>
122
123 </head>
124 <body onload="initialize()" onunload="GUnload()">
125 <div id="map_canvas" class="map_canvas"></div>
126 </body>
127</html>
128
http://gmapdotnet.codeplex.com/
http://www.codeproject.com/Articles/32643/GMap-NET-Great-Maps-for-Windows-Forms-and-Presenta
http://greatmaps.codeplex.com/
哲学管理(学)人生, 文学艺术生活, 自动(计算机学)物理(学)工作, 生物(学)化学逆境, 历史(学)测绘(学)时间, 经济(学)数学金钱(理财), 心理(学)医学情绪, 诗词美容情感, 美学建筑(学)家园, 解构建构(分析)整合学习, 智商情商(IQ、EQ)运筹(学)生存.---Geovin Du(涂聚文)