ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  makeup a chart in asp.net
Posted by Mohammad Ali on Jul-01-2011 17:57
Attachments:
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()

===========================================================
qc.png

  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
Attachments:
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.
New File.jpg

  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