I will describe the problem. I want to connect javascript to display information. The view itself:

<script src= "https://cdn.zingchart.com/zingchart.min.js"></script> <h2> Топливная статистика байка <%= @bike.name %>, владелец <%= @bike.user_name %> </h2> <% get_stata_l_na_100_km %> //*получаю значение json из хелпера <div id='chartDivRashod'> <%= javascript_include_tag "fuel_chart" %> //*подгружаю JS-график из файла </div>

in the helper I am getting the @ json_stata_l_na_100_km variable in json-format, the helper itself:

  module StataFuelsHelper def get_stata_l_na_100_km @stata_graph = [] @view_stata_fuel.each do |stata| @stata_graph << (stata.refueling / (stata.odo_delta / 100)).round(2).to_f end @json_stata_l_na_100_km = @stata_graph.to_json end end

and the loadable javascript file itself fuel_chart.js with the ZingChart graph:

 var chartRashod = { type: "bar", // Specify your chart type here. "plot": { "value-box": { "text": "%node-value" } }, title: { text: "средний расход, л/100 км" // Adds a title to your chart }, legend: { "header": { "text": "байк" } }, // Creates an interactive legend "type": "bar", "scale-x": { "zooming": true }, "scale-y": { "zooming": false }, "preview": { "visible": true }, series: [ { text: "1", values: <%= JSON.parse(@json_stata_l_na_100_km) %> } ] }; zingchart.render({ // Render Method[3] id: "chartDivRashod", data: chartRashod, height: 400, width: 600 });

At startup, the console throws a script error SyntaxError: expected expression, got '<' values: <% = JSON.parse (@ json_stata_l_na_100_km)%>}. If you remove the <% =%> wrapper, it produces a SyntaxError: illegal character error, i.e. does not accept the string. But if I can not stand javascript code in a separate file and write it in the view, wrapped in a script ... / script - then the schedule works out with a bang without problems.

How to solve the problem, what am I doing wrong? Thank you in advance.

  • fuel_chart.js where is the project? - D-side
  • @ D-side, here /app/assets/javascripts/fuel_chart.js - Yar-ua

1 answer 1

Oh ... wrong you did about everything .

Assets are compiled before running in production and they are common to all. Putting there any data that may be different on different pages or may change after starting the server is meaningless. Want changing data - make a view. And it is better to have a separate code, and a separate data source in JSON, to which this code will refer.

ERB in asses is processed only if at the end of the name of the .erb file , for example, fuel_chart.js.erb .

<%= JSON.parse(@json_stata_l_na_100_km) %> will not give you valid JSON. This parses the string into the Ruby data structures. If you already have a designated data structure, you should not soar it, but rather dump it ( JSON.dump ).

  • and what should I write to get an array from JSON that can swallow the script? If instead of the line <% = JSON.parse (@ json_stata_l_na_100_km)%>, just write a numeric array to the script (for example [10, 20, 35, 40]), then the script picks up the value and the graph is drawn. If the whole script is not formed into a separate file and thrown into the view, everything works and the line <% = JSON.parse (@ json_stata_l_na_100_km)%> is parsed normally. I do not understand why it does not work in a separate script file .. ( - Yar-ua
  • @ Yar-ua this does not negate the fact that simply outputting Ruby values ​​does not guarantee JSON. And JSON.dump guarantees. - D-side
  • The problem is solved by removing the javascript graphics in the _graph_fuel_js.html.erb view. In the json variable, it was parsed without errors <% = JSON.parse (@ json_stata_l_na_100_km)%>. From the common view, I call the render with the transfer variable <% = render 'fuel_chart', locals: @ json_stata_l_na_100_km%> - Yar-ua