繁体   English   中英

Rails HightCharts添加link_to

[英]Rails HightCharts adding link_to

我正在使用highcharts生成条形图,下面是从视图中生成有关OS版本列表数据的代码(x轴[ubuntu12.04,red hat 6.5]和y轴[10,20])我的要求是在x轴上为每个值添加一个link_to,单击时我需要将它们重定向到其他页面,该页面应显示与他们单击的OS版本相关的值列表。

<% os_name = "" %>
<% data_value = "" %>


<% @linux_count.each do |linux| %>
<% if linux.os = 'linux' %>
<% os_name << "'#{linux.platform.humanize} #{linux.platform_version}', " %>
<% data_value << " #{linux.Total.to_i}," %>
<% end %>
<% end %>


<% @win_count.each do |win| %>
 <% if win.os = 'windows' %>
 <% os_name << "'#{win.kernel_name}', " %>
 <% data_value << " #{win.Total.to_i}," %>
<% end %>
<div id="container04" style="width:550px; height:400px;"></div>
<script>

   $(function () {
// Set up the chart
   var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container04',
        type: 'column',
        margin: 75,
        options3d: {
            enabled: true,
            alpha: 4,
            beta: 4,
            depth: 50,
            viewDistance: 25
        }
    },
    title: {
        text: 'OS by Platform/Version'
    },
    subtitle: {
        text: 'Limited to Chef Data'
    },
    xAxis: {
        categories: [ <%= raw os_name %>  ]
    },
    yAxis: {
        title: {
            text: 'Instance Count'
        }
    },
    plotOptions: {
        column: {
            depth: 25
        }
    },
    series: [{
         name: [ 'Node Count by OS' ],
        data: [ <%= raw data_value %> ]
    }]
});


// Activate the sliders
$('#R0').on('change', function(){
    chart.options.chart.options3d.alpha = this.value;
    showValues();
    chart.redraw(false);
});
$('#R1').on('change', function(){
    chart.options.chart.options3d.beta = this.value;
    showValues();
    chart.redraw(false);
});

  function showValues() {
    $('#R0-value').html(chart.options.chart.options3d.alpha);
    $('#R1-value').html(chart.options.chart.options3d.beta);
  }
  showValues();
 });

 </script>

您可以使用自定义事件插件,该插件可为标签添加事件。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM