Highcharts drupal integration problem with drupal_to_js()

By robertgarrigos on 4 May 2011 at 15:16 UTC

I'm integrating highcharts (http://www.highcharts.com) for a client and found a problem related to the way drupal adds js code. I use drupal_add_js() function to add the javascript into the head of the web page. This is ok.

The problem comes when the code passed through the drupal_add_js() function is not just an array of strings or integers but also contains some javascript code or even html. Then, the drupal_to_js() function, called during that process, sanitizes the code. My question is if someone, who could have been in this trouble, found a solution.

Thank you.

Comments

What does your code look

nevets commented 4 May 2011 at 15:33

What does your code look like, are you using the 'inline' option?

No, setting. the code

robertgarrigos commented 5 May 2011 at 11:48

No, setting.

the code includes an array like this:

"plotOptions" => array(
      "series" => array(
        "cursor" => "pointer",
        "point" => array(
          "events" => array(
            "click" => "function() {
              location.href = this.options.url; 
              }",
          ),
        ),
      ),
    ),

and then passed through the drupal_add_js() function with the 'setting' param.

Using $opts =

nevets commented 5 May 2011 at 15:32

Using

	$opts = array(
"plotOptions" => array(
      "series" => array(
        "cursor" => "pointer",
        "point" => array(
          "events" => array(
            "click" => "function() {
              location.href = this.options.url;
              }",
          ),
        ),
      ),
    ),
   );
   drupal_add_js($opts, 'setting');

it does what I expect, I am guessing the problem is which the click function.

You could write that as "click" => "function() { location.href = this.options.url; }",
or I would define the function outside the setting in .js file and set click to the function name.

Found the problem: highcharts

robertgarrigos commented 11 May 2011 at 13:21

Found the problem: highcharts javascript object doesn't wrap the function() element with quotes, which drupal does with every string passed through drupal_add_js() function. The only solution I've found is by hacking core :-(

Hi Robert, I'd be grateful if

kreutzer commented 19 August 2011 at 00:10

Hi Robert,

I'd be grateful if you could please tell me what exactly you did to "hack the core" in order to enable the highcharts.js to work.

thanks.
Madhav

Hello Sir, I also want to

sumitmadan commented 26 March 2012 at 08:41

Hello Sir, I also want to know how to do it.Please tell me?

Thanks,
Sumit Madan

hacking the core is not a

robertgarrigos commented 26 March 2012 at 11:07

hacking the core is not a good idea, but you can, of course, change the way drupal_to_js() function filters your code. This was my first solution. However, I finally found a better way of sorting this out: instead of having drupal to create a js code on the fly, create a new js file which collects your data sent by drupal. You can, then, hardcode the problematic code within the js file.