How to export my chart on the server side in PHP (in browser) ?
For exporting single chart, use base64 image URI, then Ajax post to the server-side, and do whatever you need there.
In
examples/export_image.php, in the javascript (bottom of the page) that does image export, you need to insert the following into the loop. var imageSrc = j.src; // this stores the base64 image uri in imageSrc$.ajax({ type: "POST", url: 'zzz.php', data: { Value: JSON.stringify(imageSrc)}, success: 'OK', dataType: 'json'});Complete javascript. You will need to hook it into the load event.
<script type = "text/javascript" > $(document).ready(function() { if (!$.jqplot._noCodeBlock) { $("script.code").each(function(e) { if ($("pre.code").eq(e).length) { $("pre.code").eq(e).text($(this).html()) } else { var t = $('<pre class="code prettyprint brush: js"></pre>'); $("div.jqplot-target").eq(e).after(t); t.text($(this).html()); t = null } }); $("script.common").each(function(e) { $("pre.common").eq(e).text($(this).html()) }); var e = ""; if ($("script.include, link.include").length > 0) { if ($("pre.include").length == 0) { var t = ['<div class="code prettyprint include">', '<p class="text">The charts on this page depend on the following files:</p>', '<pre class="include prettyprint brush: html gutter: false"></pre>', "</div>"]; t = $(t.join("\n")); $("div.example-content").append(t); t = null } $("script.include").each(function(t) { if (e !== "") { e += "\n" } e += '<script type="text/javascript" src="' + $(this).attr("src") + '"></script>' }); $("link.include").each(function(t) { if (e !== "") { e += "\n" } e += '<link rel="stylesheet" type="text/css" hrf="' + $(this).attr("href") + '" />' }); $("pre.include").text(e) } else { $("pre.include").remove(); $("div.include").remove() } } if (!$.jqplot.use_excanvas) { $("div.jqplot-target").each(function() { var e = $(document.createElement("div")); var t = $(document.createElement("div")); var n = $(document.createElement("div")); e.append(t); e.append(n); e.addClass("jqplot-image-container"); t.addClass("jqplot-image-container-header"); n.addClass("jqplot-image-container-content"); t.html("Right Click to Save Image As..."); var r = $(document.createElement("a")); r.addClass("jqplot-image-container-close"); r.html("Close"); r.attr("href", "#"); r.click(function() { $(this).parents("div.jqplot-image-container").hide(500) }); t.append(r); $(this).after(e); e.hide(); e = t = n = r = null; if (!$.jqplot._noToImageButton) { var i = $(document.createElement("button")); i.text("View Plot Image"); i.addClass("jqplot-image-button"); i.bind("click", { chart: $(this) }, function(e) { var t = e.data.chart.jqplotToImageElem(); var n = t.src; $.ajax({ type: "POST", url: "zzz.php", data: { Value: JSON.stringify(n) }, success: "OK", dataType: "json" }); var r = $(this).nextAll("div.jqplot-image-container").first(); r.children("div.jqplot-image-container-content").empty(); r.children("div.jqplot-image-container-content").append(t); r.show(500); r = null }); $(this).after(i); i.after("<br />"); i = null } }) } $(document).unload(function() { $("*").unbind() })}) < /script>On the server side "zzz.php", you can retrieve the image like this
<?php$img = $_POST['Value'];// do whatever you need here...?>When you need to export multiple images on the server side, you can loop through the page to find all the jqPlot objects and send each to Ajax POST because all the jqPlot rendered by phpChart has CSS class "plot jpqlot-target"
For example:
<div id="chart2" class="plot jqplot-target" style="width:400px;height:300px;">...</div> Pseudo code:
$('.plot.jqplot-target').each(function(i, obj) { var imageSrc = obj.src; // saves the base64 image uri in imageSrc$.ajax({type: "POST",url: 'zzz.php',data: { Value: JSON.stringify(imageSrc)},success: 'OK',dataType: 'json'});
});