フォーム画面(詳細画面)にグラフを作りたい場合の方式

今作っているフォームに「A:5分 B:10分 合計15分」みたいな内容から、
円グラフなど簡単なグラフを作りたいと思っています。
※日報にグラフを付けるようなイメージ。1レコード内の情報だけでグラフをそのレコードの画面で描画する

どういう方式が早いかなと思ったのですが、Kintoneのグラフ機能は1レコードに対してグラフを作成することには対応していないように見受けられたので、Javascriptなどでの対応を考えています。

chart.jsなどを使って描画できないかなと思ったのですが、
そもそもcanvas領域を指定することができないから、そういった方式では描くのは無理でしょうか。
(この方法が一番楽かと思い)
それ以外の方法だとGoogle chart APIなどを使用するしかないでしょうか。

それとも全然違うやり方でもっと楽なやり方などがありましたら聞いてみたいです。
どうぞよろしくお願いいたします。

井原 真吾さん
cstapの落合です。

スペースフィールドを使ってはどうでしょう?

@落合さん

ご連絡ありがとうございます。
https://cybozudev.zendesk.com/hc/ja/articles/202982064
のようなイメージですかね。
この記事を参考に、同じアプリ(データなども含む)を作り、JSもコピーしたものをそのまま上げたのですが、
チャートが表示されません。

Chromeのデベロッパーツールでいろいろ確認しているのですが、エラーなどは出ておらず、
肝心のcanvas要素が

<div class=“spacer-cybozu” id=“user-js-Radar”><canvas id=“canvas” height=“0” width=“0” style=“width: 0px; height: 0px;”></canvas></div>

のように、何らかによってheightもwidthも0にされてしまっているようなのですが、
どこ原因でそうなっているのかが突き止められていない状態です。
※0pxになっているところをデベロッパーツールで無理やり300などに指定しても描画されず。

似たような問題他でも起こってるものでしょうか。
フォーラムで検索しても見つからず。。。