Highcharts 不适用于 Heroku 环境,适用于本地环境
Highcharts not working on Heroku environment, works on local environment
我正在使用通过 Highcharts 创建的图表。它们在我的本地开发环境中运行良好,但在 Heroku 上没有显示图表。 div 是空的:
<div id="dashboard_chart_75"></div>
我正在使用 lazy_high_charts gem 这是我的 application.js
:
//= require jquery
//= require jquery_ujs
//= require bootstrap-sprockets
//= require general.js.erb
//= require_tree .
//= require turbolinks
//= require highcharts/highcharts
//= require highcharts/highcharts-more
//= require social-share-button
//= require ckeditor-jquery
这是生成图表的代码:
spider_chart = LazyHighCharts::HighChart.new('graph') do |f|
f.chart(polar: true, type: 'line', height: @height)
f.pane(size: @size)
f.colors(['#C41D21','#1c77bb'])
f.xAxis(
categories: categories.map{ |c| [@survey.id,c.id, c.name] },
tickmarkPlacement: 'on',
lineWidth: 0,
labels: {
style: {
fontSize: '12px',
weight: 'bold',
width: '100%'
},
formatter: %|function() {return '<a href="' + window.location.hostname + '/dashboards/spiders?level=2&survey_id=' + this.value[0] + '&category_id=' + this.value[1] + '">' + this.value[2] + '</a>';}|.js_code }
)
f.yAxis(gridLineInterpolation: 'polygon', lineWidth: 0, min: 0, max: 10,tickInterval: 1, tickWidth: 20)
f.tooltip(enabled: false)
f.series(name: "Gemiddelde van gewenste score", data: norm_scores, pointPlacement: 'on')
f.series(name: "Gemiddelde van huidige score", data: current_scores, pointPlacement: 'on')
f.legend(enabled: @legend, align: 'center', verticalAlign: 'top', y: 10, layout: 'vertical')
end
在生产环境中,我在控制台中看到此错误:
Uncaught ReferenceError: Highcharts is not defined at window.onload
指的是这一行:
window.chart_spider_chart = new Highcharts.Chart(options);
这可能是什么原因?
您似乎确实遇到了一个简单的资产版本控制问题,没有理由让 highcharts 在生产中表现不同。
尝试清除您的资产并强制使用以下方法进行预编译:
$ bundle exec rake assets:clobber
$ RAILS_ENV=production bundle exec rake assets:precompile
然后,添加并提交您的 public/assets
文件夹以推送到 Heroku。我 运行 遇到了很多麻烦,相信部署预编译会按预期工作。有时编译资产会出现错误,您需要在预编译之前更改文件才能感知更改。
如果还是不行
您可能在生产中遇到 gem 的问题,也许它在 gem 文件中的开发块内,甚至可能 =// require_tree .
或任何其他可能需要在 highcharts lib 初始化之前插入该代码,弄乱脚本的顺序会有所帮助(即使您粘贴的代码没有反映出这一点)
尝试在 public
目录中寻找 .sprockets-manifest
文件,找到后将其删除(这是一个隐藏文件)。如果您在本地编译资产并意外提交了该文件,它可能会阻止在 Heroku 上进行资产编译。
您还可以尝试通过提升 config/production.rb
中的资产版本来强制重新编译 Heroku 资产。 I.E 将 config.assets.version = 1.0
更改为 1.1
然后推送。
我正在使用通过 Highcharts 创建的图表。它们在我的本地开发环境中运行良好,但在 Heroku 上没有显示图表。 div 是空的:
<div id="dashboard_chart_75"></div>
我正在使用 lazy_high_charts gem 这是我的 application.js
:
//= require jquery
//= require jquery_ujs
//= require bootstrap-sprockets
//= require general.js.erb
//= require_tree .
//= require turbolinks
//= require highcharts/highcharts
//= require highcharts/highcharts-more
//= require social-share-button
//= require ckeditor-jquery
这是生成图表的代码:
spider_chart = LazyHighCharts::HighChart.new('graph') do |f|
f.chart(polar: true, type: 'line', height: @height)
f.pane(size: @size)
f.colors(['#C41D21','#1c77bb'])
f.xAxis(
categories: categories.map{ |c| [@survey.id,c.id, c.name] },
tickmarkPlacement: 'on',
lineWidth: 0,
labels: {
style: {
fontSize: '12px',
weight: 'bold',
width: '100%'
},
formatter: %|function() {return '<a href="' + window.location.hostname + '/dashboards/spiders?level=2&survey_id=' + this.value[0] + '&category_id=' + this.value[1] + '">' + this.value[2] + '</a>';}|.js_code }
)
f.yAxis(gridLineInterpolation: 'polygon', lineWidth: 0, min: 0, max: 10,tickInterval: 1, tickWidth: 20)
f.tooltip(enabled: false)
f.series(name: "Gemiddelde van gewenste score", data: norm_scores, pointPlacement: 'on')
f.series(name: "Gemiddelde van huidige score", data: current_scores, pointPlacement: 'on')
f.legend(enabled: @legend, align: 'center', verticalAlign: 'top', y: 10, layout: 'vertical')
end
在生产环境中,我在控制台中看到此错误:
Uncaught ReferenceError: Highcharts is not defined at window.onload
指的是这一行:
window.chart_spider_chart = new Highcharts.Chart(options);
这可能是什么原因?
您似乎确实遇到了一个简单的资产版本控制问题,没有理由让 highcharts 在生产中表现不同。
尝试清除您的资产并强制使用以下方法进行预编译:
$ bundle exec rake assets:clobber
$ RAILS_ENV=production bundle exec rake assets:precompile
然后,添加并提交您的 public/assets
文件夹以推送到 Heroku。我 运行 遇到了很多麻烦,相信部署预编译会按预期工作。有时编译资产会出现错误,您需要在预编译之前更改文件才能感知更改。
如果还是不行
您可能在生产中遇到 gem 的问题,也许它在 gem 文件中的开发块内,甚至可能 =// require_tree .
或任何其他可能需要在 highcharts lib 初始化之前插入该代码,弄乱脚本的顺序会有所帮助(即使您粘贴的代码没有反映出这一点)
尝试在 public
目录中寻找 .sprockets-manifest
文件,找到后将其删除(这是一个隐藏文件)。如果您在本地编译资产并意外提交了该文件,它可能会阻止在 Heroku 上进行资产编译。
您还可以尝试通过提升 config/production.rb
中的资产版本来强制重新编译 Heroku 资产。 I.E 将 config.assets.version = 1.0
更改为 1.1
然后推送。