简单的统计图表ichartjs的使用 《转》

1、首先下载点击下载

2、只需要这一个js,粘贴赋值到自己项目中即可。

 

3、引入js

<script  type="text/javascript" src="../js/ichart.1.2.min.js"></script>
<script  type="text/javascript" src="../js/jquery.min.js"></script>
注:	(1)路径根据实际情况自行调整。
	(2)jquery没有的自行百度。

4、需要展示图表的地方加入
<div id="canvasDiv"></div>

5、加入最后的js代码
注:这段js复制即可  点击选择你需要的类型

$(function(){
        var data = [
            {name : ‘IE‘,value : 35.75,color:‘#a5c2d5‘},
            {name : ‘Chrome‘,value : 29.84,color:‘#cbab4f‘},
            {name : ‘Firefox‘,value : 24.88,color:‘#76a871‘},
            {name : ‘Safari‘,value : 6.77,color:‘#9f7961‘},
            {name : ‘Opera‘,value : 2.02,color:‘#a56f8f‘},
            {name : ‘Other‘,value : 0.73,color:‘#6f83a5‘}
        ];

        new iChart.Column2D({
            render : ‘canvasDiv‘,
            data: data,
            title : ‘Top 5 Browsers from 1 to 29 Feb 2012‘,
            showpercent:true,
            decimalsnum:2,
            width : 800,
            height : 400,
            coordinate:{
                background_color:‘#fefefe‘,
                scale:[{
                    position:‘left‘,
                    start_scale:0,
                    end_scale:40,
                    scale_space:8,
                    listeners:{
                        parseText:function(t,x,y){
                            return {text:t+"%"}
                        }
                    }
                }]
            }
        }).draw();
    });
一个简单的图表就完成啦!

原文网址:http://blog.csdn.net/sinat_29325027
时间: 2024-10-08 04:16:22

简单的统计图表ichartjs的使用 《转》的相关文章

软件测试管理的一点小心得

某甲问道:「测试做太多的话,会不会使得bug解不完?」 某乙回答:「还不简单.只要不做测试,就没有bug.」 上述对话,反应出许多软件工作人员对于测试的想法.对多数软件开发人员而言,测试大概是仅次于维护之外,最令人讨厌的工作.对软件研发主管来说,测试是必要之恶:做得不够后患无穷,做得过多又增加成本,延误商机.因此,如何能够规画与执行一个最经济有效的测试工作,当是软件研发主管们须研究的一个课题. 软件测试的困难,在于它不仅是产品的测试,更是产品设计程序的检验.由于关乎设计的测试,准则不易寻找,经验

介绍一个!非常简单非常方便!制作图表报表的js库 —— ichartjs 【详细操作】

ichartjs是一个国产的图表库,提供各种api,以及多种样式的图表 图表包括:面积图.2d条形图.2d柱状图.3d柱状图.折线图.饼状图等,并且可以组合图形. ichart是一个轻量级的js组件,快速构建图表并可跨平台使用 这是ichart的案例展示图,在这个页面我们通过点击view code 查看当前图表调用api的方法 ichart官网api的说明使用的参考文档 一个简单的例子熟悉一下ichart.js 1.通过官网我们去下载一个最新版本的ichart(文章最后有链接) 2.在解压的根目

【ichartjs】爬取理想论坛前30页帖子获得每个子贴的发帖时间,总计83767条数据进行统计,生成统计图表

统计数据如下: {'00': 967, '01': 373, '02': 177, '03': 79, '04': 65, '05': 163, '06': 514, '07': 1143, '08': 3550, '09': 9137, '10': 8534, '11': 6415, '12': 3275, '13': 6755, '14': 7911, '15': 6397, '16': 3567, '17': 2839, '18': 2689, '19': 2989, '20': 4034

ECharts.js学习(一) 简单入门

EChart.js 简单入门 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart   这个是Visual Studio里的自带控件,使用比较简单,不过数据这块需要在后台绑定. ichartjs 是一款基于HTML5的图形库.使用纯javascript语言, 利用HTML5的canvas标签绘制各式图形. 支持饼图.环形图.折线图.面积图.柱形图.条形图等. Chart.js 也是一款基于HTML5的图形库和ichartjs整体类似.不

[转载]Winform开发框架之统计图表的实现

在前面的一些随笔中,介绍了不少我的Winform框架的特性,上篇随笔<Winform开发框架之通用高级查询模块>对其中的通用高级模块进了一个整理说明,本篇继续介绍Winform开发框架重要的一个特性之统计图表的实现.统计图表在很多项目都可能用到,集成到框架中,更方便大家对一些图表项目的设计理解以及功能的重用.在一般的传统的框架中,可以采用ZedGraph开源控件或者微软自带的MSChart进行图表设计,DevExpress控件套件有自己的图表控件,本篇主要介绍基于DevExpress控件的图表

iOS 使用 Core Plot 绘制统计图表入门

本文转载至 http://blog.csdn.net/zhibudefeng/article/details/7677457 iOS(iPhone/iPad) 下图形组件有两个有名的,s7graphview 和 Core Plot,它们都是在 Google 上托管的代码,听说 Core Plot 比较强,因为前者仅支持曲线图,后者呢曲线图.饼图.柱状图等通吃,且较活跃.那就专注下 Core Plot 的使用.它提供了 Mac OS X 和 iOS 下的组件库,我只用到它的 iOS 图表库. Co

简单图表分析(2/2)

西蒙最近视力似乎有点疲劳过度,决定晚10:30睡觉,所以更博时间就改在早晨了.请各位包含,还有,今天上图怎么老是上不去~ ____ 算数平均分析(差异分析) 算数平均分析就是运用计算平均数的方法反映总体在一段时间.地点条件下.某一数量特征的一般水平.平均指标既可用于同一现象在不同地区.不同部门间的横向比较,也可以用于同一现象在不同时间的比较. 使用平均指标更能反映现象的持续能力或水平.比如网站的一个分站点,在某个时间段内的平均访问量. 算数平均数的计算方式为:总体各单位数值的总和/总体单位个数.

SAS简单绘图

利用sas gplot/gchart 模块,可以完成简单统计图的绘制. 1.条形图.环形图.饼图等等: proc gchart data=XXXXX; vbar varname; run; 这个过程包含若干选项,注意一点的是subgroup 和group选项的区别,subgroup不分开列,而group则对不同的组分开绘制: 2.散点图.线图等等 proc gplot data=xxxxx; plot y*x; run; 当同一张表上包含若干不同的线时,判断这若干条线是否共用同一坐标系.如果确实

android图表ichartjs

android之ichartjs图表 1.http://www.ichartjs.com    pdf下载:http://download.csdn.net/detail/menglele1314/8721121 2. 简介 what's the ichartjs? 2.1. ichartjs 是一款基于HTML5的图形库.使用纯javascript语言, 利用HTML5的canvas标签绘制各 式图形. ichartjs致力于为WEB应用提供简单.直观.可交互的体验级图表组件.是WEB图表展示