绘制图表
1、Highcharts
Highcharts 是一个用纯 JavaScript 编写的一个图表库, 能够很简单便捷的在 Web 网站或是 Web 应用程序添加有交互性的图表,并且免费提供给个人学习、个人网站和非商业用途使用。
2、LightningChart
LightningChart拥有丰富的二维XY图表、三维XYZ图表、史密斯圆图、极坐标图、3D饼图、地理地图和G.I.S、信号工具,体数据渲染。
3、爱图说
三步生成在线图表
插入后就可以使用该控件了,teechart支持的图表类型很多,可以使用editor进行设置,参考下图
TeeChart主要有几个概念,一个是axis(轴),一个是series(序列),掌握了这两个基本的东西就可以进行设置和编程了。看这一段代码:
chart.object.axis.top.visible=false //设置图表上界不显示chart.object.axis.right.visible=false //设置图表右界不显示chart.object.frame.visible=false //不显示边框chart.object.header.text.clear() //由于teechart支持多行title,所以必须clearchart.object.axis.left.automatic=false //这个自动标注功能以上的代码基本设置完成,具体的设置可以通过editor详细了解到
如何来显示坐标轴:
chart.object.axis.left.startposition=70chart.object.axis.left.endposition=100chart.object.axis.left.maximum=val[1]chart.object.axis.left.minimum=0 chart.object.axis.left.title.caption=item[1]chart.object.axis.bottom.title.caption="勘探线"chart.object.series(0).clear()long hor,verhor=chart.object.axis.addcustom(TRUE)ver=chart.object.axis.addcustom(FALSE)chart.object.axis.Custom(ver).automatic=falsechart.object.axis.Custom(ver).minimum=0chart.object.axis.custom(ver).maximum=val[2]chart.object.axis.Custom(ver).startposition=35chart.object.axis.Custom(ver).EndPosition = 65chart.object.axis.Custom(ver).Title.Angle = 90chart.object.axis.Custom(ver).Title.Caption = item[2]chart.object.axis.Custom(hor).EndPosition = 100chart.object.axis.Custom(hor).PositionPercent =35 chart.object.Series(1).VerticalAxisCustom = verchart.object.Series(1).HorizontalAxisCustom = horchart.object.series(1).clear()
这段代码是设置两个坐标轴的代码,可以参考下图
有了坐标轴,就可以显示数据了,代码如下:
chart.object.series(0).add(round(cc/nums,2),ktx,255)c hart.object.series(1).add(round(dd/nums,2),ktx,255)
这是向里面加了两个序列的数据,代码本来在循环里面,要加多个数据到序列,多调用几次add