JS Mapping World Proj
Demonstrates a world map with series for each continent.Chart.
<%@ Import Namespace="System.Drawing" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING"%>
<%@ Page Language="C#" Description="dotnetCHARTING Component" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
<script runat="server">
void Page_Load(Object sender,EventArgs e)
{
// Demonstrates a world map with series for each continent.
Chart.Type = ChartType.Map;
Chart.Width = 750;
Chart.Height = 400;
Chart.TempDirectory = "temp";
Chart.Debug = false;
Chart.LegendBox.Position = new Point(15,220);
Chart.JS.Enabled = true;
//Forces the default projection (Mercator) to be disabled.
Chart.JS.Mapping.Project = false;
// Setting the reference layer to world allows the chart to load a map with all
//world countries and search their continent attributes.
Chart.JS.Mapping.ReferenceLayers = "World";
Chart.DefaultSeries.DefaultElement.Outline.Width = 0;
// *DYNAMIC DATA NOTE*
// This sample uses random data to populate the chart. To populate
// a chart with database data see the following resources:
// - Classic samples folder
// - Help File > Data Tutorials
// - Sample: features/DataEngine.aspx
Chart.SeriesCollection.Add(getMapData());
}
SeriesCollection getMapData()
{
SeriesCollection SC = new SeriesCollection();
SC.Add(getRegionSeries("Continent:North America", Color.FromArgb(245, 106, 13)));
SC.Add(getRegionSeries("Continent:South America", Color.FromArgb(254, 210, 29)));
SC.Add(getRegionSeries("Continent:Europe", Color.FromArgb(126, 177, 27)));
SC.Add(getRegionSeries("Continent:Asia", Color.FromArgb(61, 55, 108)));
SC.Add(getRegionSeries("Continent:Africa", Color.FromArgb(50, 96, 182)));
SC.Add(getRegionSeries("Continent:Oceania", Color.FromArgb(52, 130, 114)));
return SC;
}
Series getRegionSeries(string region,Color color)
{
Series s = new Series();
s.JsMap = region;
s.DefaultElement.Color = color;
return s;
}
</script>
</head>
<body>
<div align="center">
<dotnet:Chart id="Chart" runat="server" Width="568px" Height="344px"></dotnet:Chart></div>
</body>
</html>
<%@ Import Namespace="System.Drawing" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING"%>
<%@ Page Language="vb" Description="dotnetCHARTING Component" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
<script runat="server">
Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
' Demonstrates a world map with series for each continent.
Chart.Type = ChartType.Map
Chart.Width = 750
Chart.Height = 400
Chart.TempDirectory = "temp"
Chart.Debug = False
Chart.LegendBox.Position = New Point(15,220)
Chart.JS.Enabled = True
'Forces the default projection (Mercator) to be disabled.
Chart.JS.Mapping.Project = False
' Setting the reference layer to world allows the chart to load a map with all
'world countries and search their continent attributes.
Chart.JS.Mapping.ReferenceLayers = "World"
Chart.DefaultSeries.DefaultElement.Outline.Width = 0
' *DYNAMIC DATA NOTE*
' This sample uses random data to populate the chart. To populate
' a chart with database data see the following resources:
' - Classic samples folder
' - Help File > Data Tutorials
' - Sample: features/DataEngine.aspx
Chart.SeriesCollection.Add(getMapData())
End Sub
Function getMapData() As SeriesCollection
Dim SC As SeriesCollection = New SeriesCollection()
SC.Add(getRegionSeries("Continent:North America", Color.FromArgb(245, 106, 13)))
SC.Add(getRegionSeries("Continent:South America", Color.FromArgb(254, 210, 29)))
SC.Add(getRegionSeries("Continent:Europe", Color.FromArgb(126, 177, 27)))
SC.Add(getRegionSeries("Continent:Asia", Color.FromArgb(61, 55, 108)))
SC.Add(getRegionSeries("Continent:Africa", Color.FromArgb(50, 96, 182)))
SC.Add(getRegionSeries("Continent:Oceania", Color.FromArgb(52, 130, 114)))
Return SC
End Function
Function getRegionSeries(ByVal region As String, ByVal color As Color) As Series
Dim s As Series = New Series()
s.JsMap = region
s.DefaultElement.Color = color
Return s
End Function
</script>
</head>
<body>
<div align="center">
<dotnet:Chart id="Chart" runat="server" Width="568px" Height="344px"></dotnet:Chart></div>
</body>
</html>
Previous