Frappe Charts

JavaScript

シンプルでモダンなSVGチャートを実装できる「Frappe Charts」

Frappe Chartsは、シンプルでモダンなSVGチャート(グラフ)を実装することができるライブラリです。レスポンシブにも対応しているほか、jQueryなどへの依存性もゼロになります。数値をチャートで表示すれば見やすく比較しやすくなるので、閲覧者にとっては助かりますね。

Frappe Charts

デモ

デモページでは、棒グラフや折れ線グラフなど、さまざまなチャートを見ることができます。どのチャートもデザインがスッキリしていて、無駄な装飾もなくとても見やすいです。

シンプル、ミニマルなデザインを採用しているサイトとの相性はもちろん、いろんなサイトで合わせやすいのではないでしょうか?

また、レスポンシブにも対応していることから、パソコンだけではなくスマホやタブレットでの閲覧にも適しています。

グラフにマウスオーバーすれば、個別の値も表示されますよ。シンプルながらも、実用的な機能はしっかりと備えている印象です。

セッティングに関しては、parent、title、data、type、heightといった項目の値を指定することができます。ちなみにtypeには、bar、line、scatter、percentageの値が用意されています。

Frappe Charts

Light Modalパワフルでカスタマイズ性に優れたCSSモーダル「Light Modal」前のページ

多彩なパラメーターでモバイルフレンドリーなjQuery Lightboxプラグイン「frydBox」次のページno-image

関連記事

  1. quick-select

    JavaScript

    素早く簡単に選択できるセレクトボックス「quick-select」

    quick-selectは素早く簡単に選択可能なセレクトボックスを実装…

  2. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQuery(JavaScript)で指定した要素の子要素数や最大文字数を配列内から取得する

    jQueryで指定した要素の子要素の数やその文字数、文字なんかを配列に…

  3. NO IMAGE

    JavaScript

    フレキシブルで軽量なJavaScriptモーダル実装「Vanilla Modal」

    Vanilla Modalは、フレキシブルでファイル容量も軽量なCSS…

  4. infoBox

    JavaScript

    マウスオーバーでインフォメーションボックスを表示させる「infoBox」

    infoBoxはアイコンにマウスオーバーするとインフォメーションボック…

  5. Inspiration for Menu Hover Effects

最近の記事

  1. サンクラフト ポテトング
  2. iPhone 11 Pro Smart Battery Case(ホワイト)
  3. メイソンピアソン ヘアブラシ
  4. COMOLI ベタシャンCPOシャツ(サックス)

アーカイブ

PAGE TOP