JS AreaLine Options
Demonstrates several features of the area line microChart.
<%@ Page Language="C#" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Drawing2D" %>
<%@ Import Namespace="dotnetCHARTING.Mapping" %>
<script runat="server">
void Page_Load(Object sender, EventArgs e)
{
// Demonstrates several features of the area line microChart.
Chart.JS.Enabled = true;
Chart.Size = "350x350";
Chart.TempDirectory = "temp";
Chart.Background.Color = Color.FromArgb(249,249,255);
Chart.JS.Buttons.EnableExportButton = false;
Chart.JS.Buttons.EnablePrintButton = false;
Chart.Margin = "10";
string s = "<span style='font-size:14px;font-weight:bold;'>AreaLine Types and Options</span><hr><ul>";
// A plain area line.
s += "<li><span style='width:220px'>Plain AreaLine:</span><Chart:AreaLine margin='6' values='2,4,1,3'></li>";
// Providing two colors specifies the color of the area line and end point colors.
s += "<li><span style='width:220px'>AreaLine with ends:</span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Red'></li>";
// Providing three colors specifies the color of the area line, end points, and high/low value colors.
s += "<li><span style='width:220px'>AreaLine with ends and min/max </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Red,Blue'></li>";
// By specifying a transparent color for end points they can be omitted.
s += "<li><span style='width:220px'>AreaLine with min/max </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Transparent,Blue'></li>";
// Specifying only the area line color.
s += "<li><span style='width:220px'>Colored AreaLine </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' color='Blue'></li>";
// A reference line can be used by specifying a value in the AxisMarker parameter.
s += "<li><span style='width:220px'>AreaLine with AxisMarker line </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' AxisMarker='10'></li>";
// A portion of the y axis can be marked by using two values in the AxisMarker parameter and it uses the fourth color in the Colors parameter.
s += "<li><span style='width:220px'>AreaLine with colored range AxisMarker </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' AxisMarker='10,20' colors='Gray,Transparent,Transparent,Blue'></li>";
s +="</ul></span>";
Chart.ObjectChart = new dotnetCHARTING.Label(s);
}
</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="dotnetCHARTING.Mapping" %>
<script runat="server">
Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
' Demonstrates several features of the area line microChart.
Chart.JS.Enabled = True
Chart.Size = "350x350"
Chart.TempDirectory = "temp"
Chart.Background.Color = Color.FromArgb(249,249,255)
Chart.JS.Buttons.EnableExportButton = False
Chart.JS.Buttons.EnablePrintButton = False
Chart.Margin = "10"
Dim s As String = "<span style='font-size:14px;font-weight:bold;'>AreaLine Types and Options</span><hr><ul>"
' A plain area line.
s &= "<li><span style='width:220px'>Plain AreaLine:</span><Chart:AreaLine margin='6' values='2,4,1,3'></li>"
' Providing two colors specifies the color of the area line and end point colors.
s &= "<li><span style='width:220px'>AreaLine with ends:</span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Red'></li>"
' Providing three colors specifies the color of the area line, end points, and high/low value colors.
s &= "<li><span style='width:220px'>AreaLine with ends and min/max </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Red,Blue'></li>"
' By specifying a transparent color for end points they can be omitted.
s &= "<li><span style='width:220px'>AreaLine with min/max </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' colors='Gray,Transparent,Blue'></li>"
' Specifying only the area line color.
s &= "<li><span style='width:220px'>Colored AreaLine </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' color='Blue'></li>"
' A reference line can be used by specifying a value in the AxisMarker parameter.
s &= "<li><span style='width:220px'>AreaLine with AxisMarker line </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' AxisMarker='10'></li>"
' A portion of the y axis can be marked by using two values in the AxisMarker parameter and it uses the fourth color in the Colors parameter.
s &= "<li><span style='width:220px'>AreaLine with colored range AxisMarker </span><Chart:AreaLine margin='6' values='5,6,8,23,2,15' AxisMarker='10,20' colors='Gray,Transparent,Transparent,Blue'></li>"
s &= "</ul></span>"
Chart.ObjectChart = New dotnetCHARTING.Label(s)
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>
Previous