ChartKick

Question

所以我正在显示一个柱形图，它沿x轴有日期，在y轴上有时间。

它显示构建时间，但有时构建失败（模型中的build_state可能是“成功”或“失败”）

我希望将成功的条形图显示为绿色，将失败的条形图显示为红色。

这就是我获取数据的方式：

@column_chart_result = @bamboo_results.pluck(:build_start_time,:build_duration_minutes)

然后创建图表：

<%= column_chart @column_chart_result, colors: ["green", "red"], width: "600px" %>

显然它将所有条形显示为绿色，我不确定如何添加逻辑以显示build_state并且成功为绿色并且失败为红色？

Answer 1

所有这一切都假设您正在使用Highcharts。我建议你使用Highcharts;这样做更复杂的事情会更容易一些：

这是您需要做的事情：

@column_chart_result = @bamboo_results.pluck(:build_start_time, :build_duration_minutes, :build_state)

# Take out the :build_state column for Highcharts:
@highcharts_data = @column_chart_result.map {|n| [n.first, n.second]}

# Build an array of colors
@highcharts_colors = @column_chart_result.map {|n| n.build_state == "Successful" ? "green" : "red" }

<%= column_chart @highcharts_data, colors: @highcharts_colors, width: "600px", library: {"plotOptions": {"series": {"colorByPoint": true }}} %>

我在自己的（不同的）数据集上测试了类似的方法。当然，我还没有在你的数据集上测试它。如果它出现错误或无法正常工作，请告诉我。