Sign in to follow this  
Guest Rajroop

render chart in child window

Recommended Posts

I am attempting to render a chart in a child window, anyone have an idea to try? In the code below, the pie chart renders fine but I can't get the 3D bar to render. This is a variation of the example presented for PHP and Javascript provided on FusionCharts.com

 

 

 


function pieChartRender(xml)

{

	var pieObj = new FusionCharts("FusionCharts/Pie3D.swf", "Totals", "600", "400", "false", "true");

	pieObj.setDataXML(xml);

	pieObj.render("pieChart");

	setTimeout('process()', 30000);



}



function updateChart(port) {

var title=null;

switch (port) {

 case 0: title = 'ICMP'; break;

 case 21: title = 'FTP'; break;

        case 22: title = 'SSH'; break;

 case 23: title = 'TELNET'; break;

 case 25: title = 'SMTP'; break;

 case 53: title = 'DNS'; break;

 case 67: title = 'DHCP'; break;

 case 68: title = 'DHCP'; break;

 case 69: title = 'TFTP'; break;

 case 80: title = 'HTTP'; break;

        case 81: title = '8e6 Filter'; break;

 case 88: title = 'KERB'; break;

 case 123: title = 'NTP'; break;

 case 135: title = 'MS EPMAP'; break;

 case 137: title = 'NBNS'; break;

 case 138: title = 'NBDS'; break;

 case 139: title = 'NBSS'; break;

 case 161: title = 'SNMP'; break;

 case 389: title = 'LDAP'; break;

 case 443: title = 'HTTPS'; break;

 case 445: title = 'MS SMB AD'; break;

 case 500: title = 'ISAKMP'; break;

        case 1025: title = 'WINDWS/UNKNOWN'; break;

 case 1026: title = 'MSDCOM'; break;

        case 1115: title = 'EXCHANGE'; break;myDiv

 case 1433: title = 'MSSQL'; break;

 case 1494: title = 'CITRIX'; break;

 case 1521: title = 'ORACLE'; break;

 case 2245: title = 'SVS'; break;

 case 2483: title = 'ORACLE'; break;

 case 2598: title = 'CITRIX'; break;

 case 4096: title = 'AAFES'; break;

 case 45974: title = 'EPOS'; break;

 case 10039: title = 'ADS'; break;

 default: title = port;

     }

      	var strXML = "";

var i = 0;

for( i=0;i
    strXML += "";

}

strXML += "";

mywindow = window.open("http://localhost/yanmadev/barChart.html", "mywindow");

var barChartObj = new FusionCharts("FusionCharts/Column3D.swf", "Talkers", "4000", "600", "0", "1");

var test = mywindow.document.getElementById("barChart3D");

alert(test);

barChartObj.setDataXML(strXML);

barChartObj.render("barChart3D");

}

Share this post


Link to post
Share on other sites
Guest Rajroop

Hi,

 

 

 

Looking forward to your reply on this.

 

 

 

P.s. Happens to the best of us. :)

Share this post


Link to post
Share on other sites

Not much luck.  I already have a link in my pie slices (javascript:updateChart(port) ) to the function updateChart, which then takes the data in my jsVarString and generates the detailed data for a Column3D graph.  Am I missing something else?

if($percent > 0 )
{
$jsVarString.= "<set label='" . $label . "'value='" . $percent . "'link='javascript:updateChart(". $key . ")'/>";
}
}
$jsVarString.= "<styles>";
$jsVarString.= "<definition>";
$jsVarString.= "<style name='chartFont' type='font' size='12' face='Verdana' bold='1'/>";
$jsVarString.= "</definition>";
$jsVarString.= "<application>";
$jsVarString.= "<apply toObject='DATALABELS' styles='chartFont'/>";
$jsVarString.= "</application>";
$jsVarString.= "</styles>";
$jsVarString.= "</chart>";

Share this post


Link to post
Share on other sites
Guest Madhumita

Hello,

I am attempting to render a chart in a child window, anyone have an idea to try? In the code below, the pie chart renders fine but I can't get the 3D bar to render. This is a variation of the example presented for PHP and Javascript provided on FusionCharts.com

In the code below you are tring to open the widow and even before window load it is trying to get the element in the html element with id="barChart3D" which still might not have been loaded.

 mywindow = window.open("http://localhost/yanmadev/barChart.html", "mywindow");

 

var barChartObj = new FusionCharts("FusionCharts/Column3D.swf", "Talkers", "4000", "600", "0", "1");

 

var test = mywindow.document.getElementById("barChart3D");

Can you please send us a scaled down version of the entire code so that we can run it in our lab and find a probable solution.

Awaiting your reply. :)

Share this post


Link to post
Share on other sites

Gentleman interesting twist.  (btw, I have attached a zip file).  The following js code works locally, that is if I  use the browser on the same machine as apache.  The only way it works is with the alert in the fist few lines of the updateChart function.  However, if I try from a remote machine on Opera I get security errors regarding Javascript that say "attempting to read protected variable.

function updateChart(port) {
detailsPop = window.open("http://localhost/yanmadev/barChart.html", "Details", "scrollbars=1", "width=1000, height = 600");
newElement = detailsPop.document.createElement("div");
newElement.setAttribute("id", "barChart3D");
alert(newElement.getAttribute("id") + "rendered");
detailsPop.document.body.appendChild(newElement);
var title=null;
switch (port) {
case 0: title = 'ICMP'; break;
case 21: title = 'FTP'; break;
case 22: title = 'SSH'; break;
case 23: title = 'TELNET'; break;
case 25: title = 'SMTP'; break;
case 53: title = 'DNS'; break;
case 67: title = 'DHCP'; break;
case 68: title = 'DHCP'; break;
case 69: title = 'TFTP'; break;
case 80: title = 'HTTP'; break;
case 81: title = '8e6 Filter'; break;
case 88: title = 'KERB'; break;
case 123: title = 'NTP'; break;
case 135: title = 'MS EPMAP'; break;
case 137: title = 'NBNS'; break;
case 138: title = 'NBDS'; break;
case 139: title = 'NBSS'; break;
case 161: title = 'SNMP'; break;
case 389: title = 'LDAP'; break;
case 443: title = 'HTTPS'; break;
case 445: title = 'MS SMB AD'; break;
case 500: title = 'ISAKMP'; break;
case 1025: title = 'WINDWS/UNKNOWN'; break;
case 1026: title = 'MSDCOM'; break;
case 1115: title = 'EXCHANGE'; break;myDiv
case 1433: title = 'MSSQL'; break;
case 1494: title = 'CITRIX'; break;
case 1521: title = 'ORACLE'; break;
case 2245: title = 'SVS'; break;
case 2483: title = 'ORACLE'; break;
case 2598: title = 'CITRIX'; break;
case 4096: title = 'AAFES'; break;
case 45974: title = 'EPOS'; break;
case 10039: title = 'ADS'; break;
default: title = port;
}
var strXML = "<chart caption='" + title + "' xAxisName='Kilobytes' xAxisName='Hosts' labelDisplay='ROTATE'slantLabels='1' chartLeftMargin='100' showValues='0'>";
var i = 0;
var counter = data[port].length;
if(counter > 30)
{
counter = 30;
}
for( i=0;i<counter; i++) {
strXML += "<set label='" + data[port][i][0] + "'value='" + data[port][i][1] + "' />";
}
strXML += "<styles>";
strXML += "<definition>";
strXML += "<style name='chartFont' type='font' size='12' face='Verdana' bold='1'/>";
strXML += "</definition>";
strXML += "<application>";
strXML += "<apply toObject='DATALABELS' styles='chartFont'/>";
strXML += "</application>";
strXML += "</styles>";
strXML += "</chart>";
var barChartObj = new FusionCharts("FusionCharts/Column3D.swf", "Talkers", "1500", "600", "0", "1");
var div = detailsPop.document.getElementById("barChart3D");
barChartObj.setDataXML(strXML);
barChartObj.render(div);
}

mitchfiles.zip

Share this post


Link to post
Share on other sites
Guest Madhumita

Hi,

It seems to be a common browser security issue.

Could you please try doing the same without using FusionCharts and just using some normal HTML elements?

Share this post


Link to post
Share on other sites

Update gentleman!  I changed my code in the javascript to the url of the server.  My original code was using http://localhost.  when a client browser sees this, it assumes it's a cross domain attemtp to query the pc and blocks it, hence the pop ups work.  However I ned to work on a few things....

1.  How to load the pop up window in advance so the element exists to render the bar chart from the pie chart.

2. dynamically sizing the chart so not all charts are huge

3. While the app works well in Opera and Firefox, MS IE7 won't load at all and errors out on the xmlHttp.open method.

I will work on these three myself and contact you if I need help.  Thanks for your support.

Share this post


Link to post
Share on other sites
Guest Basundhara Ghosal

Hi,

You are welcome.

Awaiting for your reply. :hehe:

Happy FusionCharting.

Share this post


Link to post
Share on other sites

Gentleman:

 

 

 

I have resolved most of my problems with jQuery and am now in the process of learning YUI to see how that works. Great product! Just took advantage of your 15% discount and bought a developers license.

Share this post


Link to post
Share on other sites
Guest Rajroop

Hi Mitch,

 

 

 

Thank you soo much.

 

 

 

I think this is the best thing you could have done to end the year off. :P Welcome to the FusionCharts Family. :)

 

 

 

Please feel free to revert in case of any queries.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this