2017年12月16日土曜日

JavaScript でグラフを作る方法 (Chart.js)

meta name='twitter:description' content='JavaScript で Webブラウザーにグラフを描けるChart.jsを使ってみました。多機能で便利です。' />

How to draw charts on web browsers with Chrat.js

Chart.js はWebブラウザーにグラフを描画できるMITライセンスのオープンソースJavaScriptライブラリーです。
グラフはWebブラウザーのcanvasタグで描画するため、普及率の高いWebブラウザーに対応できます。
この Chart.js を使ってWebブラウザー用のグラフを作ってみました。
blog.fujiu.jp JavaScript でグラフを作る方法 (Chart.js)


環境

  • Windows 7、Internet Explorer 11
  • Windows 10、Edge


固定データの棒グラフを表示する

Chart.js でグラフを表示するには、グラフ化したいデータを JSON 化し、 Chart.js のクラスを呼び出すだけです。
気象庁が公開しているCSVファイルから一部抜粋して簡単な棒グラフを作ってみました。

これをEdgeで表示するとこうなります。

14~19行目のJSONデータを表示したい内容に合わせて変更すればグラフを変更出来ます。


公開データをグラフ化する

一般公開されているCSVファイルの内容をJSONに変換してグラフ化してみました。
気象庁が定期的に更新しているCSVファイルをリアルタイムに棒グラフ化します。
ただし、 このブログを書いている時点では気象庁のWebサイトはクロスドメインアクセス (Access-Control-Allow-Origin) を開放していないため Windows 7 のInternet Explorer 11 でしか動作確認出来ませんでした。



参考にしたコンテンツ

Chart.js は棒グラフのほかにも折れ線グラフ・レーダーチャート・円グラフ・バブルチャート・散布図などがあり、棒と折れ線を重ねることもできます。
そのほか色やアニメーションなど多彩な機能を備えています。
ただし公式サイトは英語のみ。
http://www.chartjs.org/docs/latest/


関連ブログ

Windows10 で古い Internet Explorer を使う方法
Visual Studio Code で Angular の開発環境を構築する方法

2017年12月3日日曜日

Cubase Pro 9.5 無料体験版を使う方法

How to get Cubase 9.5 trial versions

2017年12月、Cubase 9.5 が30日間無料で使える体験版が公開されました。
その入手方法をまとめました。
blog.fujiu.jp Cubase Pro 9.5 無料体験版を使う方法


環境

  • Windows 10 64bit
  • Steinberg USB-eLicenser (ドングル)
USB-eLicenser は Cubse Pro 9.5 体験版を使う場合も購入する必要があります。
USB-eLicenser なしで使える Cubase Elements 9.5 体験版も公開されています。


体験版を申し込む

体験版を入手するには申し込みが必要です。
公式サイトに自分のメールアドレスを登録するとアクティベーションコードと体験版を申し込むと Steinberg Download Assistant をダウンロードするURLがメールで連絡されます。
https://www.steinberg.net/en/products/steinberg_trial_versions/cubase.html


Steinberg Download Assistant で Cubase をダウンロードしインストールする

Download Assistant はSteinbergの各製品のダウンロードするためのツールです。
Cubase のインストーラーをダウンロードするための Download Assistant をインストールします。

Download Assistant を起動すると右上の設定でダウンロードしたファイルの保存場所を変更出来ます。
体験版を使うなら Cubase Pro 9.5 - Full をダウンロードします。

ダウンロードしたファイルは zip 形式の圧縮ファイルです。
展開して Start Installation.exe をダブルクリックするとインストールが始まります。


eLicenser Contorol Center に体験版用アクティベーションコードを入力する

Cubase と一緒にインストールされる eLicenser Contorol Center を起動してアクティベーションコードを入力します。
これで正常に動作すれば30日間利用出来ます。


関連ブログ

Cubase 9.5 は旧バージョンと共存できるか上書きするか
Steinberg HALion Sonic SE 3 を使ってみました
[HALion] Steinberg の無償のサウンドライブラリーを使う方法
[CUBASE] WahWah でオートワウする方法 (サイドチェーン)