iMind Developers Blog

iMind開発者ブログ

visualize

chart.jsの円グラフのラベルを線で指して表示する

概要 chart.jsの円グラフのラベルを線をびーっと引いてその先に表示するようにしてみたい。 完成図 バージョン情報 chart.js 2.8.0 chartjs-plugin-piechart-outlabels 1.1.2 通常の円グラフ まずは最低限のコードで円グラフを生成。 <html> <head> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css"/> </link></head></html>

chart.jsの円グラフの中に値を表示する

概要 chart.jsで作った円グラフのグラフ内にパーセンテージを表示するようにする。 完成図 バージョン情報 chart.js 2.8.0 chartjs-plugin-datalabels 0.6.0 通常の円グラフ まずは最低限のコードで円グラフを生成。 <html> <head> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css"/> </link></head></html>

t-SNEによる高次元データの可視化

概要 t-SNEとPCAでMNISTの手書き文字やファッション画像を2〜3次元に圧縮して可視化してみる。 バージョン情報 scikit-learn==0.21.2 Keras==2.2.4 (fashion_mnistのデータセットで利用) 手書き文字 - t-SNE - 2次元 sklearn.datasetsのdigitsを使って2次元…

chart.jsでグラフ上に任意の画像を表示する

概要 chart.jsのグラフの上に任意の部分に画像を表示したかった。 バージョン情報 chart.js 2.8.0 動作確認ブラウザ Firefox 67.0 Chromium 75.0 作成する画面 みんな大嫌いなPie Chartで中央に黒い太陽の絵を置いてみる。下記のようなイメージ。 ただのPie …

matplotlibで色をたくさん使う

概要 matplotlibで色分けしてグラフを表示したい時に、色をたくさん取ってくる方法について調べる。 バージョン情報 matplotlib==3.0.3 8色まで matplotlib.colors.BASE_COLORSで8色が出せる。用意されている色はb, g, r, c, m, y, k, w import matplotlib f…