2017-07-30 1 views
0

私はアドバイスを求めます。 Googleのチャートは、最初の試みでは必ずしも読み込まれていません...この問題を解決するには?Googleチャートが最初の試行で必ずしも読み込まれるとは限りません

demo

ビュー:

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
<script type="text/javascript"> 
    google.charts.load('current', {'packages':['corechart']}); 
    google.charts.setOnLoadCallback(drawChart); 
    function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
     ['Time', 'TempC'], 
    <% @data.css("hourly").each do |hrly| %>  
    ['<%= hrly.css("time").text %>',<%= hrly.css("tempC").text %>], 
    <% end %> 
    ]); 
    var options = { 
     title: 'Temperature forecast' 
    }; 
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); 
    chart.draw(data, options); 
    } 
</script> 
<div id="chart_div" style="width: 100%; height: auto;"></div> 

コントローラ

class WwoController < ApplicationController 
def weather 
require 'nokogiri' 

url = "https://api.worldweatheronline.com/premium/v1/weather.ashx?q=59.94%2C30.31&num_of_days=4&key=***********************************" 
@data = Nokogiri::XML(open(url)) 

end 
end 

答えて

0

あなたがturbolinksを使用している場合は、そのページでそれを無効にしよう、私は

をGoogleマップと同様の問題をAPISしているので、

ターボリンクを無効にすると、これをアプリに追加できます

<body <%= yield(:body_attributes) %>> 

lication.html.erb、あなたのview.html.erbであなたがレールを使用している場合、最初の行に

<%= content_for(:body_attributes, 'data-no-turbolink') %> 

これを追加するには、またのlink_to

<%= link_to 'link_name', your_link_path, 'data-no-turbolink' => true %> 

でturbolink無効にすることができます/ turbolinks 5 data-no-turbolinkdata-turbolinksに変更し、ブール値を変更します。

また、JavaScriptを底に置こうとします。 html domの後にロードするようにします。

+0

ありがとうございます。やったよ。しかし、これは私の場合は機能しません。たぶん私はgem googlechartsを使用していたはずですか?または、私はハイチャートを試す必要があります... – Boris

+0

あなたのスクリプトを一番下に置き、あなたのdivを一番上に置こうとします。 – icemelt

+0

解決済み: %link_to 'link_name'、your_link_path、data:{turbolinks: 'false'}%> $ rails version - > Rails 5.1.2 – Boris

関連する問題