Chartkick 柱形图多种颜色答案

【问题标题】：Chartkick column charts multiple colorsChartkick 柱形图多种颜色
【发布时间】：2014-12-23 08:00:04
【问题描述】：

我在我的 RoR 项目中使用chartckick 来生成图表，效果很好。（连同谷歌图表）。

我创建了一个column chart，只有 2 个条形（男性和女性）。

现在客户希望每个条有不同的颜色？这可能吗？

我看过这篇文章 - How to change the color of a Column-chart created with Chartkick?，但它已经有半年多了，我希望现在有一种方法可以为条形指定更多颜色。

更新

我的代码如下：

控制器

@followers_gender_count = Project.find(params[:id]).followers.group(:gender).count

查看

<%= column_chart parse_gender_data(@followers_gender_count) %>

助手

def parse_gender_data(data)
  gender_data = Hash.new
  gender_data[:male] = data[1]
  gender_data[:female] = data[2]
  ({ 'Male' => gender_data[:male], 'Female' => gender_data[:female] })
end

更新 2 - Issue on GitHub

【问题讨论】：

标签： ruby-on-rails chartkick

【解决方案1】：

以下也有效。我不需要初始化程序中的任何新文件（没有 chartkick.rb 文件），只需将以下代码添加到我的帮助文件中即可：

  def networth_data
    [
      {name: "Assets", data: {"NetWorth": 6979.53}}, 
      {name: "Liabilities", data: {"NetWorth": 10532.32}}
    ]
  end

然后在我的 html.erb 中，我指定了我想要的颜色和其他选项：

<%= column_chart networth_data, 
  colors: ["green", "#FF0000"], 
  library: {backgroundColor: "#FFF", height: 265} %>

...渲染此图表：

【讨论】：

【解决方案2】：

从 @buren's comment on GitHub 看来，使用不同的 JSON 结构会在 column_cart 上调用不同的颜色。

我更改了Helper中的输出：

def parse_gender_data(data)
  gender_data = Hash.new
  gender_data[:male] = data[1]
  gender_data[:female] = data[2]
  [{"name" => "Male","data" => {"Gender" => gender_data[:male]}},{"name" => "Female","data" => {"Gender" => gender_data[:female]}}]
end

并创建了chartkick.rb config 文件 (config/initializers/chartkick.rb)，添加了一些颜色：

Chartkick.options = {
  colors: ["#63b598", "#ce7d78", "#ea9e70", "#a48a9e", "#c6e1e8"]
}

输出期望的结果：

【讨论】：

【解决方案3】：

你见过ColumnStyles

   function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ['Year', 'Visitations', { role: 'style' } ],
        ['2010', 10, 'color: gray'],
        ['2010', 14, 'color: #76A7FA'],
        ['2020', 16, 'opacity: 0.2'],
        ['2040', 22, 'stroke-color: #703593; stroke-width: 4; fill-color: #C5A5CF'],
        ['2040', 28, 'stroke-color: #871B47; stroke-opacity: 0.6; stroke-width: 8; fill-color: #BC5679; fill-opacity: 0.2']
      ]);

但是看看链接，那里有一些非常酷的东西

【讨论】：

如何在 ruby 中应用该代码？我已经用我的代码更新了 OP。
@Vucko 你在哪里有你想要使用的颜色或样式的设置？
@Vucko 看看github.com/ankane/chartkick/blob/master/lib/chartkick/helper.rb 第 (15-17) 行，你可以看到它需要 2 个参数 data_source 和 options 作为哈希，所以你可以这样做 <%= column_chart parse_gender_data(@followers_gender_count, style_hash) %>
我试过这样comment on github，但它不起作用。另外，我尝试过[['Male', 23, 'color:red'], ['Female', 123, 'color:green']]，但它也不起作用。你能做一个有效的例子/小提琴吗？