FusionCharts Forum / FusionCharts v3 / Using FusionCharts / General usage / Example (Code) for Charts using AJAX / Latest Posts

RE: Example (Code) for Charts using AJAX

Coyote — Fri, 29 Feb 2008 07:24:45 GMT

hi !

( sorry for my english ... again )

I did it!

The Solution:

** in the main page, include de basic code to load a FC

(The $XML2Lines is a smarty variable, you`ll use another XML file)

<div id="chart7">
<script type="text/javascript">
var chart = new FusionCharts("charts/MSLine.swf", "chart7", "700", "300", "0", "1");
chart.setDataXML("{$XML2Lines}");
chart.render("chart7");
ObjectChart = chart;
GoAjax();
</script>
</div>

** the GoAjax() and UpdateGraphic() javascript function

function GoAjax(id)
{
TimerGraphic = setTimeout("UpdateGraphic()", 3000);
} // you`ll understand the parameters, sure.

function UpdateGraphic(id)
{
var object = document.form_mediciones.ddlObject.value;
var sensor = document.form_mediciones.ddlSensor.value;
var variable = document.form_mediciones.ddlVariable.value;
var ini_filter = document.form_mediciones.inicio_filtro_hidden.value;
var ter_filter = document.form_mediciones.termino_filtro_hidden.value;
var company = document.form_mediciones.company_hidden.value;
var iStartCounter = document.form_mediciones.iStartCounter_hidden.value;
var nValuesToCalc = document.form_mediciones.nValuesToCalc_hidden.value;;

var URL = "SetSourceOfGraphic.php?";
URL = URL + "im=" + id;
URL = URL + "&fi=" + ini_filter;
URL = URL + "&ft=" + ter_filter;
URL = URL + "&ep=" + company;
URL = URL + "&object=" + object;
URL = URL + "&sensor=" + sensor;
URL = URL + "&variable=" + variable;
URL = URL + "&iStartCounter=" + iStartCounter;
URL = URL + "&nValuesToCalc=" + nValuesToCalc;

var ajax=objetoAjax();
ajax.open("GET", URL, true);
ajax.onreadystatechange=function()
{
if (ajax.readyState==4)
{
ObjectChart.setDataXML(ajax.responseText);

}
}
ajax.send(null);
}

** end

I hope you understand de MAIN IDEA of code, a remove some variables to make more "friendly" the solution.

the another tecnologies ( smarty, pear ), have not idea of my code, just javascript and html play this.

PD: the objetoAjax() function is in every where in the internet, you have to find it, it`ll be the dificulty of my solution. ( always have a dificulty )

any question, find me...

Regards.

RE: Example (Code) for Charts using AJAX

Sudipto Choudhury — Fri, 29 Feb 2008 00:38:36 GMT

hi,

We have not yet impleted FusionCharts in such environment. If you can kindly provide us some code for the same combination (PHP+PEAR etc. and using AJAX) we can try embedding FusionCharts in that.

RE: Example (Code) for Charts using AJAX

Coyote — Tue, 05 Feb 2008 07:34:35 GMT

hi !

(My English is very bad... sorry)

i `ve a problem using ajax.

i`m developing a proyect using PEAR, SMARTY, PHP, FUSIONCHARTS and now .... my boss say me "ok, let`s include ajax" ...

I`ve been searching for any information and don`t find nothing. please just need some pages, or tutorias, or something to help me.

PD: Already I have seen the main pages of PEAR, SMARTY, PHP, FUSIONCHARTS, but they don`t give me "instructions" to how combinate ajax with the another tecnologies.

Regards.

RE: Example (Code) for Charts using AJAX

coolegg — Thu, 10 Jan 2008 05:39:56 GMT

[quote][b]Sudipto Choudhury (1/10/2008)[/b][hr]hi,

FusionCharts' charts has the capability to dynamically fetch XML data from a server side script or any XML source without page refresh. You just need to specify the datURL path from where the XML is to be fetched.
[/quote]

Oh. Interesting. Okay, I need to educate myself some more (read more of the documentation). I'll come back and post the additional information you suggested if I can't figure it out. Thanks for the reply Sudipto - very helpful.

- Andrew

RE: Example (Code) for Charts using AJAX

Sudipto Choudhury — Thu, 10 Jan 2008 05:30:33 GMT

hi,

This can be achieved using AJAX. But, may be, that would confuse you more. YOu can just use simple JS to imlpement this. I am saying this because you have no need to use AJAX backbone to fetch XML for the chart. FusionCharts' charts has the capability to dynamically fetch XML data from a server side script or any XML source without page refresh. You just need to specify the datURL path from where the XML is to be fetched.

Still, you can provide us the structure (i mean a more details) of the application AJAX+PHP+FusionCharts and we can try providing you the solution.

RE: Example (Code) for Charts using AJAX

coolegg — Tue, 08 Jan 2008 17:49:33 GMT

I wish there was simpler example of AJAX integration with FusionCharts. I am in the same boat as the original poster, I am not a professional web developer. An example using AJAX and PHP such as where a user simply clicks on one of three text links and one of three corresponding charts is rendered into a chart container without the page refreshing would be very helpful as a very basic but highly useful example of AJAX, PHP and FusionCharts. I can't use JS-only because eventually I want to have far more than 3 possible charts, so I need to generate the FusionCharts XML dynamically. I just can't seem to put it all together: AJAX, PHP and FusionCharts. Looking at ASP examples is like looking at Mandarin to me.

If anyone happens to have a simpler example of AJAX, PHP and FusionCharts in action I would much appreciate it.

RE: Example (Code) for Charts using AJAX

Sudipto Choudhury — Tue, 23 Oct 2007 02:39:40 GMT

Hi,

Here is a sample example with AJAX (using ASP and Access at the backend).. in \ASP\AjaxSample\ folder.
This example first extracts data from database and calculates the total output of 3 factories..this is plain ASP.Then it renders a pie chart. Now the ajax part...when on clicks on a pie it calls a a javascript function. The intension is to load a chart with details of production of that particular factory.

AJAX part : the javasctipt calls ajax to send request to an asp page FactoryData.asp which returns an XML for the detailed chart. Then that detailed chart (column 2d) will load below the pie chart. ON clicking on another slice the ajax call will again reload the detailed chart with different data....

RE: Example (Code) for Charts using AJAX

luftikus143 — Thu, 18 Oct 2007 09:57:21 GMT

[quote][b]Pallav (10/5/2007)[/b][hr]Yes - we've a lot of examples in our documentation at www.fusioncharts.com/docs > Guide for Web Developers > FusionCharts and JavaScript.[/quote]
But these are not AJAX examples, no? Just normal Javascript ones. There is no direct Javascript interaction with the server, as I can see it... Please correct me if I am wrong.

RE: Example (Code) for Charts using AJAX

Pallav — Fri, 05 Oct 2007 03:26:41 GMT

Yes - we've a lot of examples in our documentation at www.fusioncharts.com/docs > Guide for Web Developers > FusionCharts and JavaScript.

Example (Code) for Charts using AJAX

luftikus143 — Wed, 03 Oct 2007 03:03:40 GMT

Hi there,

are there any examples of charts using AJAX for generating graphs without the need of reloading the whole page? If possible with the used code? I am not a big Javascript/AJAX programmer, so I would like to reuse some code to achieve that...

Thanks for any help!

Stef