Source Code CodeCommunity StreetViewAndTrafficInfo.zip
Banner.ascx.cs
using System;
using System.IO;
public partial class Banner : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
using System;
public partial class Footer : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
Sample.aspx.cs
using System;
using System.Web.UI;
using ThinkGeo.MapSuite.Core;
using ThinkGeo.MapSuite.WebEdition;
public partial class Sample : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Map1.MapBackground.BackgroundBrush = new GeoSolidBrush(GeoColor.FromHtml("#E5E3DF"));
Map1.CurrentExtent = new RectangleShape(-10774639.9634, 3907531.7279639, -10769862.649132, 3903709.8765501);
Map1.MapUnit = GeographyUnit.Meter;
Map1.MapTools.MouseCoordinate.Enabled = true;
GoogleOverlay google = new GoogleOverlay("Google Map");
google.GoogleMapType = GoogleMapType.Normal;
google.GoogleStreetView = new GoogleStreetView(new PointShape(-96.767019, 33.079402), 700, 300);
google.TrafficEnabled = true;
Map1.CustomOverlays.Add(google);
}
}
}
InstructionsPanel.cs
using System;
using System.ComponentModel;
using System.IO;
using System.Web.UI.WebControls;
namespace DisplayASimpleMap
{
// This class represents the "instructions" floating panel.
[ToolboxItem(false)]
public class InstructionPanel : Panel
{
protected override void OnPreRender(System.EventArgs e)
{
StreamReader reader = File.OpenText(Page.MapPath("~/Resources/InstructionsPanel/InstructionsPanel.js"));
string script = reader.ReadToEnd();
reader.Close();
Page.ClientScript.RegisterClientScriptBlock(GetType(), "PanelScript", script, true);
base.OnPreRender(e);
}
protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
StreamReader reader = File.OpenText(Page.MapPath("~/Resources/InstructionsPanel/InstructionsPanel.htm"));
string[] script = reader.ReadToEnd().Split(new string[] { "<!--Split-->" }, StringSplitOptions.RemoveEmptyEntries);
reader.Close();
writer.WriteLine(script[0].Trim());
base.Render(writer);
writer.WriteLine(script[1].Trim());
}
}
}
Sample.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Sample.aspx.cs" Inherits="Sample" %>
<%@ Register Assembly="WebEdition" Namespace="ThinkGeo.MapSuite.WebEdition" TagPrefix="cc1" %>
<%@ Register Src="Footer.ascx" TagName="Footer" TagPrefix="uc1" %>
<%@ Register Src="Banner.ascx" TagName="Banner" TagPrefix="uc2" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link href="Resources/css.css" rel="stylesheet" type="text/css" />
<title>Google Street View and Real-time traffic Information</title>
<style type="text/css">
.btn
{
width: 120px;
}
</style>
</head>
<body onresize="resizeElementHeight()">
<form id="form1" runat="server">
<table border="0" cellpadding="0" cellspacing="0" style="width: 100%;">
<tr>
<td>
<uc2:Banner ID="Header1" runat="server" />
</td>
</tr>
<tr>
<td align="left">
<div id="TabContainer">
<a id="A1" runat="server" class="tab selected" href="#" onclick="this.className='tab selected';document.getElementById('A2').className='tab';document.getElementById('maptoggle').style.display='block';document.getElementById('sourcecode').style.display='none';">
Map View</a>
</div>
</td>
</tr>
<tr>
<td align="center">
<div id="MapContainer">
<div id="maptoggle">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<cc1:Map ID="Map1" runat="server" Height="100%" Width="100%">
</cc1:Map>
<Instruction:InstructionPanel ID="FunctionPanel" runat="server" Width="292px">
This sample demonstrates how to show real-time traffic information and Google Street
View on the map.
<br />
<br />
Click the buttons below to show/hide the street view.
<br />
<div>
<input type="button" class="btn" value="Hide Street View" onclick="Map1.HideStreetView();" />
<input type="button" class="btn" value="Show Street View" onclick="Map1.ShowStreetView();" />
</div>
<br />
Click the buttons below to show/hide the real-time traffic information.
<br />
<div>
<input type="button" class="btn" value="Hide Traffic Info" onclick="Map1.HideTraffic();" />
<input type="button" class="btn" value="Show Traffic Info" onclick="Map1.ShowTraffic();" />
</div>
<br />
Click the buttons below to switch the base layer type.<br />
<asp:Button CssClass="btn" ID="btnRoad" runat="server" Text="Normal" OnClientClick="Map1.SetCurrentBackgroundMapType(google.maps.MapTypeId.ROADMAP); return false;" />
<asp:Button CssClass="btn" ID="btnAerial" runat="server" Text="Hybrid" OnClientClick="Map1.SetCurrentBackgroundMapType(google.maps.MapTypeId.HYBRID); return false;" /><br />
<asp:Button CssClass="btn" ID="btnSatellite" runat="server" Text="Satellite" OnClientClick="Map1.SetCurrentBackgroundMapType(google.maps.MapTypeId.SATELLITE); return false;" />
<asp:Button CssClass="btn" ID="btnPhysical" runat="server" Text="Physical" OnClientClick="Map1.SetCurrentBackgroundMapType(google.maps.MapTypeId.TERRAIN); return false;" />
</Instruction:InstructionPanel>
</div>
<div id="sourcecode" style="display: none;">
<iframe height="100%" width="100%" id="sourcepage" runat="server" src="Sample.aspx.htm">
</iframe>
</div>
</div>
</td>
</tr>
<tr>
<td>
<uc1:Footer ID="Footer1" runat="server" />
</td>
</tr>
</table>
</form>
</body>
<script type="text/javascript">
function resizeElementHeight() {
var height = 0;
var body = window.document.body;
if (window.innerHeight) {
height = window.innerHeight;
} else if (body.parentElement.clientHeight) {
height = body.parentElement.clientHeight;
} else if (body && body.clientHeight) {
height = body.clientHeight;
}
document.getElementById('MapContainer').style.height = ((height - 170) + "px");
}
var alreadyrun = 0
if (document.addEventListener)
document.addEventListener("DOMContentLoaded", function () { alreadyrun = 1; resizeElementHeight() }, false)
else if (document.all && !window.opera) {
document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>')
var contentloadtag = document.getElementById("contentloadtag")
contentloadtag.onreadystatechange = function () {
if (this.readyState == "complete") {
alreadyrun = 1
resizeElementHeight()
}
}
}
window.onload = function () {
setTimeout("if (!alreadyrun) resizeElementHeight()", 0)
}
</script>
</html>