Thứ Ba, 18 tháng 12, 2012

jQuery Sparklines - The tool draw chart

This jQuery plugin generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript.

The plugin is compatible with most modern browsers and has been tested with Firefox 2+, Safari 3+, Opera 9, Google Chrome and Internet Explorer 6, 7, 8, 9 & 10 as well as iOS and Android.
Each example displayed below takes just 1 line of HTML or javascript to generate.

Link to jQuery Sparklines http://omnipotent.net/jquery.sparkline/#s-about

Example :
<script type="text/javascript" src="jquery-1.7.2.js"></script> 
<script type="text/javascript" src="jquery.sparkline.js"></script> 
<p> Inline Sparkline: <span class="inlinesparkline">5,5,9,10</span>. </p> 
 <script type="text/javascript"> 
 $(function() {   
 $('.inlinesparkline').sparkline('html', {type: 'pie', barColor: 'red'} ); 
 }); </script> 

Pros
(plus) Easy to use
(plus) A jquery plugin (we are familiar with jQuery)
(plus) Free software
(plus) Run faster than google chart
(plus) Have variety of different charts

Cons
(minus) Border not smoothly rounded for pie chart
(minus) Cannot add SliceText  (only show Slice's value)
(minus) Limited customisation to tool-tip styling

Không có nhận xét nào:

Đăng nhận xét

Học lập trình web căn bản với PHP

Bài 1: Các kiến thức căn bản Part 1:  https://jimmyvan88.blogspot.com/2012/05/can-ban-lap-trinh-web-voi-php-bai-1-cac.html Part 2:  https://...