Surface Chart (3)

[Web Version (in ASP)] aspdemo\surface3.asp

<%@ language="vbscript" %>
<%
Set cd = CreateObject("ChartDirector.API")

' The x and y coordinates of the grid
dataX = Array(-10, -9, -8, -7, -6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10)
dataY = Array(-10, -9, -8, -7, -6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10)

' The values at the grid points. In this example, we will compute the values using the formula z =
' Sin(x * x / 128 - y * y / 256 + 3) * Cos(x / 4 + 1 - Exp(y / 8))
ReDim dataZ((UBound(dataX) + 1) * (UBound(dataY) + 1) - 1)
For yIndex = 0 To UBound(dataY)
    y = dataY(yIndex)
    For xIndex = 0 To UBound(dataX)
        x = dataX(xIndex)
        dataZ(yIndex * (UBound(dataX) + 1) + xIndex) = Sin(x * x / 128.0 - y * y / 256.0 + 3) * _
            Cos(x / 4.0 + 1 - Exp(y / 8.0))
    Next
Next

' Create a SurfaceChart object of size 750 x 600 pixels
Set c = cd.SurfaceChart(750, 600)

' Add a title to the chart using 20 points Times New Roman Italic font
Call c.addTitle("Surface Energy Density       ", "Times New Roman Italic", 20)

' Set the center of the plot region at (380, 260), and set width x depth x height to 360 x 360 x 270
' pixels
Call c.setPlotRegion(380, 260, 360, 360, 270)

' Set the elevation and rotation angles to 30 and 210 degrees
Call c.setViewAngle(30, 210)

' Set the perspective level to 60
Call c.setPerspective(60)

' Set the data to use to plot the chart
Call c.setData(dataX, dataY, dataZ)

' Spline interpolate data to a 80 x 80 grid for a smooth surface
Call c.setInterpolation(80, 80)

' Use semi-transparent black (c0000000) for x and y major surface grid lines. Use dotted style for x
' and y minor surface grid lines.
majorGridColor = &Hc0000000
minorGridColor = c.dashLineColor(majorGridColor, cd.DotLine)
Call c.setSurfaceAxisGrid(majorGridColor, majorGridColor, minorGridColor, minorGridColor)

' Set contour lines to semi-transparent white (80ffffff)
Call c.setContourColor(&H80ffffff)

' Add a color axis (the legend) in which the left center is anchored at (665, 280). Set the length
' to 200 pixels and the labels on the right side.
Call c.setColorAxis(665, 280, cd.Left, 200, cd.Right)

' Set the x, y and z axis titles using 12 points Arial Bold font
Call c.xAxis().setTitle("X Title<*br*>Placeholder", "Arial Bold", 12)
Call c.yAxis().setTitle("Y Title<*br*>Placeholder", "Arial Bold", 12)
Call c.zAxis().setTitle("Z Title Placeholder", "Arial Bold", 12)

' Output the chart
Set viewer = cd.WebChartViewer(Request, "chart1")
Call viewer.setChart(c, cd.SVG)
%>

<!DOCTYPE html>
<html>
<head>
    <title>Surface Chart (3)</title>
    <!-- Include ChartDirector Javascript Library to support chart interactions -->
    <script type="text/javascript" src="cdjcv.js"></script>
</head>
<body style="margin:5px 0px 0px 5px">
    <div style="font:bold 18pt verdana;">
        Surface Chart (3)
    </div>
    <hr style="border:solid 1px #000080; background:#000080" />
    <div style="font:10pt verdana; margin-bottom:1.5em">
        <a href="viewsource.asp?file=<%= Request("SCRIPT_NAME") %>">View Chart Source Code</a>
    </div>
    <!-- ****** Here is the chart image ****** -->
    <%= viewer.renderHTML() %>
</body>
</html>

[Windows Version (in Visual Basic)] vbdemo\surface3.cls

Public Sub createChart(viewer As Object, chartIndex As Integer)

    Dim cd As New ChartDirector.API

    ' The x and y coordinates of the grid
    Dim dataX()
    dataX = Array(-10, -9, -8, -7, -6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10)
    Dim dataY()
    dataY = Array(-10, -9, -8, -7, -6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10)

    ' The values at the grid points. In this example, we will compute the values using the formula z
    ' = Sin(x * x / 128 - y * y / 256 + 3) * Cos(x / 4 + 1 - Exp(y / 8))
    ReDim dataZ((UBound(dataX) + 1) * (UBound(dataY) + 1) - 1)
    Dim yIndex As Long
    For yIndex = 0 To UBound(dataY)
        Dim y As Double
        y = dataY(yIndex)
        Dim xIndex As Long
        For xIndex = 0 To UBound(dataX)
            Dim x As Double
            x = dataX(xIndex)
            dataZ(yIndex * (UBound(dataX) + 1) + xIndex) = Sin(x * x / 128.0 - y * y / 256.0 + 3) _
                 * Cos(x / 4.0 + 1 - Exp(y / 8.0))
        Next
    Next

    ' Create a SurfaceChart object of size 750 x 600 pixels
    Dim c As SurfaceChart
    Set c = cd.SurfaceChart(750, 600)

    ' Add a title to the chart using 20 points Times New Roman Italic font
    Call c.addTitle("Surface Energy Density       ", "timesi.ttf", 20)

    ' Set the center of the plot region at (380, 260), and set width x depth x height to 360 x 360 x
    ' 270 pixels
    Call c.setPlotRegion(380, 260, 360, 360, 270)

    ' Set the elevation and rotation angles to 30 and 210 degrees
    Call c.setViewAngle(30, 210)

    ' Set the perspective level to 60
    Call c.setPerspective(60)

    ' Set the data to use to plot the chart
    Call c.setData(dataX, dataY, dataZ)

    ' Spline interpolate data to a 80 x 80 grid for a smooth surface
    Call c.setInterpolation(80, 80)

    ' Use semi-transparent black (c0000000) for x and y major surface grid lines. Use dotted style
    ' for x and y minor surface grid lines.
    Dim majorGridColor As Long
    majorGridColor = &Hc0000000
    Dim minorGridColor As Long
    minorGridColor = c.dashLineColor(majorGridColor, cd.DotLine)
    Call c.setSurfaceAxisGrid(majorGridColor, majorGridColor, minorGridColor, minorGridColor)

    ' Set contour lines to semi-transparent white (80ffffff)
    Call c.setContourColor(&H80ffffff)

    ' Add a color axis (the legend) in which the left center is anchored at (665, 280). Set the
    ' length to 200 pixels and the labels on the right side.
    Call c.setColorAxis(665, 280, cd.Left, 200, cd.Right)

    ' Set the x, y and z axis titles using 12 points Arial Bold font
    Call c.xAxis().setTitle("X Title<*br*>Placeholder", "arialbd.ttf", 12)
    Call c.yAxis().setTitle("Y Title<*br*>Placeholder", "arialbd.ttf", 12)
    Call c.zAxis().setTitle("Z Title Placeholder", "arialbd.ttf", 12)

    ' Output the chart
    Set viewer.Picture = c.makePicture()

End Sub