Question

我正在使用Highchart创建Klipfolio Gantt图表。我能够使用Klipfolio的Html组件创建甘特图，但我在整合数据时遇到了问题。

Klipfolio HTML模板

<div id="container"></div>

<div id="title_text" style="display:none;">
{{each data}}
${$value.title}
{{/each}}
</div>

这会提取我需要的数据，并允许我将其添加到图表脚本中。

Javascript代码 - 数据

var title = $("#title_text");

此代码将数据添加到类别中。

部分Highchart脚本

   $('#container').highcharts({
        chart: {
            type: 'xrange'
        },
        title: {
            text: 'Highcharts X-range study'
        },
        xAxis: {
            type: 'datetime'
        },
        yAxis: {
            title: '',
            categories: [$(title).text()],
            min: 0,
            max: 2
        },

结果将所有数据添加为一个类别。实施例

Category 1 []
Category 2 []
Category 3 [data 1, data 2, data 3]

如何提取数据并将其分成单独的类别？

Category 1 [data 1]
Category 2 [data 2]
Category 3 [data 3]

Answer 1

Klipfolio实际上已经在我们的javascript图表库中使用了高图，所以你最好的选择是联系支持并提出要添加的甘特图类型的请求。通过html组件添加库可能会导致不可预测的结果。

那说明你的具体问题看起来你在一个类别中得到它的原因是$（“＃title_text”）包装了所有东西，为了解决这个问题你可以改变你的每一个看起来像这样： / p>

<div id="title_text" style="display:none;">
{{each data}}
   <div id="${$value.title}">${$value.title}</div>
{{/each}}
</div>

然后你会为每个人分配一个唯一的ID吗？

Klipfolio数据与Highchart Javascript

1 个答案: