Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Get Highcharts width

I would like to get the current chart width, I have tried something like this:

chart.width

and

$(this).parent().width()

where chart is

chart = new Highcharts.Chart({ ... })

But doesn't work...

MORE INFO

I would like to place an image (a helper) at the left of the exports buttons (responsive).

For the moment I have the following code:

$(document).ready(function() {
     chart = new Highcharts.Chart({
        chart: {
            renderTo: 'area1',
            type: 'bar',
            events: {
                load: drawImages,

            }
         ...}
      })
    })

And

function drawImages() {
    var chart = this;
    x = chart.plotRight - 50

    chart.renderer.image('/assets/faq.png', x, 0, 20, 20)

    .attr({
        zIndex: 100,
        title: "My title for displaying a tooltip"
    })
    .css({
        cursor: 'pointer'
    })
    .add();   
    };

But the images appears at the left side of the chart (using plotRight).

I know how to get the width of the div container of the graph ("area1"), but I like to have code more Object Oriented (because I have at least 5 graphs per page).

like image 860
damoiser Avatar asked Apr 06 '13 09:04

damoiser


2 Answers

In chart object you have access to chartWidth parameter, which keeps width of chart.

http://jsfiddle.net/7xNQL/1/

//callback
    function(chart){

                console.log(chart.chartWidth);

            }
like image 133
Sebastian Bochan Avatar answered Dec 01 '22 08:12

Sebastian Bochan


Finally I have find a solution, using the method "container":

$(chart.container).width()

This returns the current width of the chart.

like image 42
damoiser Avatar answered Dec 01 '22 10:12

damoiser