|
makeup a chart in asp.net |
Posted by Mohammad Ali on Jul-01-2011 17:57 |
|
hello guys i am new in chartdirector. Pls some one help to makeup my chart like sample chart that i attach.
i write a code like that. I show a chat succussfully . but want to makeup my like sample chart. some one help me one.
=================================================================
Dim SQL As String
Dim i As Int16
Dim st As OleDb.OleDbDataAdapter
Dim stTable As New DataTable
' The data for the line chart
Dim stData() As Int16
' The labels for the line chart
Dim labels() As String
Call Connect()
SQL = "SELECT Price, LastUpdate FROM dbo.IndexPriceEOD WHERE LastUpdate = '" & Format(CDate("29-Jun-2011"), "dd-MMM-yyyy") & "' AND indexid ='DSEGEN' order by inc "
st = New OleDb.OleDbDataAdapter(SQL, cnn)
st.Fill(stTable)
st.Dispose()
If stTable.Rows.Count = 0 Then
Call DisConnect()
Exit Sub
End If
ReDim stData(stTable.Rows.Count - 1)
ReDim labels(stTable.Rows.Count - 1)
For i = 0 To stTable.Rows.Count - 1
stData(i) = stTable.Rows(i)("price")
labels(i) = Format(CDate(stTable.Rows(i)("LastUpdate")), "hh:mm")
Next
Call DisConnect()
Dim cd As Object
cd = CreateObject("ChartDirector.API")
' Create a XYChart object of size 250 x 250 pixels
Dim c As Object
c = cd.XYChart(500, 200)
' Set the plotarea at (30, 20) and of size 200 x 200 pixels
Call c.setPlotArea(30, 10, 400, 80)
' Add a line chart layer using the given data
Call c.addLineLayer(stData)
' Set the labels on the x axis.
Call c.xAxis().setLabels(labels)
' Display 1 out of 3 labels on the x-axis.
Call c.xAxis().setLabelStep(50)
' Output the chart
Response.ContentType = "image/GIF"
Response.BinaryWrite(c.makeChart2(cd.GIF))
Response.End()
===========================================================
|
Re: makeup a chart in asp.net |
Posted by Peter Kwan on Jul-02-2011 01:11 |
|
Hi Mohammad,
The chart you attach is an area chart with a gradient fill. See the sample code "Enhanced Area Chart" (you may look for "Enhanced Area Chart" from the ChartDirector documentation index) on how to make a similar chart in ChartDirector. For example:
Call c.addAreaLayer(stData, c.linearGradientColor(0, 10, 0, 90, &H60008800, &H60ffffff))
For the green text box on the right side showing the last data value, you can add it using Axis.addMark. For example:
Call c.setYAxisOnRight()
Set m = c.yAxis().addMark(stData(UBound(stData)), -1, UBound(stData)))
Call m.setMarkColor(cd.Transparent, &H000000)
Call m.setBackground(&H00cc00, &H000000)
For the text on the top of the chart, you may consider to add it using HTML (I assume your chart is included in some HTML web page), and put it on top of the chart.
If you want to add the top text in the chart, you may add it as a chart title using BaseChart.addTitle. The different text style in that line can be achieved using CDML (you may look for "CDML" from the ChartDirector documentation index). The downward or upward pointing triangle can be achieved using the triangle character in the Arial font.
Hope this can help.
Regards
Peter Kwan |
Re: makeup a chart in asp.net |
Posted by Mohammad Ali on Jul-03-2011 02:30 |
|
dear Peter Kwan
many thanks u |
Re: makeup a chart in asp.net |
Posted by dralialadin on Jul-20-2011 19:26 |
|
dear peter, Plz help me more,
I can't make GradientColor, Plz write code like chart that i attach new file. Just wirte to me two GradientColor code, how to write Full chart background color and how wirte line colour code.
|
Re: makeup a chart in asp.net |
Posted by Peter Kwan on Jul-21-2011 01:57 |
|
Hi dralialadin,
There is an example in ChartDirector that demonstrates an area chart with a gradient fill. See the sample code "Enhanced Area Chart". (You may look for "Enhanced Area Chart" from the ChartDirector documentation index.)
For example:
Set c = cd.XYChart(300, 200, &Hdddddd)
Call c.setPlotArea(30, 20, 260, 150, &Hdddddd, &Hdddddd, &Hdddddd, &Hdddddd, &Hdddddd)
Set layer = c.addAreaLayer(data, c.linearGradientColor(0, c.getPlotArea().getTopY(), 0, c.getPlotArea().getTopY() + c.getPlotArea().getHeight(), &Hcc6600, &Hff9944))
Call c.getPlotArea().moveGridBefore(layer)
Call c.xAxis().setLabels(labels)
....
Hope this can help.
Regards
Peter Kwan |
|