dkyadav

Problem While Including Fusioncharts.js For Fusionmaps And Fusioncharts On Same Page

Recommended Posts

I am trying to integrate FusionMaps and FusionCharts on the same page.

I am using below to include javascript for both of them on a page:

<script type="text/javascript" src="resources/charts/FusionCharts/FusionCharts.js"> </script>

<script type="text/javascript" src="resources/Maps/FusionMaps.js"></script>

But I am getting "Chart type not supported" for FusionMaps. But if I change the sequence of abobe JS include file. I get same error for FusionCharts. I am including my whole code below:

 

<html xmlns="

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Multi Charts</title>

<script type='text/javascript' src='resources/js/jquery.js'></script>

<script type='text/javascript' src='resources/js/jqueryui.js'></script>

<script type="text/javascript" src="resources/charts/FusionCharts/FusionCharts.js"> </script>

<script type="text/javascript" src="resources/Maps/FusionMaps.js"></script>

 

<link rel="stylesheet" type="text/css" href="resources/css/main.css" />

 

<script type="text/javascript">

FusionCharts.setCurrentRenderer('javascript');

var myMap = new FusionCharts("resources/Maps/FCMap_USA.swf", "myMapId", "750", "450", "0");

$(document).ready(function(e) {

fillChart();

});

 

function fillChart()

{

$.getJSON("getCharts.cfc?method=getFusionChart&batchId=82642&"+$('form').serialize()+"&returnformat=json&queryformat=column", {}, function(res,code){

$('#div_AVERAGECALLTIME').html(res.DATA.AVERAGECALLTIME[0])

$('#div_CALLRESULTPERHOUR').html(res.DATA.CALLRESULTPERHOUR[0])

$('#div_CALLRESULT').html(res.DATA.CALLRESULT[0])

$('#div_CALLTIMEDISTRIBUTION').html(res.DATA.CALLTIMEDISTRIBUTION[0])

myMap.setXMLData(res.DATA.MAP[0]);

myMap.render("mapContainer");

});

}

 

</script>

 

</head>

 

<body>

 

<div id="outer" style="width:100%">

<div id="inner">

<div id="mapContainer">FusionMaps XT will load here!</div> <br />

<div id="div_AVERAGECALLTIME" class="blocks"></div>

<div id="div_CALLRESULTPERHOUR" class="blocks"></div><br />

<div id="div_CALLRESULT" class="blocks"></div>

<div id="div_CALLTIMEDISTRIBUTION" class="blocks"></div>

</div>

</div>

</body>

</html>

 

Can anybody please help and tell me what I am doing wrong here? Thanks!!

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

Welcome to the FusionCharts forum :)

 

Thank you for the post.

 

Please try including only the FusionCharts.js file and not FusionMaps.js file.

 

However, please make sure that you have placed the FusionCharts.HC.Maps.js and the FusionCharts.HC.usa.js file along side FusionCharts.js file.

 

Hope this helps!

Edited by Bindhu

Share this post


Link to post
Share on other sites

Thanks Bindhu, that worked :)

 

Hi,

 

Welcome to the FusionCharts forum :)

 

Thank you for the post.

 

Please try including only the FusionCharts.js file and not FusionMaps.js file.

 

However, please make sure that you have placed the FusionCharts.HC.Maps.js and the FusionCharts.HC.usa.js file along side FusionCharts.js file.

 

Hope this helps!

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