シンプルなグラフを簡単に組み込める「jQuery Sparklines」

「jQuery Sparklines」を利用することで、シンプルがグラフを簡単に組み込むことができます。

利用方法

jQueryとjQuery Sparklinesを読み込みます。

jquery.min.js
jquery.sparkline.min.js

JavaScript

$(".sparkline").each(function () {
      var $this = $(this);
      $this.sparkline('html', $this.data());
});

HTML

<div class="sparkline" data-type="bar" data-width="100%" data-height="20px" data-bar-Width="10%" data-bar-Spacing="0" data-bar-Color="#f39c12">
6,4,8, 9, 10, 5, 13, 18, 21, 7
</div>