Skip to main content

LineDataSet

Namespace: Wisej.Web.Ext.ChartJS

Assembly: Wisej.Web.Ext.ChartJS (4.1.0.0)

Specialized data set for the Line chart.

public class LineDataSet : DataSet

Add creates a LineDataSet when ChartType is Line.

Example:

this.chartJS1.ChartType = ChartType.Line;
this.chartJS1.Labels = new[] { "Mon", "Tue", "Wed", "Thu", "Fri" };

var visits = (LineDataSet)this.chartJS1.DataSets.Add("Visits");
visits.Data = new object[] { 320, 410, 380, 450, 500 };
visits.BorderColor = Color.RoyalBlue;
visits.LineTension = 0;

Constructors​

Instance member LineDataSet()​

Constructs a new instance of LineDataSet.

The new data set is not filled, shows the line, doesn't span gaps, isn't stepped, uses Circle points with a radius and hover radius of 5 pixels, and has a LineTension of 0.4.

Example:

var forecast = new LineDataSet
{
	Label = "Forecast",
	BorderDash = new[] { 5, 5 },
	Data = new object[] { 100, 110, 125 }
};
this.chartJS1.DataSets.Add(forecast);

Properties​

Instance member BorderColor​

Color: Returns or sets the color of the line. (Default: Color [Empty])

Value: The Color of the line. The default is Empty, which uses the Chart.js default.

Hides BorderColor and maps to the Chart.js dataset "borderColor" property.

Example:

var profit = (LineDataSet)this.chartJS1.DataSets.Add("Profit");
profit.BorderColor = Color.SeaGreen;
profit.BorderWidth = 2;

Instance member BorderDash​

Int32[]: Returns or sets the length and spacing of dashes. See setLineDash. (Default: null)

Value: An array of numbers that alternately specify the lengths of the dashes and of the gaps in pixels, or null for a solid line. The default is null.

Example:

var budget = (LineDataSet)this.chartJS1.DataSets.Add("Budget");

// 10px dash followed by a 5px gap.
budget.BorderDash = new[] { 10, 5 };

Instance member Fill​

Boolean: Returns or sets whether to fill the area under the line. (Default: False)

Value: True to fill the area under the line using BackgroundColor; otherwise false. The default is false.

Example:

var usage = (LineDataSet)this.chartJS1.DataSets.Add("CPU Usage");
usage.Fill = true;
usage.BackgroundColor = Color.FromArgb(60, Color.OrangeRed);
usage.BorderColor = Color.OrangeRed;

Instance member LineTension​

Double: Returns or sets the Bezier curve tension of the line. Set to 0 to draw straight lines. This option is ignored if monotone cubic interpolation is used. (Default: 0.4)

Value: The tension of the curve. The default is 0.4.

Example:

var ds = (LineDataSet)this.chartJS1.DataSets.Add("Balance");

// straight segments between the points.
ds.LineTension = 0;

Instance member PointBackgroundColor​

Color[]: Returns or sets the fill colors of the points in the data set. One entry is the default color for all the points, otherwise each point can be defined as a different color.

Value: An array of Color values, or null to use the Chart.js default.

When the array contains a single color, it's sent to Chart.js as a single value applied to all the points.

Example:

var ds = (LineDataSet)this.chartJS1.DataSets.Add("Score");
ds.Data = new object[] { 72, 45, 88 };

// highlight the low score in red.
ds.PointBackgroundColor = new[] { Color.Green, Color.Red, Color.Green };

Instance member PointBorderColor​

Color[]: Returns or sets the border colors of the points in the data set. One entry is the default color for all the points, otherwise each point can be defined as a different color.

Value: An array of Color values, or null to use the Chart.js default.

When the array contains a single color, it's sent to Chart.js as a single value applied to all the points.

Example:

var ds = (LineDataSet)this.chartJS1.DataSets.Add("Orders");
ds.PointBackgroundColor = new[] { Color.White };
ds.PointBorderColor = new[] { Color.Navy };

Instance member PointHoverRadius​

Int32[]: Returns or sets the radius of the point when hovered. One entry is the default hover radius for all points, otherwise each point can define a hover radius. (Default: System.Int32[])

Value: An array of radius values in pixels. The default is a single entry with the value 5.

When the array contains a single entry, it's sent to Chart.js as a single value applied to all the points.

Example:

var ds = (LineDataSet)this.chartJS1.DataSets.Add("Latency");
ds.PointRadius = new[] { 3 };
ds.PointHoverRadius = new[] { 8 };

Instance member PointRadius​

Int32[]: Returns or sets the radius of the point shape. If set to 0, nothing is rendered. One entry is the default radius for all points, otherwise each point can define a radius. (Default: System.Int32[])

Value: An array of radius values in pixels. The default is a single entry with the value 5.

When the array contains a single entry, it's sent to Chart.js as a single value applied to all the points.

Example:

var line = (LineDataSet)this.chartJS1.DataSets.Add("Throughput");

// hide the points and show only the line.
line.PointRadius = new[] { 0 };

Instance member PointStyle​

PointStyle[]: Returns or sets the style of the points on the line. One entry is the default for all points, otherwise each point can define a style. (Default: Wisej.Web.Ext.ChartJS.PointStyle[])

Value: An array of PointStyle values. The default is a single Circle.

When the array contains a single entry, it's sent to Chart.js as a single value applied to all the points.

Example:

var ds = (LineDataSet)this.chartJS1.DataSets.Add("Milestones");
ds.Data = new object[] { 1, 3, 2 };

// a different style for each point.
ds.PointStyle = new[] { PointStyle.Circle, PointStyle.Star, PointStyle.Triangle };

Instance member ShowLine​

Boolean: Returns or sets whether the line between the points is drawn. (Default: True)

Value: False to draw only the points; otherwise true. The default is true.

Example:

// show only the points, like a scatter plot.
var samples = (LineDataSet)this.chartJS1.DataSets.Add("Samples");
samples.ShowLine = false;
samples.PointRadius = new[] { 4 };

Instance member SpanGaps​

Boolean: Returns or sets whether lines are drawn between points with no or null data. (Default: False)

Value: True to draw lines across points with no or null data; false to break the line at those points. The default is false.

Example:

var readings = (LineDataSet)this.chartJS1.DataSets.Add("Readings");
readings.Data = new object[] { 5, 7, null, 6, 8 };

// connect 7 and 6 across the missing value.
readings.SpanGaps = true;

Instance member SteppedLine​

SteppedLine: Returns or sets the style of the stepped line. (Default: False)

Value: One of the SteppedLine values. The default is False.

When set to a value other than False, the line is drawn as steps and LineTension is ignored.

Example:

var price = (LineDataSet)this.chartJS1.DataSets.Add("Price");
price.Data = new object[] { 9.99, 9.99, 12.49, 12.49, 11.99 };
price.SteppedLine = SteppedLine.After;