0

div 出现在 HTML 中,而 javascript 也出现在源代码中......知道为什么我仍然在页面上看不到任何东西吗?

注意:在控制台中手动运行 js 会使图表渲染得很好

看法:

<%= high_chart("some_id", @chart) %>

控制器:

@chart = LazyHighCharts::HighChart.new('graph') do |f|
  f.title(:text => "Population vs GDP For 5 Big Countries [2009]")
  f.xAxis(:categories => ["United States", "Japan", "China", "Germany", "France"])
  f.series(:name => "GDP in Billions", :yAxis => 0, :data => [14119, 5068, 4985, 3339, 2656])
  f.series(:name => "Population in Millions", :yAxis => 1, :data => [310, 127, 1340, 81, 65])

  f.yAxis [
    {:title => {:text => "GDP in Billions", :margin => 70} },
    {:title => {:text => "Population in Millions"}, :opposite => true},
  ]

  f.legend(:align => 'right', :verticalAlign => 'top', :y => 75, :x => -50, :layout => 'vertical',)
  f.chart({:defaultSeriesType=>"column"})
end

页面视图中的结果:

<script type="text/javascript">
(function() {
  var onload = window.onload;
  window.onload = function(){
    if (typeof onload == "function") onload();
            var options = { "title": { "text": "Population vs GDP For 5 Big Countries [2009]" },"legend": { "align": "right","verticalAlign": "top","y": 75,"x": -50,"layout": "vertical" },"xAxis": { "categories": [ "United States","Japan","China","Germany","France" ] },"yAxis": [ { "title": { "text": "GDP in Billions","margin": 70 } },{ "title": { "text": "Population in Millions" },"opposite": true } ],"tooltip": { "enabled": true },"credits": { "enabled": false },"plotOptions": { "areaspline": {  } },"chart": { "defaultSeriesType": "column","renderTo": "some_id" },"subtitle": {  },"series": [{ "name": "GDP in Billions","yAxis": 0,"data": [ 14119,5068,4985,3339,2656 ] },{ "name": "Population in Millions","yAxis": 1,"data": [ 310,127,1340,81,65 ] }] };

window.chart_some_id = new Highcharts.Chart(options);

  };
})()
</script>
<div id="some_id"></div>
4

0 回答 0