Warning! We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it. Read more about our Privacy Policy and Cookie Policy
Because Plottable handles layout, sizing, and positioning, Plottable charts are easier to create and more reusable than charts built only with D3. And, since Plottable Components are powered by D3, the flexibility of D3 is still available. All Plottable components are usable on their own, so you can take small pieces to add to existing charts, or create charts entirely with Plottable. Plottable cu
どうも、まさとらん(@0310lan)です。 今回は、JavaScriptを使って「グラフやチャートを描きたい!」とか、「さまざまなデータを可視化させたい!」という人にオススメのJSライブラリをご紹介しようと思います。 また、すぐに使い始められるように、ミニマムな構成の「サンプルコード」も合わせて掲載しているので、自分に合ったライブラリを使う取っ掛かりになれば幸いです。 ■Chart.js 【Chart.js】 最近、活発にバージョンアップをしている「Chart.js」は、すべてのグラフが自動的にアニメーション表示されるユニークな仕掛けを持っており、シンプルで理解しやすい記述が出来る点も魅力です。 グラフの種類は少ないものの、モダンブラウザ&レスポンシブ対応で、あまりカスタマイズせずに「デフォルト」のままでも手軽に使えるでしょう。 【 基本の書き方 】 「chart.js」ファイルは、公式
カナダPlotlyは11月17日、JavaScriptグラフ作成ライブラリ「Plotly」をオープンソースで公開した。Plotlyを利用することで、データを視覚化するインタラクティブなグラフを利用するWebアプリケーションを容易に作成できるという。 Plotlyはデータ視覚化のためのプラットフォームで、今回中核となる技術をオープンソースとして公開する。3年以上をかけて開発した技術としており、MIT Licenseを採用する。 D3.js(SVG)とstack.glを土台としたインタラクティブなチャート向けのJavaScriptライブラリで、棒グラフ、チャート、地図、箱ひげ図、ヒストグラムなど20種類のグラフをサポートする。R、Python、MATLAB向けのクライアントが提供され、開発者はこれを利用してPlotlyをアプリケーションから利用できる。 学術レベルの品質、テストフレームワークな
venn.jsはベン図・オイラー図を描くためのJavaScriptライブラリです(参照:ベン図・オイラー図)。D3.jsに依存しています。上図のように、複数の集合同士の関係や範囲を視覚的に図式化は勿論、各円とその共通部分の数値をツールチップで表示する事が可能です。ライセンスはMITとの事。 venn.js
greuler is graph theory visualization tool powered by d3 and on top of WebCola which allows the creation and manipulation of graphs with a simple api greuler works on top of d3.js and WebCola so include those first <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.js"></script> <script src="http://marvl.infotech.monash.edu/webcola/cola.v3.min.js"></script> Install greuler with bower
cola.js (A.K.A. "WebCoLa") is an open-source JavaScript library for arranging your HTML5 documents and diagrams using constraint-based optimization techniques. It works well with libraries like D3.js, svg.js, and Cytoscape.js. The core layout is based on a complete rewrite in Javascript of the C++ libcola library. It also has an adaptor for d3.js that allows you to use cola as a drop-in replacemen
It’s practically impossible to imagine any dashboard without graphs and charts. They present complex statistics quickly and effectively. Additionally, a good graph also enhances the overall design of your website. In this article, I’ll show you some of the best JavaScript libraries for graphs and charts. These libraries will help you create beautiful and customizable charts for your future project
20+ JavaScript libraries to draw your own diagrams (2024 edition) by Jordi Cabot | Jan 10, 2024 | tools, cloud & web engineering, Model-driven Engineering | 53 comments You can draw and model anything in your browser with JavaScript. Indeed, there is a vast array of user-friendly online modeling tools available to create UML (or ER, BPMN, …) diagrams right in the browser. But what if you want to c
About Chartinator Chartinator - Google Charts made easier and accessible. Description: A jQuery plugin for transforming HTML tables, Google Sheets and js arrays into charts using Google Charts Repository: https://github.com/jbowyers/chartinator Demo: http://chartinator.com Bower: chartinator Requires: jQuery, Google Charts Author: jbowyers Copyright: 2015 jbowyers License: GPLv3 Version: 0.3.10 De
Introduction I was curious about the connections between some of the people I follow on Twitter and wanted to try visualizing it using D3 and ClojureScript using a force directed graph. The end result looks like this: Not a lot of surprises, there are a few clusters around common interests: Emacs, food, Dwarf Fortress, Hadoop, etc. Code In this post i’ll just share a minimum of ClojureScript code,
The JavaScript InfoVis Toolkit provides tools for creating Interactive Data Visualizations for the Web.
C3.jsとは? C3.js | D3-based reusable chart library C3 はチャートに特化したビジュアライゼーションライブラリです。D3 のラッパーライブラリで、D3 の見た目の美しさやインタラクション性などの特徴を残しながら、チャートライブラリとして分かりやすいインターフェースを提供するという方針で開発を進めています。 http://blog.xica-inc.com/about-xica/member-12/ これはまではhighchart.jsを使っていましたが、商用利用は有償だったりするので今回C3.jsをいじってみます。 サンプル どんなチャートが作れるか以下のサンプルを見れば分かります。 C3.js | D3-based reusable chart library 使ってみる 音ゲーなどではゲーム終了時にスコアの軌跡がグラフとして描画されたりしま
JavaScriptチャートライブラリのC3.jsは,同じようなツールに溢れる大海に現れた新顔だ。D3可視化ライブラリ上に開発されたこのライブラリでは,再利用性のあるグラフの開発が可能だ。作成したグラフは,画面表示後の操作にも対応する。 C3を使ったグラフの開発は,単にgenerate関数にオブジェクトリテラルを渡すだけ,という簡単なものだ。 var chart = c3.generate({ data: { columns: [ ['data1', 30, 200, 100, 400, 150, 250], ['data2', 130, 100, 140, 200, 150, 50] ], type: 'spline' } }); (画像をクリックして拡大) ドキュメントは充実しているとは言い難いが,提供されているサンプルコードはC3の機能を十分に表現している。グラフオブジェクトには,デ
Datamatic.io is a visualization generator based on the amazing D3.js library. It comes with: 9 templates (Mike Bostock’s samples)36 color palettes (mostly colorbrewer2.org)colourful polygonic backgrounds (Trianglify)Excel-like editor optimized for editing tree structures (Handsontable)properties panel (dat-gui)By remixing templates, palettes, backgrounds, data and properties, you can create all ki
You may think that this is just yet an other charting library. But Chartist.js is the product of a community that was disappointed about the abilities provided by other charting libraries. Of course there are hundreds of other great charting libraries but after using them there were always tweaks you would have wished for that were not included. Get awesome Dashboard Templates by Creative TimAre y
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く