<%@ 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)
{
// Demonstrates how to create a diverging stacked bar chart with range category axis ticks.

// Set he chart size.
Chart.Width = 680;
Chart.Height = 600;

// Set the title.
Chart.TitleBox.Label.Text = "Do you approve or disapprove of the way Donald Trump is handling his job as President?";
Chart.Debug = false;
Chart.Type = ChartType.ComboHorizontal;
Chart.ChartArea.ClearColors();
Chart.LegendBox.Template = "%icon %name";
Chart.LegendBox.Orientation = dotnetCHARTING.Orientation.Bottom;
Chart.Palette = new Color[] { ColorTranslator.FromHtml("#67c0b8"), ColorTranslator.FromHtml("#26A69A"), ColorTranslator.FromHtml("#f38684"), ColorTranslator.FromHtml("#EF5350") };

// Set the directory where the related JSC files will be created and stored.
Chart.TempDirectory = "temp";

// Enable JSCharting
Chart.JS.Enabled = true;
Chart.DefaultElement.ToolTip = "%icon %seriesName: <b>{Math.abs(%yValue)}%</b>";
Chart.XAxis.Crosshair = new AxisTick();
Chart.XAxis.DefaultTick.Label.Text = "{Math.abs(%value)}%";
Chart.XAxis.ScaleRange.ValueLow = -100;
Chart.XAxis.ScaleRange.ValueHigh = 100;
Chart.XAxis.Scale = Scale.Stacked;
Chart.XAxis.DefaultTick.GridLine.Color = Color.LightGray;
Chart.YAxis.DefaultTick.GridLine.Color = Color.LightGray;

AxisTick at = new AxisTick();
at.Label.Text = "Gender";
at.Value = "['Male','Female']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.0.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.0.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "Age";
at.Value = "['18-29','65+']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.1.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.1.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "Race";
at.Value = "['White','Other']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.2.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.2.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "Party";
at.Value = "['Democrat','Republican']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.3.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.3.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "2016<br>Vote";
at.Value = "['Clinton','Trump']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.4.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.4.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "Family<br>Income";
at.Value = "['< $50K','$100K+']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.5.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.5.rangeMode", "curly");

at = new AxisTick();
at.Label.Text = "Census<br>Region";
at.Value = "['Northeast','West']";
at.Line.Color = Color.Gray;
Chart.YAxis.ExtraTicks.Add(at);
Chart.JS.Settings.Add("xAxis.customTicks.6.label.placement", "outside");
Chart.JS.Settings.Add("xAxis.customTicks.6.rangeMode", "curly");

DataEngine de = new DataEngine();
de.ChartObject = Chart; // Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/Trump-job-approval.csv";
de.DataFields = "yAxis=percent,name=category,splitBy=option,type";//cvs must have header
SeriesCollection sc = de.GetSeries();

for (int i = 0; i < sc.Count; i++)
{
if (sc[i].Name.IndexOf("disapprove") == -1)
continue;
int count = sc[i].GetActiveElements().Count;
for (int j = 0; j < sc[i].Elements.Count; j++)
{
sc[i].Elements[j].YValue = -(sc[i].Elements[j].YValue);
}
}
Chart.SeriesCollection.Add(sc[1]);
Chart.SeriesCollection.Add(sc[0]);
Chart.SeriesCollection.Add(sc[3]);
Chart.SeriesCollection.Add(sc[2]);
}
</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)
' Demonstrates how to create a diverging stacked bar chart with range category axis ticks.

' Set he chart size.
Chart.Width = 680
Chart.Height = 600

' Set the title.
Chart.TitleBox.Label.Text = "Do you approve or disapprove of the way Donald Trump is handling his job as President?"
Chart.Debug = False
Chart.Type = ChartType.ComboHorizontal
Chart.ChartArea.ClearColors()
Chart.LegendBox.Template = "%icon %name"
Chart.LegendBox.Orientation = dotnetCHARTING.Orientation.Bottom
Chart.Palette = New Color() { ColorTranslator.FromHtml("#67c0b8"), ColorTranslator.FromHtml("#26A69A"), ColorTranslator.FromHtml("#f38684"), ColorTranslator.FromHtml("#EF5350") }

' Set the directory where the related JSC files will be created and stored.
Chart.TempDirectory = "temp"

' Enable JSCharting
Chart.JS.Enabled = True
Chart.DefaultElement.ToolTip = "%icon %seriesName: <b>{Math.abs(%yValue)}%</b>"
Chart.XAxis.Crosshair = New AxisTick()
Chart.XAxis.DefaultTick.Label.Text = "{Math.abs(%value)}%"
Chart.XAxis.ScaleRange.ValueLow = -100
Chart.XAxis.ScaleRange.ValueHigh = 100
Chart.XAxis.Scale = Scale.Stacked
Chart.XAxis.DefaultTick.GridLine.Color = Color.LightGray
Chart.YAxis.DefaultTick.GridLine.Color = Color.LightGray

Dim at As AxisTick = New AxisTick()
at.Label.Text = "Gender"
at.Value = "['Male','Female']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.0.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.0.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "Age"
at.Value = "['18-29','65+']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.1.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.1.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "Race"
at.Value = "['White','Other']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.2.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.2.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "Party"
at.Value = "['Democrat','Republican']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.3.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.3.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "2016<br>Vote"
at.Value = "['Clinton','Trump']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.4.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.4.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "Family<br>Income"
at.Value = "['< $50K','$100K+']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.5.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.5.rangeMode", "curly")

at = New AxisTick()
at.Label.Text = "Census<br>Region"
at.Value = "['Northeast','West']"
at.Line.Color = Color.Gray
Chart.YAxis.ExtraTicks.Add(at)
Chart.JS.Settings.Add("xAxis.customTicks.6.label.placement", "outside")
Chart.JS.Settings.Add("xAxis.customTicks.6.rangeMode", "curly")

Dim de As DataEngine = New DataEngine()
de.ChartObject = Chart ' Necessary to view any errors the dataEngine may throw.
de.Data = "./../../data/resources/Trump-job-approval.csv"
de.DataFields = "yAxis=percent,name=category,splitBy=option,type" 'cvs must have header
Dim sc As SeriesCollection = de.GetSeries()

For i As Integer = 0 To sc.Count - 1
If sc(i).Name.IndexOf("disapprove") = -1 Then
Continue For
End If
Dim count As Integer = sc(i).GetActiveElements().Count
For j As Integer = 0 To sc(i).Elements.Count - 1
sc(i).Elements(j).YValue = -(sc(i).Elements(j).YValue)
Next j
Next i
Chart.SeriesCollection.Add(sc(1))
Chart.SeriesCollection.Add(sc(0))
Chart.SeriesCollection.Add(sc(3))
Chart.SeriesCollection.Add(sc(2))
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>