Fusion SetCurrentRenderer Chart ('javascript')
I have the following HTML code. He works.
<html>
<head>
<title>My First chart using FusionCharts - Using pure JavaScript</title>
<script type="text/javascript" src="http://www.fusioncharts.com/lib/jquery/jquery-1.6.2.min.js"></script>
<script language="JavaScript" src="http://www.fusioncharts.com/lib/js/FusionCharts.js"></script>
<script language="JavaScript" src="http://www.fusioncharts.com/lib/js/FusionCharts.HC.js"></script>
<script language="JavaScript" src="http://www.fusioncharts.com/lib/js/FusionCharts.HC.Charts.js"></script>
<script language="JavaScript" src="http://www.fusioncharts.com/lib/js/jquery.min.js"></script>
</head>
<body>
<div id="chartContainer">FusionCharts will load here!</div>
<script type="text/javascript">
//FusionCharts.setCurrentRenderer('javascript');
var chartObj = new FusionCharts({
swfUrl: "http://www.fusioncharts.com/demos/gallery/Charts/Column2D.swf",
width: "500",
height: "300",
id: 'sampleChart',
dataSource: "http://www.fusioncharts.com/demos/gallery/Data/Col2D1.xml",
dataFormat: FusionChartsDataFormats.XMLURL,
renderAt: 'chartContainer'
}).render();
</script>
</body>
</html>
When I use setCurrentRenderer
javascripde mode . This gives me "no data to display".
EDIT: example source - http://www.fusioncharts.com/demos/gallery/column-and-bar/chart.asp?id=column2d_1
source to share
Loading JavaScript data from the FusionCharts site results in cross-domain errors. This is protection built in by the browser itself.
XMLHttpRequest cannot load http://www.fusioncharts.com/demos/gallery/Data/Col2D1.xml. Origin http://localhost is not allowed by Access-Control-Allow-Origin.
Try to host JavaScript files, Flash files and XML data on your local server and it should work fine.
source to share
I used below example with javascript rendering:
<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Multi Series Bar 2D Chart</title>
<link href="../assets/ui/css/style.css" rel="stylesheet" type="text/css" />
<link href="../assets/prettify/prettify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../Charts/jquery.min.js"></script>
<script type="text/javascript" src="../../Charts/FusionCharts.js"></script>
<script type="text/javascript" src="../assets/prettify/prettify.js"></script>
<script type="text/javascript" src="../assets/ui/js/json2.js"></script>
<script type="text/javascript" src="../assets/ui/js/lib.js" ></script>
<script type="text/javascript" src="../assets/ui/js/DD_belatedPNG_0.0.8a-min.js"></script>
<script>
/* select the element name, css selector, background etc */
DD_belatedPNG.fix('img');
/* string argument can be any CSS selector */
</script>
<p> </p>
<P align="center"></P>
<![endif]-->
</head>
<body>
<h3 class="chart-title">Multi Series Bar 2D Chart</h3>
<p> </p>
<script type="text/javascript" src="../Data/String/js/MSBar3D1.js" ></script>
<div id="chartdiv" align="center">Chart will load here</div>
<script type="text/javascript">
alert(GALLERY_RENDERER);
FusionCharts.setCurrentRenderer("javascript");
var chart = new FusionCharts("MSBar3D.swf", "ChartId", "560", "400", "0", "0");
chart.setXMLData( dataString );
chart.render("chartdiv");
</script>
<p> </p>
<p align="center">3D Bar chart showing sales comparison of 5 countries across 3 years. Click on a legend item to show/hide the data series.</p>
and it works fine with java script rendering ... hope this example helps
source to share
Cross-domain issues can be resolved by implementing cross origin CORS resource sharing. Make sure that the server providing the data is sending additional HTTP headers in response:
Access-Control-Allow-Origin: http://the_url_that_hosts_the_page
Access-Control-Allow-Headers: If-Modified-Since
source to share