1

Does anyone know if it's possible to use a Jquery.clone(); function on a Flot chart?

var $clonedChart = $this.find('.chart-area').clone();
$('#details').append($clonedChart);

Basically, I just want to clone a chart and use it in a modal window when the user looks at a "detail view". I can see the canvas, but unfortunately, the contents of the canvas are not rendered. Is there a way I can get them to show up? I assume I am going to need to do some fancy deep clone to grab the plugin as well, and then rerender the graph? I was hoping to avoid that but am not sure it's possible...

Thanks!

gabaum10
  • 3,769
  • 3
  • 48
  • 89

2 Answers2

1

clone() is not going to replicate all the event handlers, you're better off packing your code that calls $.flot into a method and calling that again when you need to display it somewhere else.

Ruan Mendes
  • 90,375
  • 31
  • 153
  • 217
0

If the chart is not interactive, you should propably just clone the canvas without worrying about the Flot plugin.

function cloneCanvas(oldCanvas) {

    //create a new canvas
    var newCanvas = document.createElement('canvas');
    var context = newCanvas.getContext('2d');

    //apply the old canvas to the new one
    context.drawImage(oldCanvas, 0, 0);

    //return the new canvas
    return newCanvas;
}

Code copied from another SO question

Community
  • 1
  • 1
lalibi
  • 3,057
  • 3
  • 33
  • 41
  • I just need a way to capture the whole chart and append it to another view. I don't want to have to rerender the whole thing... – gabaum10 Apr 24 '12 at 17:37
  • Alright, I couldn't come up with a better solution, so I ended up just rerendering the graphs in new divs and appending them. I am not going to close this just yet, someone may have a nice solution. If not I will give you marks for this. Thanks! – gabaum10 Apr 24 '12 at 17:55
  • I hope you find a more elegant solution, but some tests I did - about cloning a canvas - failed. The above may be indeed your only option. – lalibi Apr 24 '12 at 18:01
  • Yeah, that's beginning to think that's the case. Perhaps as this becomes more and more common, the Jquery boys will implement some sort of clone that would work for the canvas. Until then, this will have to do... Thanks! – gabaum10 Apr 24 '12 at 18:30