Demo - Export a Dygraph as a (PNG) image

[Juan Manuel Caicedo]

Hello,

I wrote a simple function for exporting dygraphs as images.

It just wraps the plot canvas in a new one and adds the axes and the
legend to it; then, it uses the toDataURL() method to copy the
serialized image to an IMG object, and that's it!. Now you have an
image that you can easily save to a file with your browser.

Here is a simple demo that I wrote:

http://cavorite.com/labs/js/dygraphs-export/

(It works on Firefox and Chrome. I have not tested it in other
browsers).

Do you think that this could be a good feature for Dygraph? If so, I
would be happy to improve the code, fix the current limitations and
also write some tests.

Feel free to send me your questions or comments.

Cheers,

Juan Manuel Caicedo

[Deejam :)]

Good work Juan Manuel Caicedo,

It works fine in Google chrome. In firefox 4, I got the following
error
An invalid or illegal string was specified" code: "12
[Break On This Error] ctx.fillText(divLabel.textContent,
left, top);

[Robert Konigsberg]

Ooh, very nice.

The font isn't rendering well on Chome/Mac. See http://i.imgur.com/OFqSv.png for a screenshot.

--

Robert Konigsberg | Google NY | http://go/monarch | 212-565-9360

[Dan Vanderkam]

This is very cool!

I haven't looked at the implementation, but one issue you'll likely run into is that you can't apply CSS classes to text on the canvas. This would make it difficult to render charts like http://dygraphs.com/tests/styled-chart-labels.html.

This is a frequently requested feature, though, so I'd be happy to include it in some form. Maybe in a dygraph-extras.js file?

  - dan

[Joshua Buss]

I think many, many people would love a built-in 'right click, save as PNG' option if it's feasible.

-Josh

[Robert Konigsberg]

I would very much want to turn off a right-click option, but would love to access that API programmatically.

[Juan Manuel Caicedo]

Thanks for your feedback. It looks like my quick hack might be useful,
so I'm going to keep working on it.

Regarding the CSS styles, one option is to detect the applied styles
and try to replicate them in the canvas texts. For the time being I'll
focus only on the font properties (face, size and color), and then
I'll see if I can apply the other effects shown in the example.

I'll also have a look at the error in Firefox and the font rendering
problems in Mac and I'll keep you posted on any updates.

On May 31, 4:35 pm, Robert Konigsberg <konigsb...@google.com> wrote:
> I would very much want to turn off a right-click option, but would love to
> access that API programmatically.
>
>
>
>
>
>
>
>
>
> On Tue, May 31, 2011 at 10:59 AM, Joshua Buss <joshua.b...@gmail.com> wrote:
> > I think many, many people would love a built-in 'right click, save as PNG'
> > option if it's feasible.
>
> > -Josh
>
> > On Tue, May 31, 2011 at 9:58 AM, Dan Vanderkam <d...@dygraphs.com> wrote:
>
> >> This is very cool!
>
> >> I haven't looked at the implementation, but one issue you'll likely run
> >> into is that you can't apply CSS classes to text on the canvas. This would
> >> make it difficult to render charts like
> >>http://dygraphs.com/tests/styled-chart-labels.html.
>
> >> This is a frequently requested feature, though, so I'd be happy to include
> >> it in some form. Maybe in a dygraph-extras.js file?
>
> >>   - dan
>

> >> On Tue, May 31, 2011 at 7:41 AM, Robert Konigsberg <konigsb...@google.com

> >> > wrote:
>
> >>> Ooh, very nice.
>
> >>> The font isn't rendering well on Chome/Mac. See

> >>>http://i.imgur.com/OFqSv.pngfor a screenshot.

[Gerd]

Hi!

I'm using FF 5.0 on Windows and i also get this error:
Fehler: uncaught exception: [Exception... "An invalid or illegal string was specified"  code: "12" nsresult: "0x8053000c (NS_ERROR_DOM_SYNTAX_ERR)"  location: "http://cavorite.com/labs/js/dygraphs-export/dygraph-export.js Line: 111"]

Any updates on this?

Thanks
best regards,
Gerd

[Gerd]

Hi!

I've managed the mentioned error above by modifying the function DygraphExport.putLabel (check the variable divLabel.style.length), but i've got another question:
I'm generating dygraphs dynamically (for-loop and push). After implementig the clickCallback, how can i determine in which dygraph i've clicked? (the callback doesn't have a dygraph option like drawCallback)

Thanks in advance
best regards
Gerd

[Gerd]

Hi!

Here is the code snippet:

DygraphExport.putLabel = function(ctx, divLabel, plotX, options) {
    if (divLabel.style.length > 0){
        var top = parseInt(divLabel.style.top) + 7
        var left = parseInt(divLabel.style.left) + (plotX - 15)
        var text = divLabel.textContent

        ctx.fillStyle = options.labelColor;
        ctx.font = options.labelFont;
        ctx.textAlign = "right";
        ctx.textBaseline = "middle";
        ctx.fillText(divLabel.textContent, left, top);
    }
}

As you can see i first check the length of divLabel.style > 0

best regards
Gerd

[Juan Manuel Caicedo Carvajal]

Hi everyone,

Thank you for your bug reports. 

I started to work again on the project and I plan to make a release tomorrow with the fixes for the problems you have reported and some improvements, such as basic support for axis labels. I want to run more tests and I'll send a message to this list with the updated version.

Cheers and thanks again for your comments,

Juan Manuel Caicedo

[Juan Manuel Caicedo Carvajal]

Hi everyone,

I just uploaded a new version of the demo for exporting Dygraphs as PNG objects. This one should fix the bugs that you have reported and adds basic support for dygraphs with titles and axis labels. 

You can see the changes and some documentation here:

http://cavorite.com/labs/js/dygraphs-export/

I also forked the Github repository, so if you're interested you can use it to contribute or to track the changes. You can find the repository here:

https://github.com/cavorite/dygraphs

And this is the main file that contains the code for exporting graphs:

https://github.com/cavorite/dygraphs/blob/master/dygraph-extra.js

Please, let me know if you have questions or comments.

Cheers,

Juan Manuel Caicedo

[Priya Venkatesan]

Awesome! I tried it and works fine in FF 5.0.x. 

-Priya

[Gerd]

Hi!

Thanks for the update, but there is a problem in IE8 with the reserved keyword "export". IE8 throws 2 errors "Expected identifier"
at dygraph-extra.js, line 15 char 9 and dygraphs-export.js, line 104 char 17.

best regards,
Gerd

[Juan Manuel Caicedo Carvajal]

Hi,

Thanks for reporting this problem. I decided to change the namespace from Dygraph.export to Dygraph.Export, it should be more consistent with the rest of the extensions, such as Dygraph.GVizChart.

I see that there is a problem with IE8 since it doesn't support text drawing. I'll probably have to use something like http://code.google.com/p/canvas-text/, but for the time being I'll push the update as it is.

Cheers,

Juan Manuel Caicedo

[Juan Manuel Caicedo Carvajal]

Hi,

I found that my code is not compatible with IE6 - IE8 (or any other browser that needs excanvas.js). The problem is that excanvas does not implement the toDataURL method, which is required for copying the created canvas object to the img element.

For this reason, I decided to add a method to detect whether the browser is supported (Dygraph.Export.isSupported() ) and I updated the example page as well. 

I know that it's not nice to have features that are not compatible with all the browsers that Dygraphs already supports, but in this case there's not much I can do to fix it (except, of course, to port the toDataURL method to excanvas).

Cheers,

Juan Manuel Caicedo

[yincrash]

Is there a way to draw the annotation divs to the PNG? if not, can you
lead me in the right direction and I could implement it?

-mike

On Aug 1, 1:12 am, Juan Manuel Caicedo Carvajal <cavor...@gmail.com>
wrote:

[Robert Konigsberg]

What is the status of this project?

[Robert Konigsberg]

Also, does this work with the underlay canvas?

[Juan Manuel Caicedo Carvajal]

I am not working actively on the project, but I still publish updates and patches sent by the users from time to time. In terms of compatibility, I have tested it with the latest releases of Dygraphs and I have not found any issues.

However, the main problem of the implementation is that it is not compatible with IE8 for the reasons that I exposed in a previous message. I haven't tested it with the most recent version of IE, though.

With respect to the implementation, yes, it uses the underlying canvas to create a new object that combines the other elements (axes, labels, etc). This new canvas object is exported as an image using the 'toDataURL' method.

If you have any other questions, feel free to contact me.

[Robert Konigsberg]

Are you interested in contributing your source code to dygraphs?

[Juan Manuel Caicedo Carvajal]

Yes, of course. I think that I can write some tests, better documentation and probably more examples.

Should I keep the code in a separated file (dygraphs-extras.js), giving the possibility to include more extension on it? Or should I merge it with the existing code?

On Friday, January 20, 2012 10:54:57 AM UTC-5, konigsberg wrote:

Are you interested in contributing your source code to dygraphs?

On Thu, Jan 19, 2012 at 7:06 PM, Juan Manuel Caicedo Carvajal <cavo...@gmail.com> wrote:

I am not working actively on the project, but I still publish updates and patches sent by the users from time to time. In terms of compatibility, I have tested it with the latest releases of Dygraphs and I have not found any issues.

However, the main problem of the implementation is that it is not compatible with IE8 for the reasons that I exposed in a previous message. I haven't tested it with the most recent version of IE, though.

With respect to the implementation, yes, it uses the underlying canvas to create a new object that combines the other elements (axes, labels, etc). This new canvas object is exported as an image using the 'toDataURL' method.

If you have any other questions, feel free to contact me.

On Thursday, January 19, 2012 4:52:36 PM UTC-5, konigsberg wrote:

Also, does this work with the underlay canvas?

On Thu, Jan 19, 2012 at 4:49 PM, Robert Konigsberg <koni...@google.com> wrote:

What is the status of this project?

On Mon, Aug 1, 2011 at 1:12 AM, Juan Manuel Caicedo Carvajal <cav...@gmail.com> wrote:

Hi,

I found that my code is not compatible with IE6 - IE8 (or any other browser that needs excanvas.js). The problem is that excanvas does not implement the toDataURL method, which is required for copying the created canvas object to the img element.

For this reason, I decided to add a method to detect whether the browser is supported (Dygraph.Export.isSupported() ) and I updated the example page as well. 

I know that it's not nice to have features that are not compatible with all the browsers that Dygraphs already supports, but in this case there's not much I can do to fix it (except, of course, to port the toDataURL method to excanvas).

Cheers,

Juan Manuel Caicedo

--

Robert Konigsberg | Google NY | http://go/monarch

--

Robert Konigsberg | Google NY | http://go/monarch

[Robert Konigsberg]

For now, how about keeping in its own file? Do you know how our automated test framework works? The test framework might be a problem for image rendering. See some of my thoughts on the matter at http://konigsberg.blogspot.com/2011/04/thoughts-about-proxying-html5-canvas.html if you like.

[Robert Konigsberg]

Actually, I just re-read the post, and it's slightly out of date - I did wind up using the proxy solution, which is in dygraphs.com now. -Rob

[red-fox]

You can look up here ( http://pages.kunzt.info/tests/medview2_entwurf.html
) where i already took the annotations into the png file.
i modified the original dygraph-extra.js.
Perhaps it helps to get a full working solution which then will find
its way into the project.

On 20 Jan., 17:21, Robert Konigsberg <konigsb...@google.com> wrote:
> Actually, I just re-read the post, and it's slightly out of date - I did
> wind up using the proxy solution, which is in dygraphs.com now. -Rob
>
> On Fri, Jan 20, 2012 at 11:20 AM, Robert Konigsberg

> <konigsb...@google.com>wrote:

>
>
>
>
>
> > For now, how about keeping in its own file? Do you know how our automated
> > test framework works? The test framework might be a problem for image
> > rendering. See some of my thoughts on the matter at

> >http://konigsberg.blogspot.com/2011/04/thoughts-about-proxying-html5-...if

[Robert Konigsberg]

Speaking personally, I don't mind if the solution isn't complete - I'd see it opportunity for other people to contribute the remaining pieces.

However, including features like this at all is entirely Dan's decision. I can just make opinions.

[noved]

Hi, I'm looking to get a dygraph up as a png looking at the example it doesn't seem to actually present anything. I can't seem to get the demo to work in chrome or firefox. 

thanks!

On Monday, May 30, 2011 11:52:13 PM UTC-7, Juan Manuel Caicedo Carvajal wrote:

Hello,

I wrote a simple function for exporting dygraphs as images.

It just wraps the plot canvas in a new one and adds the axes and the
legend to it; then, it uses the toDataURL() method to copy the
serialized image to an IMG object, and that's it!. Now you have an
image that you can easily save to a file with your browser.

Here is a simple demo that I wrote:

http://cavorite.com/labs/js/dygraphs-export/

(It works on Firefox and Chrome. I have not tested it in other
browsers).

Do you think that this could be a good feature for Dygraph? If so, I
would be happy to improve the code, fix the current limitations and
also write some tests.

Feel free to send me your questions or comments.

Cheers,

Juan Manuel Caicedo

[Bartosz Kołodziej]

Some things changed in Dygraphs and Dygraphs-Export does not work with current version of Dygraphs.

Try older version of Dygraphs. I attached one that works for me (I am not sure how old it is). It is 28kB lighter than current version so some things might be missing...

The exact errors are:

- missing dygraph.plotter_.xlabels

- missing dygraph.plotter_.ylabels
etc

[Dan Vanderkam]

On Tue, Aug 28, 2012 at 7:44 PM, Bartosz Kołodziej
<bartoszk...@gmail.com> wrote:
> Some things changed in Dygraphs and Dygraphs-Export does not work with
> current version of Dygraphs.
> Try older version of Dygraphs. I attached one that works for me (I am not
> sure how old it is). It is 28kB lighter than current version so some things
> might be missing...
>
> The exact errors are:
> - missing dygraph.plotter_.xlabels
> - missing dygraph.plotter_.ylabels
> etc

If it helps, those properties have moved out of the plotter_ object
and into the layout_ object. I believe the mapping is:

dygraph.plotter_.xlabels -> dygraph.layout_.xticks
dygraph.plotter_.ylabels -> dygraph.layout_.yticks

- Dan

[noved]

Wonderful! It worked! Do you think that there will be an updated version that will help fix this issue? 

On a side note in the png export, the x-axis title is actually on the axis instead of below it. Any hints on how to fix this issue? 

Thanks for your help!

[philip]

How can I find older versions? it seems only lastest version on the download page.

[Robert Konigsberg]

You can always use git magic to access the source, and then build the combined Javascript file using generate-combined.js.

[Dan Vanderkam]

Yeah, this I what you'll have to do. dygraphs doesn't really have a versioning system beyond the git commit sequence.

Sent from my iPhone

[noved]

I used the version posted by  Bartosz Kołodziej. 

[philip]

thanks. But I used dygraph-dev.js for current version, not dygraph-combined.js. What's the difference between them?

[Lukas Rötzer]

I'm facing a similar problem here! I've tried any combination of versions and fixes i found so far, but i still get

Uncaught TypeError: Cannot read property 'top' of undefined atdygraph-extra.js:171

and i can't figure out the changes in the dygraph source..

kind regards

[Juan Manuel Caicedo Carvajal]

Hi everyone,

I'm sorry for not replying to these messages earlier.

I'm still working on updating the 'export to PNG' feature to the new
Dygraph API, but I haven't finished it and I still have to fix some
issues related to the axes and the labels. The demo works somehow, at
least there are no errors.

You can track the development on my fork of the github repository:

https://raw.github.com/cavorite/dygraphs/master/dygraph-extra.js

I will push a new version as soon as I have solved the remaining issues.

Cheers,

Juan Manuel

[philip]

Hi Juan Manuel,

Thanks for your hard work. But I have still a problem with your demo. It could not show png picture on your webpage. I used windows 2008/xp with FF, IE and Chrome. I do not know why.  The version of dygraphs-combined.js I used is posted by  Bartosz Kołodziej also.

Could you help me?

cheers,

Philip

在 2012年9月13日星期四UTC-4下午4时09分31秒，Juan Manuel Caicedo Carvajal写道：

[CODEY]

I tried the dygraphs-extra, it does not seems to work very well ... the axis labels, title are not there, and the new legend created by the script is cutoff at the bottom .. do i need to make the new images larger than the original plot .? 

[CODEY]

am I doing something wrong, should I get the axes and labels? i get the png, but it only has the plot, and the legend at the bottom ... 

[Juan Manuel Caicedo Carvajal]

Hi,

You're not doing anything wrong. Currently the library does not
support axes or labels.

I'm sorry, but I haven't had time to make the changes to support the
new Dygraphs API so I decided to publish in the state that it is right
now.

I will post a message to the list as soon as I have finished that.

[Fred Dysart]

After a bit of fiddling, you can display the x & y axes tick mark labeling with the following:

var axesPluginDict = Dygraph.Export.getPlugin(dygraph, 'Axes Plugin');

if (axesPluginDict) {

var axesPlugin = axesPluginDict.plugin;

for (i = 0; i < axesPlugin.ylabels_.length; i++) {

Dygraph.Export.putLabel(ctx, axesPlugin.ylabels_[i], options,

                options.labelFont, options.labelFontColor);

}

for (i = 0; i < axesPlugin.xlabels_.length; i++) {

Dygraph.Export.putLabel(ctx, axesPlugin.xlabels_[i], options,

                options.labelFont, options.labelFontColor);

}

}

This goes in the drawPlot function above the code for displaying the other labels.

[Juan Manuel Caicedo Carvajal]

Thank you very much Fred. I just updated the demo page and pushed the
changes into my GitHub repository.

[Ed Pataky]

awesome i will try 

[CODEY]

I tried and it did not change anything in the plot .. i grabbed the code from this page:  http://cavorite.com/labs/js/dygraphs-export/ 

IS this is the correct code?

ed

[Juan Manuel Caicedo Carvajal]

Hi,

Yes, it is the latest version. It seems that there is an issue with
Firefox, because only the first plot loads correctly.

I am going to have a look at it, but for the time being try to
download the Javascript file and see if it works for you:

http://cavorite.com/labs/js/dygraphs-export/dygraph-extra.js

[CODEY]

we i have tried it, but no axes ... chrome, windows

[CODEY]

any resolution on this?  why the image created has no axes?

[Juan Manuel Caicedo Carvajal]

Hi,

I'm sorry. I'm busy right now and I won't be able to work on Dygraphs.

[Mark Dunn]

Great work, looks good.

Just a note: if you're using data from a url, you need to call the Export.asPNG in the Dygraph drawCallback function, or else it is drawn blank (ie, before the data is actually fetched)

eg:

g2 = new Dygraph(

    document.getElementById("graphdiv2"),

    "http://localhost/getMyData.php',

    {

        drawCallback: function(g) {               

                var img = document.getElementById('demo');

                Dygraph.Export.asPNG(g2, img);

                var me = document.getElementById('graphdiv2');

                me.style.visibility='hidden';

                me.style.display='none';

              }

    });

cheers

md

[Alan Queiroz]

I modified red-fox's "annotations-fix".

1/20/12

You can look up here ( http://pages.kunzt.info/tests/medview2_entwurf.html 
) where i already took the annotations into the png file. 
i modified the original dygraph-extra.js. 
Perhaps it helps to get a full working solution which then will find 
its way into the project. 

/**

 * Draws a Annotation at the same position 

 * where the div containing the text is located.

 */

Dygraph.Export.putLabelAnn = function (ctx, divLabel, options, font, color) {

    "use strict";

    if (!divLabel) {

        return;

    }

    if(!divLabel.style && divLabel.div){

        divLabel = divLabel.div;

    }    

    var top = parseInt(divLabel.style.top, 10);

    var left = parseInt(divLabel.style.left, 10);

    

    if (!divLabel.style.top.length) {

        var bottom = parseInt(divLabel.style.bottom, 10);

        var height = parseInt(divLabel.style.height, 10);

        top = ctx.canvas.height - bottom - height;

    }

    var width = parseInt(divLabel.offsetWidth || divLabel.style.width, 10);

    var height = parseInt(divLabel.offsetHeight || divLabel.style.height, 10);

    Dygraph.Export.putTextAnn(ctx, left, top, width, height, divLabel, font, color);

};

/**

 * Draws the Annotations contained in 'divLabel' at the specified position.

 */

Dygraph.Export.putTextAnn = function (ctx, left, top, width, height, divLabel, font, color) {

    "use strict";

    if(!divLabel.style && divLabel.div){

        divLabel = divLabel.div;

    }

    var textAlign = divLabel.style.textAlign || "center";    

    var text = divLabel.innerText || divLabel.textContent;

    ctx.beginPath();

    ctx.rect(left, top, width, height);

    ctx.fillStyle = "white";

    ctx.fill();

    

    ctx.fillStyle = divLabel.style.color || color;

    ctx.font = font;

    ctx.textAlign = textAlign;

    ctx.textBaseline = "bottom";

    ctx.fillText(text, left+width/2, top + height);

    ctx.lineWidth = 1;

    ctx.strokeStyle = divLabel.style.color || color;

    ctx.stroke();

};

[Tony Konzel]

Alan: Thanks for the fix. This worked great!

[uweoswald]

Hi Tony,

I gave it a try yesterday but for me it hasn’t worked. I only get a chart without any ticks or title. What have you done in the dygraph-extra.js? Just put Alan’s functions in it or do you have modified more? Is it possible to post your …-extra.js in combination with the html that others see how it works?! 

Thx in advance.

Cheers,

Uwe

Am 15.08.2014 um 10:13 schrieb Tony Konzel <to...@bartonlogic.com>:

Alan: Thanks for the fix. This worked great!

--
You received this message because you are subscribed to the Google Groups "dygraphs-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to dygraphs-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[uweoswald]

Update on this. I get a chart printed in an image but no ticks for the x- & y-axis. I use csv data for printing a chart. Has someone tried this with success? I have tried everything without success.

Thank you.

Uwe

Am 15.08.2014 um 10:13 schrieb Tony Konzel <to...@bartonlogic.com>:

Alan: Thanks for the fix. This worked great!

[uweoswald]

I’m a little bit further. But now no idea again :-). At the end the problem is in my case that axesPlugin.ylabels_.length is 0. The chart is displayed correctly with all ticks and legend and title. Just the Dygraph.Export.asPNG is not working as it should for me. It prints the chart correctly but without any ticks aso. . Could someone help me to understand what I must change in order to get axesPlugin.ylabels_.length != 0. The plugins itself should work, I do not see any error messages in Firefox.

Thx

Uwe

    // Add the x and y axes

    var axesPluginDict = Dygraph.Export.getPlugin(dygraph, 'Axes Plugin');

    if (axesPluginDict) {

   

        var axesPlugin = axesPluginDict.plugin;

alert(axesPlugin.ylabels_.length);   ==> 0 ==> For loops are ignored

        for (i = 0; i < axesPlugin.ylabels_.length; i++) {

            Dygraph.Export.putLabelAnn(ctx, axesPlugin.ylabels_[i], options,

                options.labelFont, options.labelFontColor);

        }

        

        for (i = 0; i < axesPlugin.xlabels_.length; i++) {

            Dygraph.Export.putLabelAnn(ctx, axesPlugin.xlabels_[i], options,

                options.labelFont, options.labelFontColor);

        }

    }

Am 15.08.2014 um 10:13 schrieb Tony Konzel <to...@bartonlogic.com>:

Alan: Thanks for the fix. This worked great!

[Bo Boland]

Other than the issue that some folks are having with exporting the ticks to PNG, is there an easy way to get the export to work from a button?  I want to keep my interactive version of my dygraph on my page, but have a button to download the PNG locally.  I'm not entirely sure how to go about this with the solutions given.

Thoughts?

[Kbizzle]

This is great but Dygraph.Export.PutLabelAnn doesn't exist... do you have this function anywhere or was this just filler until you wrote it?

[V.Shirish Kumar]

Hello,

I am new to Dygraphs. I want to use mouse right click->Save as PNG option on the graph. Used suggested function, but its not working. Anyone, please help to find where I am  doing mistake. Below is my code:

<script type="text/javascript" src="dygraph-combined.js"></script>

<script type="text/javascript" src="synchronizer.js"></script>

<script type="text/javascript" src="dygraph-extra.js"></script>

<script type="text/javascript">

var gs = [];

var img;

window.onload=function(){

if (localStorage.getItem("data") != null)

localData = localStorage.getItem("data");

gs = [];

// Create the graph to display the data

gs.push(

dataGraph6 =  new Dygraph(

document.getElementById("graphdiv6"),

0,

{

height: 320,

width: 800,

axisLabelFontSize: 11,

hideOverlayOnMouseOut: false,

animatedZooms: true,

labels: ['X', 'Y'],

axes: {

x: {

pixelsPerLabel: 100

}

img = document.getElementById("graphdiv6");

Dygraph.Export.asPNG(dataGraph6, img);

window.location.href = img.src.replace('image/png','image/octet-stream')

},

xlabel: 'Time', 

ylabel: 'Receive Sig. to Output Ratio (dB)'

})

);

My HTML code:

<fieldset>

<table>

<tr>

<td><div id="graphdiv6"></div></td>

</tr>

       </table>

Best Regards,

Shirish Kumar