㈠ google地圖(web版)是怎麼實現的
主要技術是javascript，和伺服器交互的javascript編程，即Ajax。其中核心技術是地圖 API，這里有一個google自己開發的集成 Google AJAX API技術，基於通過標准 HTTP 請求發送的網址參數來創建地圖，並將地圖作為可在網頁上顯示的圖像返回！
可以去google地圖的開發者網站看看 http://code.google.com/intl/zh-CN/apis/maps/documentation/index.html。
㈡ 求javaweb的調用百度地圖api的項目 能實現基本功能
<html>
<head>
<!--引用網路地圖-->
<script type="text/javascript" src="http://api.map..com/api?v=1.3">
</script>
<title>如何調用API</title>
<!-- 設計樣式container容器：佔50%大小-->
<style type="text/css">
#container{width:100%;height:100%;}
</style>
</head>
<body style="margin-top:0; margin-left:0">
<div id="container" style="margin-top:0; margin-left:0"></div>
<script type="text/javascript">
var map = new BMap.Map("container");//在container容器中創建一個地圖,參數container為div的id屬性;
map.addControl(new BMap.NavigationControl()); //初始化地圖控制項
map.addControl(new BMap.ScaleControl());
map.addControl(new BMap.OverviewMapControl());
var point = new BMap.Point(114.704605,38.282669);//定位,實際應用時，這個應該設置到參數中
map.centerAndZoom(point,20); //將point移到瀏覽器中心，並且地圖大小調整為20街道級;
//其他坐標點
var points=new Array();
points.push(new BMap.Point(114.705027, 38.284326));//實際應用時，從資料庫獲取
points.push(new BMap.Point(114.701187, 38.284475));
points.push(new BMap.Point(114.700315, 38.285264));
points.push(new BMap.Point(114.706064, 38.284457));
points.push(new BMap.Point(114.706136, 38.284173));
var deps=["特種車輛","特種車輛","特種車輛","特種車輛","特種車輛","特種車輛"];
var personName=["王鵬","李大力","胡皓東","陳謙","大山","匿名用戶"];
//alert(deps[0]+"/"+personName[0]);
for(var i=0;i<points.length;i++){
addMarker(i);
/*marker = new BMap.Marker(points[i]);
map.addOverlay(marker);
marker.addEventListener("click",function(){
//創建信息窗口
var opts = {
width : 30, // 信息窗口寬度
height: 30, // 信息窗口高度
title : deps[i] // 信息窗口標題
}
var infoWindow = new BMap.InfoWindow(personName[i], opts); // 創建信息窗口對象
map.openInfoWindow(infoWindow, map.getCenter()); // 打開信息窗口
});*/
}
function addMarker(j){
marker = new BMap.Marker(points[j]); // 創建標注
map.addOverlay(marker);
var opts = {
width : 10, // 信息窗口寬度
height: 10, // 信息窗口高度
title : deps[j] // 信息窗口標題
}
var infoWindow = new BMap.InfoWindow(personName[j], opts); // 創建信息窗口對象
marker.addEventListener("click", function(){ this.openInfoWindow(infoWindow); });
//marker.setLabel(new BMap.Label("我是網路，呵呵",{offset:new BMap.Size(10,-40)}));
}
//標注
/*var marker = new BMap.Marker(point);
map.addOverlay(marker);
marker.addEventListener("click",function(){ //點擊標注時出發事件
alert("您點擊了標注");
});
marker.enableDragging(); //標注可拖拽
//創建信息窗口
var opts = {
width : 30, // 信息窗口寬度
height: 30, // 信息窗口高度
title : "Hello" // 信息窗口標題
}
var infoWindow = new BMap.InfoWindow("World", opts); // 創建信息窗口對象
map.openInfoWindow(infoWindow, map.getCenter()); // 打開信息窗口
//折線
var polyline = new BMap.Polyline([
new BMap.Point(114.705027, 38.284326),
new BMap.Point(114.701187, 38.284475),
new BMap.Point(114.700315, 38.285264)
],
{strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5} //藍色、寬度為6
);
map.addOverlay(polyline); */
</script>
</body>
</html>
㈢ 請問：現在web開發主要用什麼地圖呢，另，百度地圖api需要收費嗎
不收費 api.map..com
㈣ WEB視界的那個衛星地圖是怎麼做的啊
WEB視界是以谷歌地球、衛星地圖、電子地圖為主的在線地圖工具類網站，從衛星上鳥瞰地球，多源衛星地圖，提供實時地圖信息，城市地標，旅行信息，為您提供有用的旅行信息。
最核心的東西就是開源地圖API，如果你有專門了解過，可以很輕松利用網路等提供的API搭建各種應用。
㈤ web程序怎麼初始化一個靜態的map，啟動載入一次
//下面使用MySql Connector/net提供的專用對象
MySqlConnection mycon = new MySqlConnection(constr);
mycon.Open();
MySqlCommandmycmd = new MySqlCommand("select * from users", mycon);
MySqlDataReader myreader = mycmd.ExecuteReader();
while (myreader.Read())
㈥ 怎麼用ArcGIS製作Web地圖
ArcGIS
Web地圖由底圖和一組相關圖層構成，用戶可與之交互以執行某一有意義的任務。這些地圖可供廣大用戶使用，並且包括多比例底圖、針對特定受眾的業務圖層以及可幫助用戶深入了解感興趣要素的信息彈出窗口。這些地圖還支持可視化、編輯、分析和時間功能。它們是
Web 地圖應用程序的基礎，並且可以通過包括移動設備、桌面應用程序和 Web 瀏覽器在內的多種客戶端進行查看。
如何創作 Web地圖
可通過以下三個基本步驟來創建 Web
地圖：選擇區域，確定要顯示的內容，然後保存並共享您的工作。可以從新地圖開始創建，或使用現有地圖創建。打開現有地圖時，可更改范圍、定位地點、查看圖例、查看有關要素的信息等。不管採用何種方法，都可以從底圖庫選擇底圖、添加數據圖層、配置彈出窗口、包含特定位置的書簽、包含地圖的描述，然後將其另存為自己的項目，並通過鏈接或者將其嵌入網站或應用程序中與他人共享。要創建引人注目的
Web 地圖，請考慮以下提示。
創建可用、易用且可操作的地圖
高質量的地圖可幫助您在 Web 上生動形象地展示地理信息。
作為地圖創作者，您的角色實質上就是開放這些信息的訪問權，並通過可用、易用且可操作的方式將您的地圖呈現出來，無論這些地圖是通過瀏覽器、移動設備還是桌面應用程序來顯示。
使用有意義的底圖和圖層
地圖應具有一定的意義，如講述一段故事、傳達一種思想或展示一個情景。為達到這個目的，您的底圖和圖層應具有以下特點：具有高質量的制圖效果的底圖和圖層、提供多種比例、可快速繪制、包含豐富准確的信息、針對特定群體;如果地圖的符號系統不夠直觀，還需要包含可查看的圖例。
您可能還會考慮包含專用於編輯時間、影像和要素的圖層。此外，通過添加一些不屬於現有圖層的要素，還可以幫助您的用戶深入了解您的地圖。例如，您可能需要在最近的火線中添加一些照片和文字說明。可以通過添加地圖注釋圖層或從文件導入要素來添加要素。
顯示重要信息
通常，提供詳細信息的最佳方式是在用戶與地圖交互時將其顯示出來，例如，通過在用戶發出相關請求時顯示彈出窗口和圖例。由於圖層可能包含大量要素數據，因此應仔細考慮要在彈出窗口中顯示哪些屬性以及這些信息的顯示方式。您不希望您的用戶被一些不相關或非必要的信息干擾;而是希望僅顯示與特定地圖相關的重要信息，並考慮在彈出窗口中包括格式化的文本、圖像、圖表等。您還可以考慮添加可編輯要素，以便用戶可以添加和移除要素及相關信息。
提供充足信息量的項目詳細信息
這些用於描述您的地圖的信息應該清楚明確。請花一些時間來提供信息性標題、摘要、描述和標簽，以便其他人可以了解地圖顯示的內容。最後，請確保對他人在地圖項目詳細信息頁面添加的任何評論做出響應。您甚至可以主動添加評論，以推廣地圖中的特定要素;例如，可以鼓勵用戶查看您剛剛添加的新的航空影像。
與您所在組織的所有人共享
Web 地圖可通過 Web
瀏覽器、移動設備和桌面客戶端進行訪問，從而使其成為用於與廣大用戶進行共享的強大工具。要獲得最大數量人群的關注，請確保將地圖共享給所有人，並確認需要查看您地圖的所有人都能夠訪問所有圖層。
㈦ web開發百度地圖JS api，地圖怎麼設置連續顯示
獲取代碼如下：（注意：通常我們在網頁中只要插入以下代碼，小蟲標注出來，其餘的可不用。）
1.在<head></head>間插入下面代碼：這是樣式和JS腳本。
<!--引用網路地圖API-->
<style type="text/css">
html,body{margin:0;padding:0;}
.iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
.iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
</style>
<script type="text/javascript" src="http://api.map..com/api?key=&v=1.1&services=true"></script>
2.在<body></body>間需要顯示地圖的位置放入以下代碼：（該代碼調用地圖）
<!--網路地圖容器-->
<div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>
3.以下代碼放在頁面最底端（其實可放在頁面任意位置。）
<script type="text/javascript">
//創建和初始化地圖函數：
function initMap(){
createMap();//創建地圖
setMapEvent();//設置地圖事件
addMapControl();//向地圖添加控制項
addMarker();//向地圖中添加marker
}
//創建地圖函數：
function createMap(){
var map = new BMap.Map("dituContent");//在網路地圖容器中創建一個地圖
var point = new BMap.Point(115.949652,28.693851);//定義一個中心點坐標
map.centerAndZoom(point,18);//設定地圖的中心點和坐標並將地圖顯示在地圖容器中
window.map = map;//將map變數存儲在全局
}
//地圖事件設置函數：
function setMapEvent(){
map.enableDragging();//啟用地圖拖拽事件，默認啟用(可不寫)
map.enableScrollWheelZoom();//啟用地圖滾輪放大縮小
map.enableDoubleClickZoom();//啟用滑鼠雙擊放大，默認啟用(可不寫)
map.enableKeyboard();//啟用鍵盤上下左右鍵移動地圖
}
//地圖控制項添加函數：
function addMapControl(){
//向地圖中添加縮放控制項
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
map.addControl(ctrl_nav);
//向地圖中添加縮略圖控制項
var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
map.addControl(ctrl_ove);
//向地圖中添加比例尺控制項
var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
map.addControl(ctrl_sca);
}
//標注點數組
var markerArr = [{title:"百恆網路",content:"電話：0791-88117053<br/>手機：15079002975",point:"115.950312|28.693447",isOpen:1,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
];
//創建marker
function addMarker(){
for(var i=0;i<markerArr.length;i++){
var json = markerArr[i];
var p0 = json.point.split("|")[0];
var p1 = json.point.split("|")[1];
var point = new BMap.Point(p0,p1);
var iconImg = createIcon(json.icon);
var marker = new BMap.Marker(point,{icon:iconImg});
var iw = createInfoWindow(i);
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
marker.setLabel(label);
map.addOverlay(marker);
label.setStyle({
borderColor:"#808080",
color:"#333",
cursor:"pointer"
});
(function(){
var index = i;
var _iw = createInfoWindow(i);
var _marker = marker;
_marker.addEventListener("click",function(){
this.openInfoWindow(_iw);
});
_iw.addEventListener("open",function(){
_marker.getLabel().hide();
})
_iw.addEventListener("close",function(){
_marker.getLabel().show();
})
label.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
})
if(!!json.isOpen){
label.hide();
_marker.openInfoWindow(_iw);
}
})()
}
}
//創建InfoWindow
function createInfoWindow(i){
var json = markerArr[i];
var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
return iw;
}
//創建一個Icon
function createIcon(json){
var icon = new BMap.Icon("http://map..com/image/us_cursor.gif", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
return icon;
}
initMap();//創建和初始化地圖
</script>
當然，如果你想偷懶，將以上對應代碼全放在<body></body>間也是沒問題的，呵呵。
㈧ web 網站中添加百度地圖導航功能，怎麼實現
Web2.0
則更注重用戶的交互作用，用戶既是網站內容的瀏覽者，也是網站內容的製造者。越來越多的用戶希望從你的網站上面獲取到有用的信息，比如：公司地址，電話，業務方面等等...相信網頁地圖這個小功能必然會為你的網站增色不少；
2
1.打開瀏覽器，輸入map..com，在右上角找到地圖API鏈接，點擊；
3
2.進入頁面後，拖動滑鼠到達頁面最下方，找到地圖生成器，點擊；
4
3.跳轉到生成代碼頁面，首先選擇你的城市，在圖中所示位置切換，這里以北京為例給大家做演示；
5
4.找到你的位置（或是公司的位置），這里以北京大學為例，單擊；
6
5.設置地圖，寬度和高度可以自定義，這里使用默認的，下面的一些個選項根據自己的需要去選就行；
7
6.添加標注（就是地圖上的小標志），圖標可以選擇，輸入名稱和備注，點擊保存；
8
7.將標注移動到地圖上對應的位置，然後單擊標注，即可顯示你保存的標注信息，效果如圖所示；
9
8.點擊復制代碼，原則上應該將代碼處理後然後插入到網頁適當的位置，（有點HTML基礎的朋友都知道應該怎麼做），這里給大家做演示，就隨便新建了一個HTML文件，然後將代碼放了進去；
PS：頂部的網頁字元格式要和自己的原網頁保持一致，如果是在原網頁中嵌入代碼，這個需要自己處理；
㈨ javaweb 開發有哪些地圖插件是到鄉鎮級別的
<!DOCTYPE><html><head><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title>網路地圖</title> <style type="text/css"> html{height:100%} body{height:100%;margin:0px;padding:0px} #container{height:100%} </style> <script src="http://api.map..com/api?v=1.4" type="text/javascript"></script></head><body> <input type="text" id="cityName" value="福州"/><input type="button" onclick="setCity()" value="查找" /><div id="container" style="width:1024px;height:600px;"></div> <script type="text/javascript"> var map = new BMap.Map("container"); //在container容器中創建一個地圖,參數container為div的id屬性; var point = new BMap.Point(120.2,30.25); //創建點坐標 map.centerAndZoom(point, 14); //初始化地圖，設置中心點坐標和地圖級別 map.enableScrollWheelZoom(); //激活滾輪調整大小功能 map.addControl(new BMap.NavigationControl()); //添加控制項：縮放地圖的控制項，默認在左上角； map.addControl(new BMap.MapTypeControl()); //添加控制項：地圖類型控制項，默認在右上方； map.addControl(new BMap.ScaleControl()); //添加控制項：地圖顯示比例的控制項，默認在左下方； map.addControl(new BMap.OverviewMapControl()); //添加控制項：地圖的縮略圖的控制項，默認在右下方； TrafficControl var search = new BMap.LocalSearch("中國", { onSearchComplete: function(result){ if (search.getStatus() == BMAP_STATUS_SUCCESS){ var res = result.getPoi(0); var point = res.point; map.centerAndZoom(point, 11); } },renderOptions: { //結果呈現設置， map: map, autoViewport: true, selectFirstResult: true } ,onInfoHtmlSet:function(poi,html){//標注氣泡內容創建後的回調函數，有了這個，可以簡單的改一下返回的html內容了。 // alert(html.innerHTML) }//這一段可以不要，只不過是為學習更深層次應用而加入的。 }); function setCity(){ search.search(document.getElementById("cityName").value); } search.search(document.getElementById("cityName").value); </script></body></html>第二種： 谷歌
首先引入 <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
代碼如下
js代碼
var myLatlng = new google.maps.LatLng(ret.attache.json.lat, ret.attache.json.lng);// 中國地圖全圖
var optMap =
{
zoom: 15,
center: myLatlng,
streetViewControl:false,
mapTypeControl: true,
mapTypeControlOptions: {
mapTypeIds: [/**google.maps.MapTypeId.SATELLITE ,google.maps.MapTypeId.HYBRID* */], // comment
position: google.maps.ControlPosition.TOP_LEFT
},
// navigationControl: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.DEFAULT,
position: google.maps.ControlPosition.LEFT
},
//ROADMAP SATELLITE
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('container'),optMap);
map.setOptions({Zoom:18,center:myLatlng});
html
<div id="locationDiv" >
<div id="container" style="position:relative; width:450px; height:300px;"></div>
</div>