highcharts报表开发 一:chart配置
来源:互联网 发布:如何查看淘宝等级 编辑:程序博客网 时间:2024/04/26 21:27
$("#container").highcharts({ chart : { // 图表背景颜色配置 backgroundColor: '#FCFFC5', // 图表背景渐变颜色 backgroundColor: { linearGradient: [0, 0, 500, 500], stops: [ [0, 'rgb(255, 255, 255)'], [1, 'rgb(200, 200, 255)'] ] }, // chart边框圆角 borderRadius : numer, // 值类型 1,5,10.... borderWidth : number, // 值类型 1,5,10.... colorCount : 10, // number 默认10 一般取默认值即可 type : 'line', //string 图表类型 默认取 line height : number, // 图表高度 数字 ignoreHiddenSeries :bool, // false/true 隐藏数据列,缩放显示 inverted : false, // 反转坐标值 x轴跟y轴调换 margin : [null], // 默认null,表示图表区域和绘图区域的边距 // 设定鼠标平移按键 panning: true, panKey : 'shift', // 绘图区域样式调整 plotBackgroundColor : 'red', // #xxxxxx 绘图区域背景颜色 plotBackgroundColor: {// #xxxxxx 绘图区域背景渐变颜色 linearGradient: [0, 0, 500, 500], stops: [ [0, 'rgb(255, 255, 255)'], [1, 'rgb(200, 200, 255)'] ] } plotBackgroundImage : 'xxx.jpg' // url地址 绘图区域背景图片 plotBorderColor : 'red' // 绘图区域边框颜色 plotBorderWidth : number //1,5,10 绘图区域边框宽度 reflow : true // 默认true 让图表自适应图表容器 zoomType : 'x' //x/y 图表选中缩放方式 // 图表缩放按钮的位置 reset zoom resetZoomButton : { position : { align : 'right', // 默认 right verticalAlign : 'top' // 默认top }, relativeTo : 'plot' // 按钮的位置相对于绘图区还是整个图表,默认plot/chart }, // 图表3d形状 options3d : { enabled : true, // 开启3d效果 alpha : 30, // 默认0 内旋转 beta : 10, // 默认0 外旋转 depth : 100, // 默认100 深度 fitToPlot : true // 自适应图绘区 false不自适应 frame: {} // 背景颜色大小控制 } // chart 事件触发 events : { // 添加数据列触发 addSeries : function(e) { }, // 打印chart前触发 beforePrint : function() { }, // 打印chart之后触发 afterPrint : function() { }, // 点击数据列触发, 异步加载数据 下钻 drilldown : function(e) { }, // chart加载完毕触发 load : function () { }, // (在 load 事件之后执行)后及每次图表重绘后后触发 render : function () { }, // 鼠标选中图表事件 必须先设置zoomType的值(x, y) selection : function(e) { } } }}); // 动态修改坐标值 $('#update').click(function () { var chart = $('#container').highcharts(); chart.series[0].data[0].update(i % 2 ? 200 : 0); });
阅读全文
0 0
- highcharts报表开发 一:chart配置
- highcharts报表开发 一:chart配置
- highcharts报表插件之chart参数的使用
- jsp 快速开发报表 chart.js 饼图示例 系列教材(一)
- Highcharts详细翻译系列一:chart 图表选项篇
- highcharts报表 二:legend图例配置
- Chart 报表
- highcharts报表
- highcharts 组合chart
- highcharts报表 四:tooltip数据提示框指配置
- 那些曾一起开发或使用过的报表(Chart)
- highCharts报表开发总结及遇到的几个问题
- Jasper报表开发一
- Chart.js报表制作
- Chart.js报表制作
- Chart.js报表制作
- Highcharts报表之柱状图
- HighCharts制作报表
- 小程序--图片添加、删除
- lightoj 1033
- 通过类的应用,实现对学生的属性定义
- Hive通过JavaAPI操作
- Windows XP下如何取消打印机与任务计划的共享
- highcharts报表开发 一:chart配置
- VMware 虚拟化编程(2) — 虚拟磁盘文件类型详解
- 分享一个我写的io序列化类IOPack
- Hadoop学习3:Hadoop核心组件-MapReduce
- angularJS实现查询/选择排序/添加/敏感字符过滤
- 计数
- [Leetcode] 417. Pacific Atlantic Water Flow 解题报告
- 【树莓派学习笔记】树莓派入坑笔记 一 系统安装
- GlusterFs分布式复本卷 服务器替换实践