1 <%@ Page Language="C#" MasterPageFile="~/MasterPages/SamplePageWithCode.master" AutoEventWireup="true"
2 CodeFile="05_CustomerMap.aspx.cs" Inherits="_05_OtherSamples_05_CustomerMap"
3 Title="Customer Mapping" %>
4
5 <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="Server">
6
7 <script type="text/javascript">
8 function MapCustomers_Click() {
9 //alert('got here');
10 CustomerService.GetUSCustomers(document.getElementById("ctl00_MainContent_StateFilter").value, OnCustomerComplete);
11 }
12
13 function OnCustomerComplete(results) {
14 //alert('got results');
15 document.getElementById("customerMap").control.set_data(results);
16 //document.getElementById("customerMap").control.setBestMapView(results);
17 document.getElementById("customerMap").control.panTo(results[0].Latitude, results[0].Longitude);
18 }
19
20 </script>
21
22 <div>
23 Choose a state from the drop down and click the button to see the mapping of the
24 customers.<br />
25 <atlas:UpdatePanel ID="upanel" runat="server">
26 <ContentTemplate>
27 <asp:DropDownList ID="StateFilter" runat="server" DataSourceID="SqlDataSource1"
28 DataTextField="Region" DataValueField="Region">
29 </asp:DropDownList><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindDb %>"
30 SelectCommand="SELECT DISTINCT [Region] FROM [Customers] WHERE ([Country] = @Country)">
31 <SelectParameters>
32 <asp:Parameter DefaultValue="USA" Name="Country" Type="String" />
33 </SelectParameters>
34 </asp:SqlDataSource>
35 <asp:Button ID="MapButton" runat="server" OnClientClick="MapCustomers_Click()" Text="Map Customers" />
36 </ContentTemplate>
37 </atlas:UpdatePanel>
38 <atlas:UpdateProgress ID="prog" runat="server">
39 <ProgressTemplate>
40 Locating customers and geocoding their addresses.
41 <br />
42 Remember, we're using some free service, so this may take a bit...
43 <br />
44 <img src="/images/spinner.gif" />
45 </ProgressTemplate>
46 </atlas:UpdateProgress>
47 <div class="map">
48 <div id="customerMap">
49 </div>
50 <div style="position: relative; left: 0px; top: 0px;">
51 <div id="customerMap_mapTemplate">
52 <img id="customerMap_mapTemplate_ctl00" alt="Map Controller" src="/images/MapUI.png"
53 usemap="#customerMap_mapTemplate_controller__map" style="filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/WebResource.axd?d=-N70QYAjrPenCphBtdTHM5LM-qWLAaQERP-Xz3yBaI5e6U6JSg6bYfskApC84CM8ofK5hjCugtb5hI80vFRvgg2&t=632677741364531250);
54 border-style: none; height: 53px; width: 118px;" />
55 <map id="customerMap_mapTemplate_controller__map" name="customerMap_mapTemplate_controller__map">
56 <area id="customerMap_mapTemplate_controller__panLeft" alt="Pan Left" title="Pan Left"
57 nohref="nohref" shape="circle" coords="17,25,7" href="#" />
58 <area id="customerMap_mapTemplate_controller__panRight" alt="Pan Right" title="Pan Right"
59 nohref="nohref" shape="circle" coords="41,25,7" href="#" />
60 <area id="customerMap_mapTemplate_controller__panTop" alt="Pan Top" title="Pan Top"
61 nohref="nohref" shape="circle" coords="29,16,7" href="#" />
62 <area id="customerMap_mapTemplate_controller__panBottom" alt="Pan Bottom" title="Pan Bottom"
63 nohref="nohref" shape="circle" coords="29,35,7" href="#" />
64 <area id="customerMap_mapTemplate_controller__zoomIn" alt="Zoom In" title="Zoom In"
65 nohref="nohref" shape="circle" coords="70,18,7" href="#" />
66 <area id="customerMap_mapTemplate_controller__zoomOut" alt="Zoom Out" title="Zoom Out"
67 nohref="nohref" shape="circle" coords="56,18,7" href="#" />
68 <area id="customerMap_mapTemplate_controller__road" alt="Road" title="Road" nohref="nohref"
69 shape="rect" coords="86,8,102,24" href="#" />
70 <area id="customerMap_mapTemplate_controller__hybrid" alt="Hybrid" title="Hybrid"
71 nohref="nohref" shape="rect" coords="86,27,102,43" href="#" />
72 <area id="customerMap_mapTemplate_controller__reset" alt="Reset" title="Reset" nohref="nohref"
73 shape="rect" coords="49,28,62,43" href="#" />
74 </map>
75 </div>
76 </div>
77 </div>
78 <div style="display: none;">
79 <div id="customerMap_popupTemplate">
80 <div class="item" style="background-color: White; color: Black; padding: 10px; border: solid 1px black">
81 <span id="customerMap_popupTemplate_name" style="font-weight: bold"></span>
82 <br />
83 <span id="customerMap_popupTemplate_description"></span>
84 <br />
85 Customer ID: <span id="customerMap_popupTemplate_customerId"></span>
86 <br />
87 Contact: <span id="customerMap_popupTemplate_contactName"></span>
88 </div>
89 </div>
90 </div>
91 </div>
92
93 <script type="text/xml-script">
94 <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
95 <components>
96 <dataSource id="customerData" serviceURL="/CustomerService.asmx">
97 <bindings>
98 <binding property="selectParameters" propertyKey="stateFilter"
99 dataContext="ctl00_MainContent_StateFilter" dataPath="text" />
100 </bindings>
101 </dataSource>
102 <virtualEarthMap id="customerMap" targetElement="customerMap" latitude="33.51288" longitude="-112.06931" zoomLevel="10" mapStyle="Road" popupPositioningMode="BottomLeft" pushpinActivation="Hover" pushpinImageURL="/Images/pushpin.gif" pushpinImageWidth="0" pushpinImageHeight="0" popupCssClass="itemContainer" dataLatitudeField="Latitude" dataLongitudeField="Longitude">
103 <popupTemplate>
104 <template layoutElement="customerMap_popupTemplate">
105 <label cssClass="itemNameLabel" targetElement="customerMap_popupTemplate_name">
106 <bindings>
107 <binding dataPath="Company" property="text" />
108 </bindings>
109 </label>
110 <label targetElement="customerMap_popupTemplate_description">
111 <bindings>
112 <binding dataPath="Address" property="text" />
113 </bindings>
114 </label>
115 <label targetElement="customerMap_popupTemplate_customerId">
116 <bindings>
117 <binding dataPath="CustomerId" property="text" />
118 </bindings>
119 </label>
120 <label targetElement="customerMap_popupTemplate_contactName">
121 <bindings>
122 <binding dataPath="ContactName" property="text" />
123 </bindings>
124 </label>
125 </template>
126 </popupTemplate>
127 </virtualEarthMap>
128 <button targetElement="customerMap_mapTemplate_controller__panLeft">
129 <click>
130 <invokeMethod target="customerMap" method="continuousPanBy">
131 <parameters deltaX="-10" deltaY="0" count="20" />
132 </invokeMethod>
133 </click>
134 </button>
135 <button targetElement="customerMap_mapTemplate_controller__panRight">
136 <click>
137 <invokeMethod target="customerMap" method="continuousPanBy">
138 <parameters deltaX="10" deltaY="0" count="20" />
139 </invokeMethod>
140 </click>
141 </button>
142 <button targetElement="customerMap_mapTemplate_controller__panTop">
143 <click>
144 <invokeMethod target="customerMap" method="continuousPanBy">
145 <parameters deltaX="0" deltaY="-10" count="20" />
146 </invokeMethod>
147 </click>
148 </button>
149 <button targetElement="customerMap_mapTemplate_controller__panBottom">
150 <click>
151 <invokeMethod target="customerMap" method="continuousPanBy">
152 <parameters deltaX="0" deltaY="10" count="20" />
153 </invokeMethod>
154 </click>
155 </button>
156 <button targetElement="customerMap_mapTemplate_controller__zoomIn">
157 <click>
158 <invokeMethod target="customerMap" method="zoomIn" />
159 </click>
160 </button>
161 <button targetElement="customerMap_mapTemplate_controller__zoomOut">
162 <click>
163 <invokeMethod target="customerMap" method="zoomOut" />
164 </click>
165 </button>
166 <button targetElement="customerMap_mapTemplate_controller__road">
167 <click>
168 <setProperty target="customerMap" property="mapStyle" value="Road" />
169 </click>
170 </button>
171 <button targetElement="customerMap_mapTemplate_controller__hybrid">
172 <click>
173 <setProperty target="customerMap" property="mapStyle" value="Hybrid" />
174 </click>
175 </button>
176 <button targetElement="customerMap_mapTemplate_controller__reset">
177 <click>
178 <setProperty target="customerMap" property="mapStyle" value="Road" />
179 <setProperty target="customerMap" property="zoomLevel" value="16" />
180 </click>
181 </button>
182 </components>
183 </page>
184 </script>
185
186 </asp:Content>
187