Как изменить значение переменной Javascript с помощью интерактивной ссылки в Ruby on Rails - PullRequest
0 голосов
/ 18 октября 2019

Я использую 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(/&quot;/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, так что это немного другое. Я пытался найти много примеров и понять, что происходит. Вещи просто сбивают с толку.

...