ASP Line Graph Examples - different property settings for csDrawGraph

This page shows a number of line graphs created using the csDrawGraph component. The properties have been varied to show the sort of effects possible.

ASP line graph with default properties

Default properties, except the size is reduced to fit more examples on the page. Axis and legend position as well as axis length are changed to suit the size. A single line is defined using two points (0,0) and (30,30). The legend has been removed.

ASP line graph - grid lines visible

The same data is used as above. This time the legend is shown, the x and y axes are labelled, the grid is visible and the numbers on the x-axis are turned round. The width of the graph line is increased to 2 pixels.

XAxisText = "X Axis"
YAxisText = "Y axis"
LineWidth = 2
XValuesVertical = false
ShowGrid = true

ASP line graph - second line shown

This time a second line is added. The graduations on both axes have been specified as 5. The grid lines are solid and coloured light grey.

ShowGrid = true
GridColor = "aaaaaa"
GridStyle = 0
YGrad = 5
XGrad = 5

ASP line graph - background colour transparent

The background colour (white) is now transparent. The points are visible and are shown with a filled circle. The box around the legend is removed.

Transparent = true
ShowLegendBox = false
PointStyle = 1
PointSize = 4

ASP line graph - 3 lines and a different background colour

This has three lines plotted. The background colour is light grey. The background colour for the legend and the plot area colour are left as white to allow them to stand out.

ShowGrid = true
GridStyle = 0
PointStyle = 1
BGColor = "eeeeee"
AxisTextBGColor = "eeeeee"

ASP line graph - y values offset

This graph uses the YOffset property to limit the values displayed on the y-axis. The values on the x-axis have been substituted with text labels using the AddXValue method, and setting UseXAxisLabels to true.

YGrad = 10
YTop = 160
XGrad = 1
XTop = 3
YOffset = 100
UseXAxisLabels = true
AddXValue 0, "Jan"
AddXValue 1, "Feb"
AddXValue 2, "Mar"
AddXValue 3, "Apr"

ASP line graph - scatter graph

This graph shows the points without joining them. It has negative x-values and the x-axis has been extended accordingly.

MaxX = 170
MaxY = 120
XAxisNegative = 85
ShowLine = false
PointStyle = 1
PointSize = 4
YGrad = 5
XGrad = 10

The trial component has a sample script included which contains all the properties and their default values. This can be used as reference when experimenting with different property settings.

There are also examples available of Bar Charts, Stacked Bar Charts and Pie Charts.

Download csDrawGraph here.