Я использую GeoChart
из Google API
для представления списка countries
и их populations
на цветном heat map
. В настоящее время у меня есть настройка меню, в которой есть ссылка на таблицу данных о стране, карта мира с GeoChart
, и у меня есть несколько пустых ссылок для континентов. Проблема, с которой я сталкиваюсь, заключается в том, что мне нужно изменить код региона, когда я нажимаю на одну из этих ссылок континента, так что GeoChart
увеличивает масштаб на правильном континенте, и я не могу понять, какой метод подходитСделай так. Мне нужен какой-то способ обновить карту и изменить значение переменной, определяющей, на какой регион карта смотрит, нажав ссылку или кнопку. API изменяет регион, изменяя значение региона переменной options в коде, который я имею в моем домашнем индексе.
Я попытался создать переменную экземпляра в контроллере с кодом региона по умолчанию, затемиспользуя link_to, чтобы перенаправить обратно к тому же индексу и каким-то образом обновить значение переменной экземпляра, но я не уверен, что это вообще возможно.
home_controller.rb
require 'json'
require 'net/http'
require 'pp'
class HomeController < ApplicationController
def index
@region_code = 'world'
url = 'http://localhost:3000/continents.json'
uri = URI(url)
response = Net::HTTP.get(uri)
jsondata = JSON.parse(response)
@countrydata = Array({"Country" => "Population"})
for i in 0..(jsondata.length-1) do
@countrydata.push([jsondata[i]["Country"], jsondata[i]["Population"]*1000])
end
end
end
layouts / _menu.html.erb
<div class="header">
<%=link_to image_tag("logo.jpg", :alt =>"World energy analysis", style:"height: 120px; width: 140px;"), "/"%>
<h1>World Energy Analysis</h1>
</div>
<br>
| <%=link_to 'Global Data', continents_path %> | <%=link_to 'World Map', home_index_path%> | <%=link_to 'Africa', home_index_path(@region_code = '002') %> | North America | Europe | Latin America | Middle East | Australasia | </p>
home/index.html.erb
<p id="notice"><%= notice %></p>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {
'packages':['geochart'],'mapsApiKey': 'AIzaSyDIQFAz4aYXsAg6IMs6l2Fj6aiXv_3uT2M'
});
google.charts.setOnLoadCallback(drawRegionsMap);
var countrydata = JSON.parse('<%= @countrydata %>'.replace(/"/g,'"'));
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable(countrydata);
var options = {
region: '<%= @region_code %>'
};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="regions_div" style="width: 900px; height: 500px;"></div>
</body>
Так как этот код будет отображать GeoChart на моей странице «Карта мира», но когда я нажимаю на ссылку «Африка», она ничего не показываетчто я ожидаю.
Буду признателен за любую помощь, я немного новичок в Ruby on Rails
, и мой опыт в основном с Java programming
, так что это немного другое. Я пытался найти много примеров и понять, что происходит. Вещи просто сбивают с толку.