FusionCharts - Global population map by continent - Entity Events
Created using FusionCharts Suite XT - www.fusioncharts.com
by Soumya Dutta
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.maps.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<script src="http://static.fusioncharts.com/code/latest/maps/fusioncharts.world.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<div id="chartcontainer" style="width:561px"></div>
<div id="linkedchart-container"></div>
<div id="linkedchart-container2"></div>
CSS
/*! jQuery UI - v1.10.3 - 2013-12-10
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.resizable.css, jquery.ui.button.css, jquery.ui.dialog.css, jquery.ui.tabs.css, jquery.ui.theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Trebuchet%20MS%2CTahoma%2CVerdana%2CArial%2Csans-serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=f6a828&bgTextureHeader=gloss_wave&bgImgOpacityHeader=35&borderColorHeader=e78f08&fcHeader=ffffff&iconColorHeader=ffffff&bgColorContent=eeeeee&bgTextureContent=highlight_soft&bgImgOpacityContent=100&borderColorContent=dddddd&fcContent=333333&iconColorContent=222222&bgColorDefault=f6f6f6&bgTextureDefault=glass&bgImgOpacityDefault=100&borderColorDefault=cccccc&fcDefault=1c94c4&iconColorDefault=ef8c08&bgColorHover=fdf5ce&bgTextureHover=glass&bgImgOpacityHover=100&borderColorHover=fbcb09&fcHover=c77405&iconColorHover=ef8c08&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=fbd850&fcActive=eb8f00&iconColorActive=ef8c08&bgColorHighlight=ffe45c&bgTextureHighlight=highlight_soft&bgImgOpacityHighlight=75&borderColorHighlight=fed22f&fcHighlight=363636&iconColorHighlight=228ef1&bgColorError=b81900&bgTextureError=diagonals_thick&bgImgOpacityError=18&borderColorError=cd0a0a&fcError=ffffff&iconColorError=ffd27a&bgColorOverlay=666666&bgTextureOverlay=diagonals_thick&bgImgOpacityOverlay=20&opacityOverlay=50&bgColorShadow=000000&bgTextureShadow=flat&bgImgOpacityShadow=10&opacityShadow=20&thicknessShadow=5px&offsetTopShadow=-5px&offsetLeftShadow=-5px&cornerRadiusShadow=5px
* Copyright 2013 jQuery Foundation and other contributors; Licensed MIT */
.ui-helper-hidden{display:none}.ui-helper-hidden-accessible{border:0;clip:rect(0 0 0...
JavaScript
showChart_jquery();
var myChart3 = '', dialog, dialog2;
dialog = $('#linkedchart-container').dialog({
open: function(e, ui) {
$('#linkedchart-container').dialog();
},
autoOpen: false,
width: 400,
height: 320,
title: 'LinkedCharts in jQuery Dialog'
});
dialog2 = $('#linkedchart-container2').dialog({
open: function(e, ui) {
$('#linkedchart-container2').dialog();
},
position: [50, 1800],
autoOpen: false,
width: 400,
height: 300,
title: 'Second level LinkedCharts'
});
function showChart_jquery() {
var data="<chart caption='Annual Sales Summary (2010-2013)' subcaption='Click on a column to drill-down' numberPrefix='$' showValues='0' bgColor='FFFFFF' xAxisName='Year' plotGradientColor='' showAlternateHGridColor='0' showPlotBorder='0' divLineColor='CCCCCC' canvasBorderAlpha='0'> <set label='2010' value='1161000' link='newchart-xml-2010Quarters' color='008ee4'/> <set label='2011' value='1043000' link='newchart-xml-2011Quarters' color='6baa01'/> <set label='2012' value='1017000' link='newchart-xml-2012Quarters' color='f8bd19'/> <set label='2013' value='1156000' link='newchart-xml-2013Quarters' color='e44a00'/> <linkeddata id='2010Quarters'> <chart caption='Quarterly Sales Summary (2010)' subcaption='Click on a column to drill-down' xAxisName='Quarter' yAxisName='Sales' numberPrefix='$' showValues='0' bgColor='FFFFFF' plotGradientColor='' showAlternateHGridColor='0' showPlotBorder='0' divLineColor='CCCCCC' canvasBorderAlpha='0'> <set label='Q1' value='274000' link='newchart-xml-2010Q1' color='008ee4'/> <set label='Q2' value='270000' link='newchart-xml-2010Q2' color='008ee4'/> <set label='Q3' value='318000' link='newchart-xml-2010Q3' color='008ee4'/> <set label='Q4' value='299000' link='newchart-xml-2010Q4' color='008ee4'/> <linkeddata...