I'm experiencing a bizarre error related to displaying a highcharts chart in a quick tab in a panels page variant. Google charts work fine and placing the highchart directly in the panel pane without quicktabs also works fine.

The chart displays fine, but when attempting to edit the panel (either through the contextual link or at admin/structure/pages/edit/node_view), panels seems to be trying to render the tabs in the admin interface which results in a broken page and the panel is no longer editable. The only way to get control back, is to edit the view and change the display to something other than a highchart chart (google charts work).

The error received is a generic js error:

  "SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 1 column 7 of the JSON data"

Modules/Versions
------------------------
Charts 7.x-2.x-dev
Core Drupal 7.36
Ctools 7.x-1.x-dev
Libraries 7.x-2.x-dev
Panels 7.x-3.x-dev
Quicktabs 7.x-3.x-dev
Views 7.x-3.x-dev

I receive the same behavior both with and without jquery_update installed, so I've left it out of the equation for now.

Steps to reproduce:

1. download and enable all modules
2. download the highcharts libary and place in sites/all/libraries/highcharts
3. add the chart_demo view "column chart" display (provided by the charts module) to a quicktab instance
4. create a basic page
5. create a panel page variant for overriding basic pages
6. add the quicktab instance to a pane and save
7. view the page created in step 4 and note that it displays correctly (google charts is the default)
8. attempt to edit the panel (either with the contextual link or via the admin menu) and notice it works correctly.
9. edit the chart_demo view "column chart" display and change the Chart library setting to "highcharts"
10. view the page and note that it displays correctly.
11. attempt to edit the view and note that page is broken and it seems like the quicktab is being rendered into the edit interface.
12. note the js error in the console

Based on the error message, I tracked it down to a call to parseJson in charts_highcharts.js. Wrapping it in a try/catch kills the rendering of the chart in the panels admin interface and allows normal editing of panels pages.

I have no idea why google charts works fine and highcharts doesn't, but i've spent a day on this and need to move on.

try/catch isn't necessarily a bad idea there, but it's really treating the symptom and not the cause. I'm just posting this here to hopefully save someone else hours of headbanging.

Patch to follow.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

WorldFallz’s picture

WorldFallz’s picture

Issue summary: View changes
SocialNicheGuru’s picture

Status: Active » Needs review
samuel.seide’s picture

I can confirm that this patch works to "fix" the problem. Had this same issue with panelizer breaking and it fixes that.

rami.sedhom’s picture

The batch in https://www.drupal.org/project/charts/issues/2483221#comment-9892539 resolves the issue. How to make it part of the next release?