（三）如何用ChartDirector绘制三维surface chart

二维的surface chart十分常见，而作为非专业人士，你是否会被那些弯弯曲曲的等高线图形绕晕？今天就跟大家展示如何用Web图表控件ChartDirector 绘制三维surface chart

主要步骤：

• 首先用SurfaceChart.SurfaceChart创建一个SurfaceChart对象
• 用ThreeDChart.setPlotRegion指定绘图区域的位置和大小
• SurfaceChart.setData设置图表的数据
• 用SurfaceChart.setInterpolation插入新数据
• ThreeDChart.setColorAxis设置颜色轴的位置
• 用BaseChart.addTitle 和 Axis.setTitle分别为图表和轴添加标题
• 最后用BaseChart.makeChart生成图表就OK了！

ChartDirector绘制三维surface chart示例代码：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61

#include "chartdir.h" #include <math.h>   int main(int argc, char *argv[]) {     // The x and y coordinates of the grid     double dataX[] = {-10, -9, -8, -7, -6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6,         7, 8, 9, 10};     double dataY[] = {-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 = x * sin(y) + y * sin(x).     double dataZ[(int)(sizeof(dataX) / sizeof(dataX[0])) * (int)(sizeof(dataY) /         sizeof(dataY[0]))];     int yIndex;     for(yIndex = 0; yIndex < (int)(sizeof(dataY) / sizeof(dataY[0])); ++yIndex) {         double y = dataY[yIndex];         int xIndex;         for(xIndex = 0; xIndex < (int)(sizeof(dataX) / sizeof(dataX[0])); ++xIndex) {             double x = dataX[xIndex];             dataZ[yIndex * (int)(sizeof(dataX) / sizeof(dataX[0])) + xIndex] = x *                 sin(y) + y * sin(x);         }     }       // Create a SurfaceChart object of size 720 x 600 pixels     SurfaceChart *c = new SurfaceChart(720, 600);       // Add a title to the chart using 20 points Times New Roman Italic font     c->addTitle("Surface Energy Density   ", "timesi.ttf", 20);       // Set the center of the plot region at (350, 280), and set width x depth x     // height to 360 x 360 x 270 pixels     c->setPlotRegion(350, 280, 360, 360, 270);       // Set the data to use to plot the chart     c->setData(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0]))),         DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0]))), DoubleArray(         dataZ, (int)(sizeof(dataZ) / sizeof(dataZ[0]))));       // Spline interpolate data to a 80 x 80 grid for a smooth surface     c->setInterpolation(80, 80);       // Add a color axis (the legend) in which the left center is anchored at (645,     // 270). Set the length to 200 pixels and the labels on the right side.     c->setColorAxis(645, 270, Chart::Left, 200, Chart::Right);       // Set the x, y and z axis titles using 10 points Arial Bold font     c->xAxis()->setTitle("X (nm)", "arialbd.ttf", 10);     c->yAxis()->setTitle("Y (nm)", "arialbd.ttf", 10);     c->zAxis()->setTitle("Energy Density (J/m<*font,super*>2<*/font*>)",         "arialbd.ttf", 10);       // Output the chart     c->makeChart("surface.jpg");       //free up resources     delete c;     return 0; }

除此之外，你还可以用ChartDirector的surface chart图表样式绘制海面天气图、地面气压图等，应用范围非常广泛。