本文实例讲述了jQuery插件高级图表绘制简单2D折线图效果。分享给大家供大家参考，具体如下：

1、实例代码：

！2D折线图/title脚本类型=' text/JavaScript ' src=' http : js/jquery-1。7 .2 .量滴js '/script脚本类型=' text/JavaScript ' src=' http : js/high charts。js '/script脚本类型=' text/JavaScript ' $(function(){ $(' # LineChart ')).高图表({ chart: { type: 'line' }，title: { text: '(jb51.net统计)2013年月收入},字幕： { text: '月收入}，xAxis: { categories: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月] }，yAxis: { min: 0，title: { text: '收入($)' }，工具提示： {标题格式： ' span style=' font-size :20 px ' { point。key }/span table '，point format : ' trtd style=' color : { series。颜色}；padd :0“{系列。name } :/TD ' ' TD style=' padd :0 ' { point。y :1f }元/td/tr '，footperformatatat : '/table '，shared: true，useHTML: true }，plot options 3360 { column : { point padd : 0 0.2，borderwidth : } }，series 3360[{ name : '张三，data: [4995，7169，1064，7292，2440，4545，6545，9564，1245，4512，6523，4514] }，{ name: '李思，data: [8361，2354，4512，2356，4515，6451，9865，5455，8254，6562，6945，2356] }，{ name: '王武，data: [4512，9565，6564，2652，3265，1202，7845，9845，2356，7844，5424，6312] }，{ name: '赵六，data: [6523，8956，6531，6532，9864，4552，9564，7845，6523，4512，8956，2356]})；});/script/head body div id=' LineChart ' style=' width : 1200 px；高度： 500像素；边距： 0自动/div/body/html 2，运行效果图如下：

附：完整实例代码点击此处本站下载。

更多关于jQuery相关内容感兴趣的读者可查看本站专题： 《jQuery常用插件及用法总结》 、 《jquery中Ajax用法总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jQuery扩展技巧总结》 、 《jQuery常见经典特效汇总》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。