Gallery

Gallery > Heatmap Charts

JS Barcode Chart

Demonstrates a linear heatmap showing temperature anomalies over time.

Download Show C# Code Show VB Code

<%@ Page Language="C#" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Drawing2D" %>
<%@ Import Namespace="System.Collections.Generic" %>

<script runat="server">

void Page_Load(Object sender, EventArgs e)
{
// Demonstrates a linear heatmap showing temperature anomalies over time.
Chart.Type = ChartType.Heatmap;
Chart.DefaultSeries.GaugeType = GaugeType.Horizontal;
Chart.Size = "800x150";
Chart.TempDirectory = "temp";
Chart.JS.Enabled = true;
Chart.Title = "Average global temperature anomalies (1900 - 2016)";
Chart.TitleBox.Position = TitleBoxPosition.Center;

Chart.YAxis.FormatString = "yyyy";
Chart.YAxis.Interval = 25;
Chart.YAxis.Scale = Scale.Time;
Chart.DefaultAxis.DefaultTick.Line.Visible = false;
Chart.XAxis.DefaultTick.Label.Text = "";

Chart.DefaultElement.ToolTip = "%yValue: <b>%zValue℃</b>";
Chart.LegendBox.Position = LegendBoxPosition.BottomMiddle;

DataEngine de = new DataEngine();
de.ChartObject = Chart; // Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/annualtempanomalies.csv";
de.DataFields = "yvalue=year,zValue=mean";//cvs must have header

SeriesCollection sc = de.GetSeries();
foreach (Element el in sc[0].Elements)
el.Name = "Global";

Chart.SeriesCollection.Add(sc);
Chart.Palette = new Color[] { ColorTranslator.FromHtml("#ffff8d"), ColorTranslator.FromHtml("#ffff00"), ColorTranslator.FromHtml("#ffa500"), ColorTranslator.FromHtml("#8b0000"), ColorTranslator.FromHtml("#000000") };
Chart.SmartPalette = Chart.SeriesCollection[0].GetSmartPalette(ElementValue.ZValue, Chart.Palette);

}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
</head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>

<%@ Page Language="vb" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Drawing2D" %>
<%@ Import Namespace="System.Collections.Generic" %>

<script runat="server">

Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
' Demonstrates a linear heatmap showing temperature anomalies over time.
Chart.Type = ChartType.Heatmap
Chart.DefaultSeries.GaugeType = GaugeType.Horizontal
Chart.Size = "800x150"
Chart.TempDirectory = "temp"
Chart.JS.Enabled = True
Chart.Title = "Average global temperature anomalies (1900 - 2016)"
Chart.TitleBox.Position = TitleBoxPosition.Center

Chart.YAxis.FormatString = "yyyy"
Chart.YAxis.Interval = 25
Chart.YAxis.Scale = Scale.Time
Chart.DefaultAxis.DefaultTick.Line.Visible = False
Chart.XAxis.DefaultTick.Label.Text = ""

Chart.DefaultElement.ToolTip = "%yValue: <b>%zValue?</b>"
Chart.LegendBox.Position = LegendBoxPosition.BottomMiddle

Dim de As DataEngine = New DataEngine()
de.ChartObject = Chart ' Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/annualtempanomalies.csv"
de.DataFields = "yvalue=year,zValue=mean" 'cvs must have header

Dim sc As SeriesCollection = de.GetSeries()
For Each el As Element In sc(0).Elements
el.Name = "Global"
Next el

Chart.SeriesCollection.Add(sc)
Chart.Palette = New Color() { ColorTranslator.FromHtml("#ffff8d"), ColorTranslator.FromHtml("#ffff00"), ColorTranslator.FromHtml("#ffa500"), ColorTranslator.FromHtml("#8b0000"), ColorTranslator.FromHtml("#000000") }
Chart.SmartPalette = Chart.SeriesCollection(0).GetSmartPalette(ElementValue.ZValue, Chart.Palette)

End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
</head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>

Sample FilenameJsBarcodeChart.aspx
Version10.0
Uses DatabaseNo

JS Charting

Gallery

JS Barcode Chart