Comment on page
Range Bar Chart [Deprecated]
Range bar chart is used to display the difference between high and low values over a period or time or comparing data among categories.
Simply locate Bunifu Dataviz control in your toolbox and drag it to the location on your form where you would like to display it.
We will use button click event handler to display our chart called render_rangebar.
C# code
C#
VB.NET
private void render_rangebar_stick()
{
var canvas = new Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced.Canvas();
var datapoint = new Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced.DataPoint(Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced._type.Bunifu_rangeBar);
datapoint.addxy("new Date (2002,11,10)", new JArray(16.23, 17.99).ToString());
datapoint.addxy("new Date (2002, 11, 9)", new JArray(15.95, 19.25).ToString());
datapoint.addxy("new Date (2002, 11, 8)", new JArray( 11.30, 16.88).ToString());
datapoint.addxy("new Date (2002, 11, 7)", new JArray( 13.29, 14.28).ToString());
datapoint.addxy("new Date (2002, 11, 6)", new JArray( 15.23, 16.45).ToString());
datapoint.addxy("new Date (2002, 11, 5)", new JArray( 13.70, 16.50).ToString());
datapoint.addxy("new Date (2002, 11, 4)", new JArray( 17.50, 19.00).ToString());
datapoint.addxy("new Date (2002, 11, 3)", new JArray( 19.50, 20.85).ToString());
datapoint.addxy("new Date (2002, 11, 2)", new JArray( 20.07, 21.44).ToString());
datapoint.addxy("new Date (2002, 11, 1)", new JArray( 25.00, 26.70).ToString());
// Add data set to canvas
canvas.addData(datapoint);
//render canvas
bunifuDataViz1.Render(canvas);
}
Private Sub render_rangebar()
Dim canvas as New Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced.Canvas;
Dim datapoint as Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced.DataPoint = New Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced.DataPoint (Bunifu.Dataviz.WinForms.BunifuDatavizAdvanced._type.Bunifu_rangeBar);
datapoint.addxy("new Date (2002,11,10)", new JArray(16.23, 17.99).ToString());
datapoint.addxy("new Date (2002, 11, 9)", new JArray(15.95, 19.25).ToString());
datapoint.addxy("new Date (2002, 11, 8)", new JArray(11.30, 16.88).ToString());
datapoint.addxy("new Date (2002, 11, 7)", new JArray(13.29, 14.28).ToString());
datapoint.addxy("new Date (2002, 11, 6)", new JArray( 15.23, 16.45).ToString());
datapoint.addxy("new Date (2002, 11, 5)", new JArray(13.70, 16.50).ToString());
datapoint.addxy("new Date (2002, 11, 4)", new JArray(17.50, 19.00).ToString());
datapoint.addxy("new Date (2002, 11, 3)", new JArray(19.50, 20.85).ToString());
datapoint.addxy("new Date (2002, 11, 2)", new JArray(20.07, 21.44).ToString());
datapoint.addxy("new Date (2002, 11, 1)", new JArray(25.00, 26.70).ToString());
// Add data set to canvas
canvas.addData(datapoint);
//Render the canvas in the Data Viz
bunifuDataViz1.Render(canvas);
End Sub
In order to display range bar chart we need the following controls:
- Bunifu Data Viz - This is the container for our chart
- Bunifu Canvas - This is the middle layer between the data viz (container) and the dataset
- Bunifu Data Point - This will contain the data that we want to represent as pairs of X and Y coordinates
How Bunifu Range Bar Chart works is pretty simple: we populate the Bunifu Datapoint control with “points”, described by the Y coordinate (the first parameter of the addxy method) and an array of 2 coordinates, specifying the limits of the line that we want to represent.
On running the code you should see something like this:
That's it!
We hope Bunifu Dataviz will help you bring out the best data visualization for your data in your application.
Should you have feedback or suggestions please send us via chat on the bottom right corner of the screen.
Last modified 3yr ago