/// <summary>
/// Maps the specified location.
/// </summary>
/// <param name="location">The location.</param>
/// <param name="fences">The fences.</param>
/// <param name="groups">The groups.</param>
private void Map( MapItem location, List<MapItem> fences, List<MapItem> groups )
{
pnlMap.Visible = true;
string mapStylingFormat = @"
<style>
#map_wrapper {{
height: {0}px;
}}
#map_canvas {{
width: 100%;
height: 100%;
border-radius: 8px;
}}
</style>";
lMapStyling.Text = string.Format( mapStylingFormat, GetAttributeValue( "MapHeight" ) );
// add styling to map
string styleCode = "null";
var markerColors = new List<string>();
DefinedValueCache dvcMapStyle = DefinedValueCache.Read( GetAttributeValue( "MapStyle" ).AsInteger() );
if ( dvcMapStyle != null )
{
styleCode = dvcMapStyle.GetAttributeValue( "DynamicMapStyle" );
markerColors = dvcMapStyle.GetAttributeValue( "Colors" )
.Split( new char[] { '|' }, StringSplitOptions.RemoveEmptyEntries )
.ToList();
markerColors.ForEach( c => c = c.Replace( "#", string.Empty ) );
}
if ( !markerColors.Any() )
{
markerColors.Add( "FE7569" );
}
string locationColor = markerColors[0].Replace( "#", string.Empty );
var polygonColorList = GetAttributeValue( "PolygonColors" ).Split( new char[] { '|' }, StringSplitOptions.RemoveEmptyEntries ).ToList();
string polygonColors = "\"" + polygonColorList.AsDelimited( "\", \"" ) + "\"";
string groupColor = ( markerColors.Count > 1 ? markerColors[1] : markerColors[0] ).Replace( "#", string.Empty );
string latitude = "39.8282";
string longitude = "-98.5795";
string zoom = "4";
var orgLocation = GlobalAttributesCache.Read().OrganizationLocation;
if ( orgLocation != null && orgLocation.GeoPoint != null )
{
latitude = orgLocation.GeoPoint.Latitude.ToString();
longitude = orgLocation.GeoPoint.Longitude.ToString();
zoom = "12";
}
// write script to page
string mapScriptFormat = @"
var locationData = {0};
var fenceData = {1};
var groupData = {2};
var allMarkers = [];
var map;
var bounds = new google.maps.LatLngBounds();
var infoWindow = new google.maps.InfoWindow();
var mapStyle = {3};
var pinShadow = new google.maps.MarkerImage('//chart.googleapis.com/chart?chst=d_map_pin_shadow',
new google.maps.Size(40, 37),
new google.maps.Point(0, 0),
new google.maps.Point(12, 35));
var polygonColorIndex = 0;
var polygonColors = [{5}];
var min = .999999;
var max = 1.000001;
initializeMap();
function initializeMap() {{
// Set default map options
var mapOptions = {{
mapTypeId: 'roadmap'
,styles: mapStyle
,center: new google.maps.LatLng({7}, {8})
,zoom: {9}
}};
// Display a map on the page
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
map.setTilt(45);
if ( locationData != null )
{{
var items = addMapItem(0, locationData, '{4}');
for (var j = 0; j < items.length; j++) {{
items[j].setMap(map);
}}
}}
if ( fenceData != null ) {{
for (var i = 0; i < fenceData.length; i++) {{
var items = addMapItem(i, fenceData[i] );
for (var j = 0; j < items.length; j++) {{
items[j].setMap(map);
}}
}}
}}
if ( groupData != null ) {{
for (var i = 0; i < groupData.length; i++) {{
var items = addMapItem(i, groupData[i], '{6}');
for (var j = 0; j < items.length; j++) {{
items[j].setMap(map);
}}
}}
}}
// adjust any markers that may overlap
adjustOverlappedMarkers();
if (!bounds.isEmpty()) {{
map.fitBounds(bounds);
}}
}}
function addMapItem( i, mapItem, color ) {{
var items = [];
if (mapItem.Point) {{
var position = new google.maps.LatLng(mapItem.Point.Latitude, mapItem.Point.Longitude);
bounds.extend(position);
if (!color) {{
color = 'FE7569'
}}
var pinImage = new google.maps.MarkerImage('//chart.googleapis.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|' + color,
new google.maps.Size(21, 34),
new google.maps.Point(0,0),
new google.maps.Point(10, 34));
marker = new google.maps.Marker({{
position: position,
map: map,
title: htmlDecode(mapItem.Name),
icon: pinImage,
shadow: pinShadow
}});
items.push(marker);
allMarkers.push(marker);
if ( mapItem.InfoWindow != null ) {{
google.maps.event.addListener(marker, 'click', (function (marker, i) {{
return function () {{
infoWindow.setContent( $('<div/>').html(mapItem.InfoWindow).text() );
infoWindow.open(map, marker);
}}
}})(marker, i));
}}
if ( mapItem.EntityId && mapItem.EntityId > 0 ) {{
google.maps.event.addListener(marker, 'mouseover', (function (marker, i) {{
return function () {{
$(""tr[datakey='"" + mapItem.EntityId + ""']"").addClass('row-highlight');
}}
}})(marker, i));
google.maps.event.addListener(marker, 'mouseout', (function (marker, i) {{
return function () {{
$(""tr[datakey='"" + mapItem.EntityId + ""']"").removeClass('row-highlight');
}}
}})(marker, i));
}}
}}
if (typeof mapItem.PolygonPoints !== 'undefined' && mapItem.PolygonPoints.length > 0) {{
var polygon;
var polygonPoints = [];
$.each(mapItem.PolygonPoints, function(j, point) {{
var position = new google.maps.LatLng(point.Latitude, point.Longitude);
bounds.extend(position);
polygonPoints.push(position);
}});
var polygonColor = getNextPolygonColor();
polygon = new google.maps.Polygon({{
paths: polygonPoints,
map: map,
strokeColor: polygonColor,
fillColor: polygonColor
}});
items.push(polygon);
// Get Center
var polyBounds = new google.maps.LatLngBounds();
for ( j = 0; j < polygonPoints.length; j++) {{
polyBounds.extend(polygonPoints[j]);
}}
if ( mapItem.InfoWindow != null ) {{
google.maps.event.addListener(polygon, 'click', (function (polygon, i) {{
return function () {{
infoWindow.setContent( mapItem.InfoWindow );
infoWindow.setPosition(polyBounds.getCenter());
infoWindow.open(map);
}}
}})(polygon, i));
}}
}}
return items;
}}
function setAllMap(markers, map) {{
for (var i = 0; i < markers.length; i++) {{
markers[i].setMap(map);
}}
}}
function htmlDecode(input) {{
var e = document.createElement('div');
e.innerHTML = input;
return e.childNodes.length === 0 ? """" : e.childNodes[0].nodeValue;
}}
function getNextPolygonColor() {{
var color = 'FE7569';
if ( polygonColors.length > polygonColorIndex ) {{
color = polygonColors[polygonColorIndex];
polygonColorIndex++;
}} else {{
color = polygonColors[0];
polygonColorIndex = 1;
}}
return color;
}}
function adjustOverlappedMarkers() {{
if (allMarkers.length > 1) {{
for(i=0; i < allMarkers.length-1; i++) {{
var marker1 = allMarkers[i];
var pos1 = marker1.getPosition();
for(j=i+1; j < allMarkers.length; j++) {{
var marker2 = allMarkers[j];
var pos2 = marker2.getPosition();
if (pos1.equals(pos2)) {{
var newLat = pos1.lat() * (Math.random() * (max - min) + min);
var newLng = pos1.lng() * (Math.random() * (max - min) + min);
marker1.setPosition( new google.maps.LatLng(newLat,newLng) );
}}
}}
}}
}}
}}
";
var locationJson = location != null ?
string.Format( "JSON.parse('{0}')", location.ToJson().Replace( Environment.NewLine, "" ).EscapeQuotes().Replace( "\x0A", "" ) ) : "null";
var fencesJson = fences != null && fences.Any() ?
string.Format( "JSON.parse('{0}')", fences.ToJson().Replace( Environment.NewLine, "" ).EscapeQuotes().Replace( "\x0A", "" ) ) : "null";
var groupsJson = groups != null && groups.Any() ?
string.Format( "JSON.parse('{0}')", groups.ToJson().Replace( Environment.NewLine, "" ).EscapeQuotes().Replace( "\x0A", "" ) ) : "null";
string mapScript = string.Format( mapScriptFormat,
locationJson, // 0
fencesJson, // 1
groupsJson, // 2
styleCode, // 3
locationColor, // 4
polygonColors, // 5
groupColor, // 6
latitude, // 7
longitude, // 8
zoom ); // 9
ScriptManager.RegisterStartupScript( pnlMap, pnlMap.GetType(), "group-finder-map-script", mapScript, true );
}