gchart 插件API
data: 一个二维数组,参数类型如下:[[, , ], [, , ], [, , ]]
size: 图片显示的大小 ( width x height ) 300x200
type: 前面已经说过了 这里不再累述
xis_labels : 横轴文字
legend :图例
bar_width : 默认 条形宽度
bar_spacing : 默认1 条形间距
colors : ['4b9b41','81419b','41599b'] 图例显示颜色
bg : 'e0e0e0' 背景颜色
bg_trasparency : 背景透明度
bg_offset : '' 渐变终结色
bg_angle : '', 默认 渐变角度
bg_type : 'gradient' 默认 solid 渐变方式
bg_width : '' 默认 渐变步伐
chbg : 'FFFFFF', 图表区颜色
chbg_offset : '4b9b41' 图表区渐变终结色
chbg_angle : '' 默认90 渐变角度
chbg_type : 'gradient' 默认 solid 渐变方式
title : 'Bar Chart', 图表标题
title_color : 'a98147',
title_size : 默认10
grid : true, 默认 false 网格
grid_x : , 默认 X轴网格宽度
grid_y : , 默认格宽度
grid_line : , 默认
grid_blank : 默认度
fillarea : true 默认图表区
fillbottom : true 默认下端
filltop : true 默认充上端
lines: [[,,],[,,]] 点线图,[线宽,点宽,空白宽]
代码分析
从上面的代码可以看出,其实使用这个插件制作图表就类型的不同而已。需要修改的是 type 这个值
这里介绍type支持的类型:
折线图 lc
点线图 lxy
Sparkline 图 ls
叠加型水平条形图 bhs
叠加型垂直条形图 bvs
水平条形图 bhg
垂直条形图 bvg
饼图 p
三维饼图 p3
维恩图 v (目前没有看到效果,各位可以尝试)
散点图 s (目前没有看到效果,各位可以尝试)
雷达图 r (目前没有看到效果,各位可以尝试)
地图 t (目前没有看到效果,各位可以尝试)
仪表 gom
gchart 插件API的更多相关文章
- niceScroll 简单使用 及 插件API
官方网址[https://nicescroll.areaaperta.com/] 注:效果见官网右侧滚动条 jquery.nicescroll文件下载地址 引入核心文件,插件需要引入1.5.X以上版 ...
- VuePress教程之深入理解插件API
VuePress教程之深入理解插件API 本文目录 1 VuePress教程之深入理解插件API 2 插件 ??? 2.1 暖暖身 2.2 插件如何运作 3 准备 3.1 Markdown 3.2 P ...
- fullPage.js全屏滚动插件API
API sectionsColor:['green','orange','red','lime']; //设置背景颜色 可以为每一个section设置background-color属性 contro ...
- 学习笔记6——插件 API,“过滤器”(Filters)和“动作”(Actions)
WordPress 中有一种叫执行挂勾的机制,允许插件把一些功能“挂载”到 WordPress 当中.也就是说,在系统运行至某一个环节时,去调用插件内的一些函数.执行挂勾分为两种: 动作 (Actio ...
- better-scroll插件 api
Vue中的better-scroll插件 在需要的文件中添加 import BScorll from 'better-scroll'; 引用的示例代码: let scroll = new BScrol ...
- jtable插件api
官网2016-03-15 事例图: 一.客户端配置 1. paging boolean default:false 配置是否分页,果断改为true. 2. pageList string defaul ...
- angular-ui-bootstrap插件API - Tabs
Tabs 案例 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> ...
- angular-ui-bootstrap插件API - Pagination
Pagination: 案例 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <h ...
- angular-ui-bootstrap插件API - Pager
Pager: 案例 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head&g ...
随机推荐
- Elasticsearch教程之基础概念
基础概念 Elasticsearch有几个核心概念.从一开始理解这些概念会对整个学习过程有莫大的帮助. 1.接近实时(NRT) Elasticsearch是一个接近实时的搜索平台.这意味 ...
- Ring - HDU 2296(自动机+dp)
题目大意:斯蒂文想送给他女盆友一个戒指,并且他想在戒指上刻一些字,他非常了解他女盆友喜欢什么单词,比如"love""forvevr"....并且他还把女盆友喜欢 ...
- 区别assign VS weak,__block VS __weak
在objective-c中,类中的全局变量经常使用如下的方式申明. @property(nonatomic(1),strong(2))UIImageView *imageView; 其中的1,2处是对 ...
- 什么是:VGA SVGA XGA SXGA
经常可以看到VGA这些专业术语,通常这些重要技术指标指的是液晶屏(TFT LCD)的分辨率. TFT是英文Thin Film Transistor的缩写,中文意思是薄膜晶体管. VGA(Video G ...
- Android程序的入口点和全局变量设置--application
首先看看 application的官方文档 我之前一直以为Android程序的入口点就是带MAIN和LAUNCHER的Activity的onCreate方法,看来我是错了~ 原来真正的入口点是 Ap ...
- SVN安装图解
SVN服务器搭建和使用(一) Subversion是优秀的版本控制工具,其具体的的优点和详细介绍,这里就不再多说. 首先来下载和搭建SVN服务器. 现在Subversion已经迁移到apache网站上 ...
- ionic之应用首次启动引导页
用户首次启动app先进入引导页,localstroge记录状态,下次启动应用不再显示引导页. HTML: <html> <head> <meta charset=&quo ...
- [HDU 2049] 不容易系列之(4)——考新郎 (错排问题)
不容易系列之(4)——考新郎 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2049 题目大意: 有N对新婚夫妇,其中所有的新娘站成一列,都盖上了红布. ...
- SpringMVC之json数据传递
json是一种常见的传递格式,是一种键值对应的格式.并且数据大小会比较小,方便传递.所以在开发中经常会用到json. 首先看一下json的格式: {key1:value1,key2:value2} 每 ...
- UILable:显示多种颜色的方法
借用别人封装好的类库,用来显示同一个UILable上的多种颜色的字. 类库可以直接在次博客中下载,下载后别忘留言哦. 类库使用:主要用了CoreText里面的东西,所以在使用类库之前需要引用CoreT ...