今天想到要研究下“用图表的形式来呈现数据”这个主题。对比了下两种实现的方法:

方法一：通过php代码在服务器端生成图像，再将图像传回客户端。使用jpGraph类库。

方法二：通过js和html5技术，在html中的canvas标记中作图。使用chartjs插件。http://www.chartjs.org

还是感觉第两种方法比较好，理由：

1.有交互。鼠标移上去，可以提示。

2.更简单。

3.在客户端运行，减轻服务器端的压力。

数据画图 jpgraph & chart.js的更多相关文章

  1. 数据可视化(1)--Chart.js

    Chart.js是一个HTML5图表库,使用canvas元素来展示各式各样的客户端图表,支持折线图.柱形图.雷达图.饼图.环形图等.在每种图表中,还包含了大量的自定义选项,包括动画展示形式. Char ...

  2. 关于chart.js 设置canvas的宽度为父级元素的宽度的百分百 以及 X轴上面刻度数据太多如何处理

    今天在做一个数据统计的界面的时候,需要做折线统计图,在网上找了一圈发现数据统计的插件还是不少的,本着轻量级的的原则选择了Chart.js,后来在做的过程中便遇到两个问题,以此记录下来,和刚刚接触前端的 ...

  3. chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]

    chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文:http://bubuko.com/infodetail-328671.html 默认情况下如下图 Y轴并不是从0开始 ...

  4. Chart.js Y轴数据以百分比展示

    新手一枚,解决的问题喜欢记录,也许正好有人在网上迷茫的百度着.-0- 最近使用Chart.js做折线图的报表展示,直接显示整数啥的很好弄毕竟例子直接在哪里可以用,百分比就没办法了.百度慢慢汲取营养,虽 ...

  5. chart.js 示例

    一个简单的例子. 1.html代码 <div id="pie" style="width: 250px;float:left"> <h3> ...

  6. JS组件系列——开源免费图表组件：Chart.js

    前言:最近被开源免费得有点上火了,各种组件首先想到的就是是开源否.是否免费.是否和bootstrap风格一致.想着以后做报表肯定要用到图表组件的,于是在Bootstrap中文网上面找到了Chart.j ...

  7. Ionic中使用Chart.js进行图表展示以及在iOS/Android中的性能差异

    Angular Chart 简介 在之前的文章中介绍了使用 Ionic 开发跨平台(iOS & Android)应用中遇到的一些问题的解决方案. 在更新0.1.3版本的过程中遇到了需要使用图表 ...

  8. chart.js接口开发：X轴步长和Labels旋转角

    一. 当初为什么选择chart.js 当初项目使用库是Zepto,Zepto能支持的chart处理库太少.也是为了使得项目比较轻量化,所以选择了chart.js. 但是最后的显示结果实在太差,放弃了c ...

  9. chart.js在html中画曲线图

    http://www.bootcss.com/p/chart.js/docs/ http://www.chartjs.org/docs/   中有详细讲解 一.简介 Chart.js是一个基于HTML ...

随机推荐

  1. 编写自己的javascript功能库之Ajax(仿jquery方式)

    本人学习的是php,所以就用php跟js来演示代码了,主要是锻炼自己写js的能力,练练手而已. 下面这是我编写的操作ajax的代码功能,勉强让我称之为库吧.. js代码实例(tool.ajax.js) ...

  2. (转载)C# 编程 使用可空类型

    转载出处为://https://msdn.microsoft.com/zh-cn/library/2cf62fcy(vs.90).aspx#Anchor_1 C#可以为 null 的类型可以表示基础类 ...

  3. HTML&CSS基础学习笔记1.3-HTML的标签语法

    HTML标签语法 1. 标签由英文尖括号<和>括起来,如<html>就是一个标签. 2. HTML中的标签一般都是成对出现的,分开始标签和结束标签.结束标签比开始标签多了一个/ ...

  4. 类和对象：一些相关的BIF - 零基础入门学习Python040

    类和对象:一些相关的BIF 让编程改变世界 Change the world by program 一些类和对象相关的 BIF 今天我们来谈谈跟类和对象相关的一些BIF(内置函数): issubcla ...

  5. 从现在开始使用nodejs开发的几点答疑

    1.为什么要开始用nodejs, 而不是php 理由有三点: 因为我是前端程序员出身,nodejs都是用javascript写的,这样相当于前端和后端都使用javascript,开发更加有效率.当然很 ...

  6. CPLD的发展及趋势简介

    很多板子上,都看到过有CPLD的芯片,如我见过的一个R232电平转换小板上面就用的EPM240T控制器. 当时看到很奇怪,干啥用的,后来想想,232所需的电平不就是由EPM240T提供的嘛.想明白后就 ...

  7. Qt自定义sleep延时函数（巧妙的使用时间差，但这样似乎CPU满格，而不是沉睡）

    Qt不像VC++的win32/MFC编程那样,提供了现成的sleep函数可供调用.Qt把sleep函数封装在QThread类中.子线程可以调用sleep函数.但是如果用户想在主线程实现延时功能,该怎么 ...

  8. JS实现 鼠标放上去 图片自动放大的效果

    前段时间做项目,要实现,一张图片,鼠标放上去图片自动变大的效果,虽然难度不大,但当时也想了一段时间,当时没时间记录一下,现在有时间了,写篇博客把代码给记录一下: 效果如下: 代码如下: <!DO ...

  9. hdu4778：状压dp+博弈

    题目大意: 有g种不同颜色的小球,b个袋子,每个袋子里面有若干个每种小球 两人轮流取袋子,当袋子里面的同色小球有s个时,会合并成一个魔法球,并被此次取袋子的人获得 成功获得魔法球的人可以再次取 求二者 ...

  10. javascript笔记6之函数

    /* function box() { //函数的声明 alert('我只有被调用才可以执行!'); //函数本身没有运行功能 } //必须调用才可以执行 box(); //调用 function b ...