LoginSignup
3
3

More than 5 years have passed since last update.

Rails環境でのhighstock利用

Posted at

Rails環境でのhighstock利用

以下のサイトを参考にhighstockをRailsの環境に適用しようとしたときにハマった話。

/app/assets/javascriptsにhighstockt.js,chart.jsを配置して、
application.jsに

<%= javascript_include_tag "application" %>

と記載して、アセットパイプラインを利用して、highstock.jsを呼び出すと、以下のjavascriptエラーとなります。

Uncaught TypeError: $(...).highcharts is not a function

生成されたソースコードを確認しても、問題なくjavascriptファイルは読み込まれいるようですが、
なぜかhighstockが見つからないと。。。

ちなみに、アセットパイプラインを使わずにscriptタグでjsファイルを指定してやると、エラーなく利用可能です。

解決方法

アセットパイプラインを使ってhighstockを利用する場合は、以下を参考にchart生成すると利用できました。

具体的にはchart生成の記述を


chart.js
        // create the chart
        $('#container').
        highcharts('StockChart', {
            credits : {// 右下のクレジット
                enabled : false
            },
            
            
            

chart.js
        // create the chart
        window.chart = new Highcharts.StockChart({
            chart : {
                renderTo : $('#container')[0]
            },
            credits : {// 右下のクレジット
                enabled : false
            },
            
            
            

とrenderToをつけて呼び出せばOKです。

これでアセットパイプラインを利用して、問題なく、highstockが利用できました。

しかし、なぜアセットパイプラインを利用すると、jsの読み込みの挙動が変わるのか。。。これはよく理解できてないです。
もしわかる方いたら教えてください。

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3