AmChartsガント・セグメントに進行状況バーを表示する方法は？

Question

AmCharts Ganttのタスクセグメント内の緑色のバーを使用して、タスクセグメントの進捗状況（ここではhttp://www.officetooltips.com/excel/tips/gantt_chart_with_progress.html）を表示したいとします。今私はhttp://www.amcharts.com/tips/using-bullets-gantt-chart/に示されているように弾丸を使用していますが、やや難解なアプローチです。

また、AmChartのaddClassNamesプロパティとAmGraphのclassNameFieldを使用してgraph-column-elementのカスタムクラス名を追加しようとしましたが、動作しません。 Ganttのドキュメントには、Ganttタスクセグメントhttps://www.amcharts.com/tutorials/css-class-names/のカスタムクラスプレフィックスはないと書かれています。

Answer 1

私はあなたが要求しているものを決定できません。おそらく、この例が役に立ちます。

• http://jsfiddle.net/13jbrn2e/1/

まず、amChartsは、ガントチャートのためのいくつかのCSSの制御を可能にしません。あなたの質問で指し示している例は古い投稿です。私はAPIが更新されたと思います。 addClassNamesを使用できるはずです。チャートの設定で

• https://docs.amcharts.com/3/javascriptcharts/AmGanttChart#addClassNames

...

var chart = AmCharts.makeChart("chartdiv", { 
    "type": "gantt", 
    "theme": "light", 
    "marginRight": 70, 
    "addClassNames": true, 

CSSクラス名をキャッチするには、ブラウザのDOMインスペクタを使用しますが追加されました。

これは、あなたのCSSでこれを行うことができることを意味：

.amcharts-graph-column-element { 
    stroke-width: 1; 
    stroke: green; 
} 

あなたはこれに似た、あなたのセグメントを設定した場合、（申し訳ありませんが、これは正確なフィット感ではありませんamChartsのガント例からフォークダミーデータであり、私はあなたのデータのために確信しています）...

}, { 
    "category": "Smith", 
    "segments": [ { 
     "start": 10, 
     "duration": 8, 
     "color": "#29a329", 
     "task": "Task #2" 
    }, { 
     "duration": 1, 
     "color": "#ebfaeb", 
     "task": "Task #2" 
    } ] 
}, { 

...あなたが共有リンクで多少一致しているようです。このように見えるのチャートを、持ってしまう可能性があります。