二维的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图表样式绘制海面天气图、地面气压图等，应用范围非常广泛。