# cssCharts.js
jquery plugin to create simple donut, bar or line charts with dom nodes. style with css.
[http://thysultan.com/projects/cssCharts/](http://thysultan.com/projects/cssCharts/)
### Include:
```html
<link rel="stylesheet" href="chart.css">
<script src="jquery.chart.js"></script>
```
### run:
```javascript
$('.bar-chart').cssCharts({type:"bar"});
$('.donut-chart').cssCharts({type:"donut"});
$('.line-chart').cssCharts({type:"line"});
```
### example donut/pie chart
optional: to trigger countUp counter for the donut chart as seen on the preview page.
```javascript
$('.donut-chart').cssCharts({type:"donut"}).trigger('show-donut-chart');
```
add "pie-chart" class to .donut-chart if you want to convert it to a pie chart, i.e
```html
<div class="donut-chart pie-chart" data-percent="0.61" data-title="uptime %"></div>
```
- - -
### example line chart
```html
<ul data-cord="[x1,x2,x3,x4],[y1,y2,y3,y4]" class="line-chart"></ul>
$('.line-chart').cssCharts({type:"line"});
```
* insure x cordinates are 0 - ascending.
* insure y cordinates are 0 or greater.
- - -
### example bar chart
```html
<ul class="bar-chart" data-bars="[x1,x2],[y1,y2]" data-max="10" data-unit="k" data-grid="1" data-width="24">
$('.bar-chart').cssCharts({type:"bar"});
```
- - -
style to your hearts content, see index.html for an example implementation.
没有合适的资源?快使用搜索试试~ 我知道了~
二栏设计后台管理系统模板是一款扁平化风格设计,适合网站后台管理模板下载 .rar
共50个文件
js:18个
html:10个
css:9个
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 131 浏览量
2022-12-11
19:09:44
上传
评论
收藏 658KB RAR 举报
温馨提示
二栏设计后台管理系统模板是一款扁平化风格设计,适合网站后台管理模板下载。.rar
资源推荐
资源详情
资源评论
收起资源包目录
二栏设计后台管理系统模板是一款扁平化风格设计,适合网站后台管理模板下载。.rar (50个子文件)
readme.md 48B
二栏设计后台管理系统模板是一款扁平化风格设计,适合网站后台管理模板下载。
moban1264
empty.html 16KB
form.html 35KB
assets
css
checkbox3.min.css 7KB
custom-styles.css 13KB
select2.min.css 15KB
bootstrap.css 115KB
bootstrap-theme.min.css 19KB
font-awesome.css 21KB
img
bg-img.jpg 3KB
fonts
glyphicons-halflings-regular.woff 23KB
glyphicons-halflings-regular.ttf 40KB
glyphicons-halflings-regular.eot 20KB
glyphicons-halflings-regular.svg 61KB
glyphicons-halflings-regulard41d.eot 20KB
js
easypiechart-data.js 501B
chart.min.js 51KB
jquery.metisMenu.js 1KB
chartjs.js 8KB
bootstrap.min.js 35KB
custom-scripts.js 6KB
jquery-1.10.2.js 286KB
Lightweight-Chart
jquery.chart.js 14KB
index - Copy.html 4KB
index.html 4KB
jquery.chart.min.js 7KB
cssCharts.css 10KB
README.md 1KB
chart.js 12KB
select2.full.min.js 72KB
morris
raphael-2.1.0.min.js 89KB
morris.js 66KB
morris-0.4.3.min.css 443B
chart-data.js 3KB
dataTables
jquery.dataTables.js 414KB
dataTables.bootstrap.js 9KB
dataTables.bootstrap.css 5KB
easypiechart.js 9KB
custom.js 6KB
font-awesome
fonts
fontawesome-webfontba72.ttf 79KB
fontawesome-webfontd41d.eot 37KB
fontawesome-webfontba72.svg 197KB
fontawesome-webfontba72.eot 37KB
fontawesome-webfontba72.woff 43KB
index.html 30KB
table.html 57KB
chart.html 21KB
tab-panel.html 34KB
morris-chart.html 19KB
ui-elements.html 37KB
共 50 条
- 1
资源评论
reg183
- 粉丝: 1816
- 资源: 1万+
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功