shingoushori's dialy

音信号処理を専ら研究していた元博士後期課程の学生によるメモ

Canvas関係のグラフを描くライブラリを使ってみた

<概要>

Canvasの練習です.
前回、"Canvasで、任意長の配列で折れ線を描いてみる"してみました.
次は、軸を描いてみて、グラフにしたいと思ったわけです.
そういえば、ライブラリが無いわけがないと思いまして、探して使ってみました.

今回使ってみたのは、次の2つ.
Chart.js
CanvasJS
他にも色々ある中でこれらに目をつけたのは、とりあえずはフリーだから.
それでいて、比較的データ自体の入力以外が少なそう...と思ったから.
しかし、いざやってみると細々としたオプションを設定したくなってしまったのでした.
↓とりあえず、同じデータで同じようなオプションを設定してみました↓


・Chart.js

・CanvasJS

 

Chart.jsは、凡例をクリックしたらそのデータの表示がトグルできるんですね!デフォルトで!これは素敵です.
しかし、デフォルトで表示時のアニメーションと線の下の塗りつぶしがついているのはイマイチです、チャーミングですけれども。
また、デフォルトで折れ線部分が丸くなるんです.これを外すのにしばらく悩みました.

CanvasJSは、とりあえず凝ったことをやろうとしたら有料らしいです.怖くて使いづらいです.
データ入力が単純な配列じゃなくて、{y:value}って具合にいちいち格納しないといけません.特定の値だけにlabelをつけられるのは良さそうですが.
今回はまだ使っていませんが、Spline Chartが用意されているのが気になるところです.

<結論>

どちらを使っていくのか全然悩む程度には、どちらも今ひとつでした.

<参考文献>

Chart.js | Open source HTML5 Charts for your website

【Chart.js】折れ線グラフの色設定

Beautiful HTML5 JavaScript Charts | CanvasJS

JavaScriptで爆速グラフ・チャートが作成できる「CanvasJS」を使ってみた! : うえぶはっく

Canvasで、任意長の配列で折れ線を描いてみるテスト

<概要>
Canvasの練習です.
任意長の配列で折れ線を描く.これを関数したら楽にならないかな、と思っている次第であるためです.

やってみた事は単純です.
1.座標点の配列を定義
2.配列の各点を、canvasの折れ線の終点として次々に設定 : context.lineTo
3.ついでに各点の座標点に、塗りつぶした円を点として設定

やってみて意外だったのが、起点の座標の設定 context.moveTo が省けてしまった事です.
起点を設定せず、最初の終点として起点を設定しています.


<参考文献>
canvasを使ってグラフを描く - Webサイト制作最新トレンドの傾向と対策 | Webデザインとグラフィックの総合情報サイト - MdN Design Interactive

PythonでMIDIをいじってみる準備 とりあえず、pretty_midi

PythonMIDI をいじってみようとしています。
とりあえず、pretty_midi にしました。

・なぜ pretty_midi
理由1:ノートのon/offを1回の関数呼び出し(?)でできる。
理由2:和音できそう。
理由3:TensorFlow製音楽生成プロジェクト「Magenta」で用いられている。
理由4:わかりやすそうなサンプルコードの記事があった。
こちらがその記事です
pretty_midiを使って、PythonでMIDIファイルを作成する - Qiita

・参考にした記事

PythonでMIDIを扱うパッケージ midiとpretty_midi - Qiita

 

・つまづいた
pretty_midi のインストール以前の pip のインストールでつまづきました。
Python、むずい。

いつの間にかpipのインストールが楽になってた件 - Qiita

pipのインストールにハマって悲しい思いをしているたぶんEl Capitanなあなたへ - Qiita

 

スマフォからの投稿

やれるだろうなと思っていましたが。当然のようにできるんですね。スマフォからのはてなブログへの投稿。

はてなブログ純正っぽいAndroidアプリで、今打ち込んでいます。

ところがこのAndroidアプリ、Google PlayのDLページのレビュー欄に並ぶコメントが不安です。

そして早速、立ち上げて数秒後に異常終了しました。

果たしてこの文章も無事に投稿できるのでしょうか?

Pythonで音信号処理する環境づくり on Mac のメモ

<経緯>
メインPCがMacです。
Pythonで音信号処理する環境づくりをやりました。
恥ずかしいことに、これまで何度も挑戦しては挫折してました。
今回は今の所すんなり綺麗にできているので、メモをば。

<Python本体>
まずバージョン。Python2, Python3 をそれぞれ入れて適宜切り替えることに。
どうせ、どちらかだけでは済まないんだから。
今回は、以下の並びで入れてみた。

Mac -> Homebrew -> pyenv+virtualenv -> Anaconda

以下、参考にしたサイトです。

HomebrewのインストールからpyenvでPythonのAnaconda環境構築までメモ - Qiita

データサイエンティストを目指す人のpython環境構築 2016 - Qiita

Macでpyenv+virtualenv - Qiita

<音信号処理の一歩二歩>
とりあえず、WAVファイルの読み書きに、FFT から。
色々なモジュールでもってやれそうです。

pythonでwavファイルを扱う108の方法 - (wrist blog)


とりあえず、scipyを使ってそうなサンプルを下地にあれこれします。
scipyだとフィルタ設計関数が色々あるらしいので。

以下、サンプルを動かしてみたサイトです。

Pythonで音の高速フーリエ変換(FFT)

Pythonで短時間フーリエ変換(STFT)と逆変換 - 音楽プログラミングの超入門(仮)

高速フーリエ変換(FFT) - 人工知能に関する断創録

Pythonで音響信号処理 - Qiita

デジタルネイティブ

雑談です。

"デジタルネイティブ" って言葉を目にしませんか。
この言葉に徐々に違和感が膨らんでおります。
ついぞ先日、ぽろっと言語化に至りました。
ゆえに、ここで雑談です。

... 結論としては、
"デジタルネイティブってITであってデジタルじゃないよね"
"デジタルの方のレベルを引き上げたほうがいいんじゃないの"
です。

つまり、
情報理論を意識した意思疎通を図ろうよ!
音信号のディジタル信号処理、もっと流行れよ!
ってことです。うん。

 

<どこで目にするのよ?>

わたしが目にするデジタルネイティブは、... まあ2つ。
1. 出身大学
「ディジタル・ネイティブ世代の国立大学法人電気通信大学 UEC TOKYO」
http://www.megrokai.or.jp/megurokai/kaihou/kiji/kiji221/shinsei_uec.html

2. テレビ というより たぶん某現代の魔法使い先生

 

<定義?>

wikipedia先生に頼ります。
https://ja.wikipedia.org/wiki/デジタルネイティブ

"学生時代からインターネットやパソコンのある生活環境の中で育ってきた世代"
インターネットの有無でパソコンの意味が大きく異なりそうですけども、
まあ IT ですよねこれ。

"日本では1980年前後生まれ以降"
思ったより範囲が広いですね、わたしもズブズブにデジタルネイティブ

アメリカの”教育分野における作家”が2001年に定義した呼称であると。

日本における世代の議論が載っています。

・76世代 パソコンによるインターネット利用が中心
・86世代 携帯電話によるインターネット利用
・96世代 様々な携帯通信機器を利用して動画コンテンツを視聴するとともに、クラウド環境での集合知(衆合知)を活用 「ネオ・デジタルネイティブ

・「デジタル・ネイティブ第1世代」物心ついた頃から ... 検索サービスに触れてきた世代
・「デジタル・ネイティブ第2世代」ソーシャル・メディアやクラウドコンピューティングを使いこなし青年期を過ごした世代

うむ、ひたすらIT。

 

<違和感>

やっぱり、IT。インフォメーションテクノロジー。

まず、デジタルが議論の先頭に来ないことへの違和感。
デジタルとアナログの違いへの意識がないのをネイティブとしているのかしら?
違うんじゃないか。ネイティブへのイメージは、穿ったイメージだけど、「つかいこなしていてすごいね〜」くらいの放任、傍観だと思う。
デジタル信号処理って、何をどう諦めるかの作業だと思う。実は万能でもなんでもないわけで。
そのあたりのデジタルな感覚ぅ?わびさびぃ? ... が、わたしは好きなんで、
そっちの議論をしてくれるといいな。

次に、IT。インフォメーションテクノロジーについても、
情報理論というより、単にインターネットだよなと感じるわけです。
インターネットがなくたって、デジタル機器がなくたって、
実のところ私たちの時間感覚ってデジタルだったと思うのです。
夜や食事なんかで、私たちの時間はいつだって断続的ですよね。
付き合っている人だって、立場だって、パタパタと切り替わる。
時間感覚がデジタルなら、そこから得られる情報も、ずっとデジタルだったんです。
いつだって、デジタル。なんだって、デジタル。
で、ITとしてデジタルさがブーストされた。ただそれだけで、なにも変わっていない。
その上で、ブーストできている下地を知ることが生活や文化の水準を守るために必要であると。たとえばそれは、情報理論とか信号処理であるわけです。

それは難しいことでもなくて、
単に "全てを知ることはできない"とか、
”どうしても曖昧さが残る”、”別の視点に立つと見え方が変わる”とか、
そんなことを意識することがもっと大事なんじゃないかと思います。

ちょっと優しくなれそうじゃないですか?
優しくしてもらえそうじゃないですか?

 

とかく人工知能あたりで技術を物騒にみていたり、
研究者技術者〜をまるで血の通わない薄情で肉体のない冷徹で...
まるで人類の敵の親みたいな目で見られているように感じて、
生き辛いですけれども。
少なくともわたしは、ずいぶんほんわかとした未来に憧れて工学してます。
だから ... もうちょっと生きやすくなるといいなー。

元博士後期課程の学生

そういえば、ブログの設定も更新していませんでした。
下記のように更新してみました。

旧:音信号処理を専ら研究している博士後期課程の学生によるメモ
新:音信号処理を専ら研究していた元博士後期課程の学生によるメモ

2016年3月に博士(工学)が取れたんです、はい、電気通信大学で。
"元博士後期課程の学生"の方がそれらしいので、そのようにします。

これだと文の構造が取りにくい悪い文ですけれども。

音信号処理にも研究職にもこだわりませんでした。
とはいえ、研究意欲は湧いてしまいますので、
捌け口として気ままにここに出していきます。