Question

I have the following code:

assets/javascript/activities.js.coffee

jQuery ->
    graph = new Highcharts.Chart
        chart: 
            renderTo: "activity_graph"
            type: 'column'

        exporting:
            buttons:
                printButton:
                    enabled: true   
....

assets/javascript/activity_groups.js.coffee

jQuery -> 
    $('ul').children('ul').hide()

The activity_group file does not work if I have new Highcharts.Chart in my activities file. If I comment new Highcharts.Chart it works fine. Both files load properly. Why does this happen?

[Edit1]

I was playing around I also noticed that If I place $('ul').children('ul').hide() before graph = new Highcharts.Chart it also works as expected. I don’t want to place it in the same file though and I don’t want to have to place it in front of the graph variable necessarily.

[Edit2]

Found one error why I assume it is not working. I am not very knowledgable with javascript.
Uncaught Highcharts error #13:

Highcharts Error #13

Rendering div not found

This error occurs if the chart.renderTo option is misconfugured so that Highcharts is unable to find the HTML element to render the chart in.

My markup only contains the activity_graph div where I need it( In my activities show view). It is not included anywhere else. That is why I assume I am getting this error. I don’t want to use it anywhere else though… Any thoughts?

[Edit3]

This is the markup that I am generating with rails:

= content_tag :div, "", id: "activity_graph", data: {name: graph.name, minutes: graph.minutes, year: graph.year, month: graph.month, day: graph.day, data_hash: graph.data_hash}

I get my div with id activity_graph and the graph is displayed without problems. The error doesn’t pop up when I am on this page… However If I navigate on a different page then the error pops up because I don’t have this div and the id anymore…

Answer 1

I ended up putting a conditional. Only if the div element exists I should renderTo. The error disappeared when I did this.