Chart.jsで作成する折れ線グラフの実例
たまに必要に迫られて、ブラウザで完結するように生のJavaScriptを書くことがあります。 今回はそんなシンプルな構成でも案外きれいなUIを作成するのに役立つグラフ作成ライブラリ、Chart.jsについてメモしておきます。 機能の豊富さとコーディングの簡潔さは往々にしてトレードオフなので、ライブラリの選択が重要ですね。 D3ほど高機能でなくてもいいが、できるだけ簡単にグラフを書きたい、という時に扱いやすい（と個人的に思っている）ライブラリです。 ■ シンプルな記述 ■ よく使われるような種類のグラフなら標準の機能だけでも作成できる ■ (ちょっとサイズが大きいが)ファイルひとつで動く ■ デフォルトでアニメーション(パフォーマンス要件が厳しければ無効化することもできる) もくじ： Chart.jsの設置 基本の折れ線グラフ 線のスタイル 線の色と背景色 破線 直線 ステップ 点 欠損値
google chartsで横軸が日時なグラフを作成する
google charsで横軸(x軸)が時間軸になるようなグラフの作成方法のメモです。 データタイプによって24時間表記のみか日付+時間かのどちらかを選択可能です。 DataType:datetime DataType:date ソースコード デモ <!doctype html> <html> <head> <meta charset="utf-8" content=""> <title>google-charts 横軸が日時なグラフ</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript" ></script> <script type="text/javascript" src="https://www.google.com/
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
