[JS]便利なのが登場！実装はかなり簡単なのに、さまざまなチャートやグラフを実装できるスクリプト -ApexCharts
チャートやグラフを実装するのは面倒、と思われがちですが、そんな人にはこのスクリプトをお勧めします。 div要素一つと外部ファイルを一つ、あとはグラフのデータを設定するだけで、さまざまなチャートやグラフが簡単に実装できてしまう単体のJavaScriptライブラリを紹介します。 レスポンシブ対応で、アニメーションにも対応、カラー変更やグラデーションやパターンにも対応している優れものです。 ApexCharts ApexCharts -GitHub ApexChartsの特徴 ApexChartsのデモ ApexChartsの使い方 ApexChartsの特徴 ApexChartsはシンプルなAPIを使用して、インタラクティブなチャートやビジュアライゼーションを作成するためのモダンJavaScriptのチャート作成ライブラリです。 MITライセンスで、個人でも商用でも無料で利用できます。 レスポ
![[JS]便利なのが登場！実装はかなり簡単なのに、さまざまなチャートやグラフを実装できるスクリプト -ApexCharts](https://cdn-ak-scissors.b.st-hatena.com/image/square/b793c623eb3187e192351b9611f75aea908bbf46/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201803%2F2018080101-02.png)
Dgraph - A high performance graph database written in pure Go
Go Conference 2018 Spring
IBM Instana - IBM Blog
Your Black Friday observability checklist 3 min read - Black Friday—and really, the entire Cyber Week—is a time when you want your applications running at peak performance without completely exhausting your operations teams. Observability solutions can help you achieve this goal, whether you’re a small team with a single product or a large team operating complex ecommerce applications. But not all
The Flame Graph - ACM Queue
April 20, 2016 Volume 14, issue 2 PDF The Flame Graph This visualization of software execution is a new necessity for performance profiling and debugging. Brendan Gregg, Netflix An everyday problem in our industry is understanding how software is consuming resources, particularly CPUs. What exactly is consuming how much, and how did this change since the last software version? These questions can
spark: シェルスクリプトで棒グラフ表示
B! 251 0 0 0 GitHubで面白そうなシェルスクリプトを探してる時に見つけた Spark by holman について。 数値を棒グラフ上に表示してくれるスクリプトです。 Spark 使用例 Spark Spark は数値群を引数に与えるか標準入力で与えてあげると その数値群を棒グラフに変換してくれるシェルスクリプトです。 インストールはGitHubのレポジトリ から直接sparkというスクリプトファイルを取ってきてPATHの通った所に入れるか、 MacであればHomebrewで $ brew install spark でsparkコマンドが使えるようになります。 使い方は非常にシンプルで $ spark 0 20 40 60 80 100 ▁▂▃▅▆█ こんな感じで数値を与えるとそれを棒グラフにしてくれます。 インプットに使える数字は少数も使えますが、 実際に使われる際には
Announcing Highcharts 4 – Highcharts
We’re thrilled to announce Highcharts 4, including new feature like the long-awaited 3D display and heatmaps, as well as new graphic design and solid, colored gauges. New is also the Download Builder, where you can pick the features you need for your project and create a customized file for quick delivery. Along with the new release comes Highstock 2, including the new Highcharts 4, new design and
tableのデータを元に、棒グラフを生成するjQueryプラグイン・TableBarChart
tableのデータから棒グラフを自動生成するスクリプトのご紹介です。jQueryに依存します。手軽で良かったので備忘録として。 tableに記入されたデータを元にアニメーションエフェクト付きの棒グラフを自動生成する、というもの。以下、動作サンプルです。 tableはマークアップで、棒グラフはそのtableのデータを元に生成されています。 <script type='text/javascript' src='http://code.jquery.com/jquery-1.11.0.js'></script> <script type="text/javascript" src="TableBarChart.js"></script>本体とプラグインを読み込みます。 $('#foo').tableBarChart('#bar', '', false);tableとグラフを表示する要素を指定し
Dygraphs — main page
⚠ Please visit the official Dygraphs homepage https://dygraphs.com/ instead. You are reading this on a mirror, which may have outdated, incomplete and/or locally patched information, or as part of the Debian package; links may not work. dygraphs is a fast, flexible open source JavaScript charting library. It allows users to explore and interpret dense data sets. Here's how it works: This JavaScrip
絶対まねしたい！Chart.jsを使ってフラットデザインぽいグラフを作る方法 | startapp
Chart.jsというのが流行っているみたいなので、もうちょっとフラット感がでないものか、カスタマイズに挑戦してみました。Chart.jsの使い方などは、LIGさんの記事を参考にしてください。 ドーナッツ これを何個か並べればかなりフラット感が出ますね。外側の青い部分のみをChart.jsで描画し、それ以外はCSSで調整しています。2つ目のセグメントを背景色で塗れば、円弧のように見えます。 ※ ドーナッツの幅は、percentageInnerCutout で調整できます。 ラインチャート お次は棒グラフです。フラットに見せるポイントは、グラフや線などを簡略化することでイラストのように見せるところです。また、数字と組みあわせるとかっこ良く見えます。※ 数字の部分は、CSSで組んでいます。 ※ 横軸のラベルは、意図的に減らしています。 バーチャート 棒グラフもフラットにしてみました。こちらも数
gfspark: GrowthForecastのグラフをターミナルに表示する - ( ꒪⌓꒪) ゆるよろ日記
というコマンドを作った。みんな大好きGrowthForecast!! gfspark yuroyoro/gfspark · GitHub Installation $ gem install gfspark Usage 以下の3つのいずれかの方法でグラフを指定してくれ。 gfspark "グラフのURL" gfspark your_service/your_section/your_graph h --url=http://your.gf.com gfspark your_service your_section your_graph h --url=http://your.gf.com Complex Graphには対応してない。あと、内部でsttyコマンドを使ってるのであっWindows…… グラフが上手く表示されない場合は、`-n`オプションを試してみてくれ。例えば、フォントがRic
Pythonを使って簡単にデータを視覚化する
世の中のことをもっと知るにはどうしたら良いだろうと思うときがある。世の中の多くの事柄はログやデータに落とされる。Googleなどの検索サイトは良い例だろう。さて、そのログやデータをどうすれば良いのか? 多くの場合、視覚化が有効な手段となる。 まずは身の回りの日常的なデータやログを何とかしたい。ただ、日常のデータを視覚化するのに数十行以上のコードは書きたくない。まるで息をするかのごとく自然に視覚化を行いたいのだ。そのためには1～2行、長くて数行で済ませることが必要だ。そこでPythonとmatplotlibを使う。加えて、IPythonがあればなお良い。IPythonの導入については以前のブログ記事であるIPythonの埋め込みプロットが素晴らしいを参考にして欲しい。 まずは事前にnumpyとmatplotlibをインポートしておく。できればscipyも。 >>> from numpy im
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Plotly: Low-Code Data App Development
ECharts � Home
MetricsGraphics
fnordmetric.io
GitHub - naoty/graphdown: Markdown extension for embedding graphs.
Yohoushi という分散 GrowthForecast グラフツールを作りました : sonots:blog
Chart.js