65.9K
CodeProject 正在变化。 阅读更多。
Home

Google 地图 Web 部件

starIconstarIconstarIcon
emptyStarIcon
starIcon
emptyStarIcon

3.13/5 (4投票s)

2008年4月23日

CPOL
viewsIcon

57914

downloadIcon

1136

一个 Google 地图 WebPart。

引言

本文介绍了一个 Google 地图 WebPart。

使用代码

Google 地图控件的渲染在 WebPart 的 Render 事件中进行。Google 地图控件使用 ClientScriptManager 对象进行初始化。

protected override void Render(HtmlTextWriter writer)
{
    string rScript = "";
    rScript += &quot;<script src=\&quot;http://maps.google.com/maps?file=api&v=2&key=&quot; + 
               m_rGoogleKey + &quot;\&quot;\n type=\&quot;text/javascript\&quot;></script>\n&quot;;
    rScript += &quot;<script type=\&quot;text/javascript\&quot;>\n&quot;;
    rScript += &quot;//<![CDATA[\n&quot;;
    rScript += &quot;function Init()\n&quot;;
    rScript += &quot;{\n&quot;;
    rScript += &quot;var map = new GMap2(document.getElementById(\&quot;map\&quot;));\n&quot;;
    if (DisableDragging)
        rScript += &quot;map.disableDragging();\n&quot;;
    rScript += &quot;var latlng = new GLatLng(&quot; + m_dLatitude + &quot;, &quot; + m_dLongitude + &quot;);\n&quot;;
    rScript += &quot;map.setCenter(latlng, &quot; + m_nZoomLevel + &quot;);\n&quot;;
    if (DisplayZoomControl)
        rScript += &quot;map.addControl(new GLargeMapControl());\n&quot;;
    rScript += &quot;map.addControl(new GMapTypeControl());\n&quot;;
    rScript += &quot;var mkr = new GMarker(latlng);\n&quot;;
    if (DisplayIcon)
        rScript += &quot;map.addOverlay(mkr);\n&quot;;
    rScript += &quot;}\n&quot;;
    rScript += &quot;//]]>\n&quot;;
    rScript += &quot;</script>\n&quot;;
    rScript += &quot; <div id=\&quot;map\&quot; style=\&quot;width: &quot; + GWidth + &quot;px; height: &quot; + 
               GHeight + &quot;px\&quot;></div>\n&quot;;
    writer.Write(rScript);
    if (!Page.ClientScript.IsStartupScriptRegistered(&quot;MapInit&quot;))
        Page.ClientScript.RegisterStartupScript(typeof(string), &quot;MapInit&quot;,
                  &quot;Init()&quot;, true);
}

为了能够修改 Google 地图的属性,我创建了一个 EditorPart 类,允许用户更改 Google API 密钥或 WebPart 的尺寸。

public class GoogleMapEditor : System.Web.UI.WebControls.WebParts.EditorPart
{
    TextBox googleKey = new TextBox();
    TextBox tbWidth = new TextBox();
    TextBox tbHeight = new TextBox();
    TextBox tbLat = new TextBox();
    TextBox tbLong = new TextBox();
    TextBox tbZoom = new TextBox();
    CheckBox chkDisplayZoom = new CheckBox();
    CheckBox chkDragging = new CheckBox();
    CheckBox chkIcon = new CheckBox(); 

就像标准的 WebPart 一样,编辑器部件必须重写 CreateChildControls 方法来构建用户界面。用户界面通过重写 RenderContents 方法来绘制。

protected override void RenderContents(HtmlTextWriter writer)
{
    writer.Write(&quot;Google Key <br/>&quot;);
    googleKey.RenderControl(writer);
    
    writer.Write(&quot;<br/>Width<br/>&quot;);
    tbWidth.RenderControl(writer);
    
    writer.Write(&quot;<br/>Height<br/>&quot;);
    tbHeight.RenderControl(writer);

2.jpg

图 1. 自定义编辑器

结果

1.jpg

图 2. Google 地图 WebPart
© . All rights reserved.