我可以使用 chartkick 的图表链接到其他 URL 吗？答案

【问题标题】：Can I link to other URL's using chartkick's charts?我可以使用 chartkick 的图表链接到其他 URL 吗？
【发布时间】：2014-03-26 22:11:28
【问题描述】：

我有一个 rails 4 应用程序，我正在使用 chartkick。我目前正在使用饼图，我想知道是否有一种方法可以让我的饼图的每个部分导航到端点或 URL 或其他任何东西。

有人会如何解决这个问题？它会在 ERB 文件中完成，还是在控制器中完成？又是怎么做的？

【问题讨论】：

标签： ruby-on-rails ruby-on-rails-4 google-visualization chartkick

【解决方案1】：

我花了很多时间试图自己解决这个问题。不幸的是，似乎没有简单的“在此处添加链接并开始”之类的选项。

Chartkick 允许您指定是要使用 Google 图表库还是 Highcharts 库。这两个库都允许您绘制图表，您可以在其中指定特定数据点/数据系列的“单击”操作。要利用这一点，您可以使用直接的 JQuery/JS 绘制图表——如果您只习惯于标准的 chartkick 东西，这比看起来容易得多。

这里是 HighCharts 文档： http://api.highcharts.com/highcharts#plotOptions.pie.events.click

这是一篇很棒的博客文章，展示了如何设置 JS/Jquery（您可以使用 http://js2.coffee 将其转换为 Coffescript 非常简单） http://birdchan.com/home/2012/09/07/highcharts-pie-charts-can-have-url-links/

他的方法效果很好，而且，您可以通过在资源的控制器上创建一个端点来提供图表所需的数据哈希，从而更轻松地替换：

data: [
            {name: 'Not Tested', color: '#FFA850', y: 87, url: 'http://my_site1.com'},
            {name: 'Fail', color: '#FF2929', y: 2, url: 'http://my_site2.com'},
            {name: 'Pass', color: '#31FF4F', y: 32, url: 'http://my_site3.com'}
        ]

类似的东西：

$.ajax {
url: "/place/resources/resource_id/top_members.json"
success: (data) ->
  draw_some_pie_chart(data)
}

或者您也可以使用 GON gem 将该哈希值作为变量在您的 Coffeescript/JS 文件中使用。

我确信有更具体/更彻底的方式来回答您的问题。如果您想发布您尝试使用的代码示例，我可以更新我的答案

【讨论】：