Gallery
JS Stacked Bar Hover
<%@ Page Language="C#" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<script runat="server">
void Page_Load(Object sender, EventArgs e)
{
// This sample demonstrates horizontal full stacked bars with hover highlighting.
Chart.Type = ChartType.ComboHorizontal;
Chart.ChartArea.ClearColors();
Chart.LegendBox.Template = "%icon,%name";
Chart.LegendBox.Orientation = dotnetCHARTING.Orientation.Bottom;
Chart.Palette = new Color[] { ColorTranslator.FromHtml("#009392"), ColorTranslator.FromHtml("#39b185"), ColorTranslator.FromHtml("#9ccb86"), ColorTranslator.FromHtml("#e9e29c"), ColorTranslator.FromHtml("#eeb479"), ColorTranslator.FromHtml("#e88471"), ColorTranslator.FromHtml("#cf597e") };
// Set the directory where the related JSC files will be created and stored.
Chart.TempDirectory = "temp";
// Set he chart size.
Chart.Width = 850;
Chart.Height = 400;
Chart.Debug = false;
// Set the title.
Chart.TitleBox.Label.Text = "Employed persons by occupation and age in US";
Chart.TitleBox.Label.Font = new Font("Arial", 12, FontStyle.Regular);
Chart.Debug = false;
Chart.DefaultElement.ToolTip = "Ages %seriesName <br>{%yValue:n0} (%percentOfGroup%)";
// Enable JSCharting
Chart.JS.Enabled = true;
Chart.DefaultElement.HoverAction = HoverAction.HighlightSeries;
Chart.XAxis.Scale = Scale.FullStacked;
Chart.XAxis.DefaultTick.GridLine.Color = Color.LightGray;
DataEngine de = new DataEngine();
de.ChartObject = Chart; // Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/employed-persons-by-occupation.csv";
de.DataFields = "yAxis=persons,xAxis=occupation,splitBy=age";//cvs must have header
SeriesCollection sc = de.GetSeries();
Chart.SeriesCollection.Add(sc);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Gallery 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" %>
<script runat="server">
Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
' This sample demonstrates horizontal full stacked bars with hover highlighting.
Chart.Type = ChartType.ComboHorizontal
Chart.ChartArea.ClearColors()
Chart.LegendBox.Template = "%icon,%name"
Chart.LegendBox.Orientation = dotnetCHARTING.Orientation.Bottom
Chart.Palette = New Color() { ColorTranslator.FromHtml("#009392"), ColorTranslator.FromHtml("#39b185"), ColorTranslator.FromHtml("#9ccb86"), ColorTranslator.FromHtml("#e9e29c"), ColorTranslator.FromHtml("#eeb479"), ColorTranslator.FromHtml("#e88471"), ColorTranslator.FromHtml("#cf597e") }
' Set the directory where the related JSC files will be created and stored.
Chart.TempDirectory = "temp"
' Set he chart size.
Chart.Width = 850
Chart.Height = 400
Chart.Debug = False
' Set the title.
Chart.TitleBox.Label.Text = "Employed persons by occupation and age in US"
Chart.TitleBox.Label.Font = New Font("Arial", 12, FontStyle.Regular)
Chart.Debug = False
Chart.DefaultElement.ToolTip = "Ages %seriesName <br>{%yValue:n0} (%percentOfGroup%)"
' Enable JSCharting
Chart.JS.Enabled = True
Chart.DefaultElement.HoverAction = HoverAction.HighlightSeries
Chart.XAxis.Scale = Scale.FullStacked
Chart.XAxis.DefaultTick.GridLine.Color = Color.LightGray
Dim de As DataEngine = New DataEngine()
de.ChartObject = Chart ' Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/employed-persons-by-occupation.csv"
de.DataFields = "yAxis=persons,xAxis=occupation,splitBy=age" 'cvs must have header
Dim sc As SeriesCollection = de.GetSeries()
Chart.SeriesCollection.Add(sc)
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Gallery Sample</title></head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>
- Sample FilenameJsStackedBarHover.aspx
- Version10.1
- Uses DatabaseNo