簡體   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