Winform中WebBrowser控件处理Google地图
在winform中我们许多时候要用到地图,而现在一般都是用google地图。而我也是用了两种方法处理地图。一种是用插件,Gmap.Net,这种方法在处理的地图是一个最明显的缺点是按地址搜索位置是,不是很准,一些地方也不是好控制。所以最终选择用的是WebBrowser控件承载Google地图。这种方法能满足我们基本的要求。因为它是直接访问的是Google地图。所以要在联网状态下才能访问地图。地图中的许多功能是由Javascript控制机的,这样肯定也能提高操作地图的效率。
其中对Google地图操作的功能大致有一些这些:
- 对地图的放大,缩小。
- 根据用户输入的地址,让地图显示对应的地图坐标位置。
- 根据用户输入的地址经纬度,让地图显示对应的地图位置。
- 双击获得当前位置的经纬度。
- 根据上面用户对地图的操作,用水滴图形对地图位置进行标记。
- 用户可以选择四种不同的卫星图像来显示地图,使地图呈现不同的效果。
- 对地图截取图片。
1.对地图的放大。主要是调用JavaScript代码,Javascript代码设置地图的放大。
代码如下:
function ZoomInMaps() { var class1 = map.getZoom()//获得地图显示的大小。; if (class1 < 21) { class1 = 15;// 设置地图缩放大小的值。 map.setZoom(class1);//设置地图缩放的大小。 } }}
上面有注释,看注释就明白了。
后台代码也很简单,调用代码如下:
try { mshtml.IHTMLDocument2 currentDoc = (mshtml.IHTMLDocument2)webBrowser1.Document.DomDocument; mshtml.IHTMLWindow2 win = (mshtml.IHTMLWindow2)currentDoc.parentWindow; win.execScript("ZoomInMap()", "javascript"); } catch (Exception except) { MessageBox.Show(except.Message, "提示", MessageBoxButtons.OK, MessageBoxIcon.Warning); }
地图的缩小跟地图的放大也是差不多的,只不过是几个属性的值不同。代码我就不贴出来了。
2.根据用户输入的地址,让地图显示对应的地图坐标位置。
function codeAddress(address) { if (geocoder) { geocoder.geocode({ 'address': address }, function (results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); var markerPositon = results[0].geometry.location; if (marker) { marker.setPosition(markerPositon); } else { marker = new google.maps.Marker({ map: map, position: markerPositon, draggable: true }); } markersArray.push(marker); marker.setTitle(address); document.getElementById("mouselatitute").innerHTML = markerPositon.lat(); document.getElementById("mouselongitude").innerHTML = markerPositon.lng(); } else { //暂不处理。 } }); } }
后台代码:
public string StrAddress = "";//记录用户输入的地址。 private void 查询地址button_Click(object sender, EventArgs e) { try { if (addressTextBox.Text.Trim() != "") { mshtml.IHTMLDocument2 currentDoc = (mshtml.IHTMLDocument2)webBrowser1.Document.DomDocument; mshtml.IHTMLWindow2 win = (mshtml.IHTMLWindow2)currentDoc.parentWindow; win.execScript("codeAddress(\"" + addressTextBox.Text + "\")", "javascript");//调用JavaScript。//根据搜索地址字符串字节的多少,显示地图的大小。 if (!StrAddress.Equals(addressTextBox.Text) && addressTextBox.Text.Length > 6) { win.execScript("ZoomInMaps()", "javascript"); } else if (!StrAddress.Equals(addressTextBox.Text) && addressTextBox.Text.Length > 2) { win.execScript("ZoomInMap()", "javascript"); } else if (addressTextBox.Text.Length < 3) { win.execScript("ZoomCurrentMap()", "javascript"); } StrAddress = addressTextBox.Text;//获得经纬度。 string tag01 = webBrowser1.Document.GetElementById("mouselatitute").InnerText; string tag02 = webBrowser1.Document.GetElementById("mouselongitude").InnerText; double lat, lng; if (double.TryParse(tag01, out lat) && double.TryParse(tag02, out lng)) { currentXYStatusLabel.Text = "当前坐标:" + lat.ToString("F5") + "," + lng.ToString("F5"); MyLong = lng; MyLat = lat; } } } catch (Exception except) { MessageBox.Show(except.Message, "提示?", MessageBoxButtons.OK, MessageBoxIcon.Warning); } }
3.根据用户输入的地址经纬度,让地图显示对应的地图位置。
前台代码,加载地图主要也是调用Index.htm。因为Index.htm中有根据经纬度查询的,所以在前台只需要传递经纬度值过去即可。我试了很久才试出来的,通过get方式传值(?lon=" + douLon + "&lat=" + douLat;)。也可以传值成功,没有想到跟asp.net中传递值一样。
try { double douLon = double.Parse(txtLon.Text.Trim()); double douLat = double.Parse(txtLat.Text.Trim()); //加载地图 string address = "File:\\" + Application.StartupPath + "\\Index.htm?lon=" + douLon + "&lat=" + douLat; Uri url = new Uri(address, UriKind.Absolute); webBrowser1.Url = url; webBrowser1.ScriptErrorsSuppressed = false; currentXYStatusLabel.Text = "当前坐标:" + txtLat.Text + "," + txtLon.Text; } catch (Exception except) { MessageBox.Show(except.Message, "提示!", MessageBoxButtons.OK, MessageBoxIcon.Warning); }//获得用户传递的参数。 function getUrl(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return "Please input keywords here"; } //获得用户在前台传递的经纬度。var getLon = getUrl("lon"); var getLat = getUrl("lat"); geocoder = new google.maps.Geocoder(); var myLatlng = new google.maps.LatLng(getLat, getLon); var myOptions; if (getLat > 0) { myOptions = { zoom: 12, center: myLatlng, disableDoubleClickZoom: true, scaleControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } } else { myOptions = { zoom: 5, center: myLatlng, disableDoubleClickZoom: true, scaleControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
4.双击获得当前位置的经纬度。
其实双击也是由前台获得index.htm中的Javascript代码,在这儿只贴出Javascript代码,因为前台的调用跟上面的一样。其中主要是'dblclick'显示是鼠标的双击操作。这个参数也可以替换成click, mousedown, mouseup, dblclick等等Javascript的这些事件。
//地图双击事件。 google.maps.event.addListener(map, 'dblclick', function (event) { if (event.latLng) { document.getElementById("mouselatitute").innerHTML = event.latLng.lat(); document.getElementById("mouselongitude").innerHTML = event.latLng.lng(); var extent = map.getBounds(); document.getElementById("XMax").innerHTML = extent.getNorthEast().lng(); document.getElementById("YMax").innerHTML = extent.getNorthEast().lat(); document.getElementById("XMin").innerHTML = extent.getSouthWest().lng(); document.getElementById("YMin").innerHTML = extent.getSouthWest().lat(); document.getElementById("ZoomClass").innerHTML = map.getZoom();
6.用户可以选择四种不同的卫星图像来显示地图,使地图呈现不同的效果。
其原理跟上面的一样,也是调用Javascript完成。
try { mshtml.IHTMLDocument2 currentDoc = (mshtml.IHTMLDocument2)webBrowser1.Document.DomDocument; mshtml.IHTMLWindow2 win = (mshtml.IHTMLWindow2)currentDoc.parentWindow; switch (mapTypeComboBox.Text) { case "电子地图": win.execScript("SetRoadMap()", "javascript"); break; case "卫星地图": win.execScript("SetSatelliteMap()", "javascript"); break; case "混合地图": win.execScript("SetHybridMap()", "javascript"); break; case "地形地图": win.execScript("SetTerrainMap()", "javascript"); break; } } catch (Exception except) { MessageBox.Show(except.Message, "提示!", MessageBoxButtons.OK, MessageBoxIcon.Warning); }
7.对地图截取图片。
在截取地图前,要对四种卫星地图进行判断。判断之后就可以掉用方法下载了。如下代码:
if (saveBool) { int x = -1, y = -1; //将经纬度转换成切片序号 LatLongToPixelXYIndex(longtitude, latitude, level, out x, out y); if (x != -1 && y != -1) { WebClient wc = new WebClient(); address += "x=" + x.ToString() + "&y=" + y.ToString() + "&z=" + level.ToString(); wc.DownloadFile(address, savepath); MessageBox.Show("地图图片下载成功!"); } }
Download Code:
参考源码地址:http://download.csdn.net/download/xwebsite/3556206