健巳ラーニング実況 その１1

Vue.js + SVG でツリーマップを描画するプログラムを作っていきま。
ニコニコ配信も勉強中です。


■やるべきこと
・描画した要素をクリックし、入力エリアでデータを編集できること
・分岐シナリオの子データの次の要素(next)の要素が正常に描画できること
・分岐シナリオが重ならないようにする(ツリー構造に枝番号を割り振る)
・作成したシナリオデータをJSONとして出力する
・出力したJSONデータを読み込んで編集可能になること

前回に引き続き、シナリオ分岐の分岐処理の部分をつくっていきま！

現在作成しているソースコードはGitHubにアップしてます。
https://github.com/takemi0/treemap

ーーーーーーーー

過去配信の履歴
・その１０分岐シナリオの描画に成功。
・その９　分岐シナリオに線が正常に引かれなかった課題の対処法を整理。
・その８　カードの選択肢の先に分岐するシナリオの要素の作成にトライ。
・その７　シナリオ要素同士を線で繋ぎツリーっぽい表示を作成。
・その６　動的要素の高さを可変に対応、テキスト表示に改行を対応。
・その５　ツリーマップの表示部分にカードの動的要素を反映させた。
・その４　ツリーマップの表示部分に追加した要素を表示させる

・その３　ツリーマップのデータ要素を作るフォームをVue.jsで作成

・その２　作ったクラスを使ってツリーマップにチャレンジ
　　※延長設定ミスったので分かれてます。

・その１　JavaScriptでクラスを使えるようになる！
　　配信の後半は[3]を探し続けてたｗ
　　※延長設定ミスったので分かれてます。