稼働時間データで24時間の円グラフをSVGで描画するJavaScriptの作成

【用途・目的】 次の様な稼働時間データを与えたら、24時間の円グラフで表示してほしい チーム名 開始日時 終了日時 チームE 2017/6/5 7:59 2017/6/5 8:41 ちーむR 2017/6/5 8:42 2017/6/5 10:54 グループA 2017/6/5 10:57 2017/6/5 11:02 ・ ・ ・ １週間分のデータが渡される * チームごとに色分けして円グラフに表示する * プルダウンなどで日別で円グラフを切り替える * グラフをマウスオーバーで、「タスク名」や「カテゴリ」「作業時間」など、同じレコードの他のデータ項目を表示する * 1日の合計時間、 チームごとの合計時間を計算して、箇条書きか、表形式で表示する * 24時をまたぐ場合は日で分割して計算 * 稼働時間が重なっている場合は、グラフ上には薄い赤などで表示 【参考URL】 1日の予定を円グラフ風に表示する「24時間サークルメーカー」 http://stabucky.com/wp/archives/8537 【作業範囲】 SVGで描画するJavaScriptの作成する 稼働時間はCSVデータをテキストエリアに貼り付ける CSVデータをJSON形式に変換した上で、グラフ描画ロジックに渡してください。 上記までが作業範囲です。 テスト用データはCSVファイルで提供させていただきます。 【希望納期】 急ぎではないが、６月中ぐらい 【その他コメント】 最終的には外部APIからJSONでデータを引き渡して、kintoneのカスタマイズビューに組み込む予定です。 kintoneへの組み込みはこちらで行いますので、ビュー部分のJavaScirptの処理までを依頼範囲とさせていただきます。