C3、D3

C3、D3
Javascript (D3+React_アニメーションサンプル)

■歯車のサンプル。地図、ツリー、関数と見てきたけど、他に何かめぼしいものがないかD3の公式サイトを見ていたら、歯車を動かしているアニメーションがあった。それを簡素化したバージョンにして動かしてみた。 2つの歯車(左が歯数 […]

続きを読む
Javascript
Javascript (D3+React_関数サンプル)

■矩形波の関数。無線工学とかで出てくる矩形波をフーリエ級数で表現したもの。下の数式のやつ。 f(t) = 4/π(sint) が次の関数になるので、そこから1/3sin3t, 1/5sin5t と追加していき、最終的に2 […]

続きを読む
Javascript
Javascript (D3+React_ツリーサンプル)

■簡単なサンプル02。D3+Reactで何ができるか試行錯誤中。今回はツリーのサンプル。このブログのカテゴリーに対して投稿数をサイズとしてツリー状にしてみた。 サンプルコードはChat GPTで生成した(参考に一番下につ […]

続きを読む
Javascript
Javascript (D3+React_簡単なサンプル)

■D3+Reactでサンプルをつくる。D3でグラフを作り、Reactでグラフ部分だけを更新するといった形で何か作りたい。ReactでD3を使うために、まずコマンドプロンプトから npm install d3 でインストー […]

続きを読む
Javascript
Javascript (C3, D3_地図のお試し03)

■表示の線幅の問題だった。前々回に見た日本地図の細部がつぶれているように見えたので、あれこれと試しているけど、結論としてただの線の設定の問題だった。なお、地理院地図Vectorのサイトでjsonデータとして保存できていた […]

続きを読む
Javascript
Javascript (C3, D3_地図のお試し02)

■国土地理院サイトのGMLのxmlファイルから表示。国土地理院のサイトに基盤地図情報という地図データを公開しているところがあったので、そのデータから表示ができない試してみた。GML(Geography Markup La […]

続きを読む
Javascript
Javascript (C3, D3_地図のお試し)

■D3のいろいろ試し(地図)。D3での例にUSの地図を使ったものがあったので、日本版の地図情報を探してそれを表示させるところまで。 著作権上問題ない地図情報を持ってきて下のように同フォルダに置く。japan.topojs […]

続きを読む
Javascript
Javascript (C3, D3_チュートリアル)

■c3.js, d3.jsのグラフのライブラリ。Reactを使って何か作ろうかと思うけど、別のライブラリを組み合わせたい。グラフや地図関連のライブラリとしてc3.js、d3.jsを少しみたい。今回は単純にチュートリアル的 […]

続きを読む