evanchai Report post Posted April 1, 2015 (edited) I am try do show a country map and want to click each city in the country ,it can drill down to the next level city map. However I still can not find a method can set the map for each city separately ? Such as click "Shanghai" then drill to "maps/shanghai", click "Beijing" then drill to "maps/beijing" What Can I do ? Thank you in advance. Evan CODE: 1. "data": [ { "id": "CN.SH", "value": "515", "link": "newchart-json-SH" } ] 2. "linkeddata": [{ "id": "SH", "linkedchart": { "chart": { "caption": "Shanghai", "theme": "fint", "formatNumberScale":"0", "numberSuffix":"M", "showLabels": "1", "labelSepChar": ": ", "includeValueInLabels": "1", "useSNameInLabels": "1" } } }] 3. populationMap.configureLink({ "type": "maps/shanghai"}, 0); Edited April 1, 2015 by evanchai Share this post Link to post Share on other sites
Nabajeet Report post Posted April 2, 2015 Hi, You need to set the link attribute in this way: "link": "newchart:(map_name)-(data_format)" Eg: "link": "newchart:asia-json" Please check this fiddle for a demo: http://jsfiddle.net/nabajeet_fusioncharts/jm3otwe7/ You may check this link for more info: http://docs.fusioncharts.com/tutorial-map-guide-adding-drill-down-to-maps.html Thanks, Share this post Link to post Share on other sites
evanchai Report post Posted April 2, 2015 Hi Nabajeet: Thanks for ur advices, it works now , but I have another question. My fusionMap is version 3.7.0,it works well on safari and chrome, but doesn't show any map in the IE8(which is my target users' browser). However, from this link ,http://www.fusioncharts.com/charts/fusionmaps/?map=us-employment-distribution-map, which IE 8 can view the maps there? How can I set my code to meet the requirement on IE8? Thanks in advance. Evan My code is as below: <!doctype html> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]--> <!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]--> <!--[if gt IE 8]><!--> <html class=no-js lang=en> <!--<![endif]--> <head> <title>A Data Driven Map</title> <script type="text/javascript" src="js/fusioncharts.js"></script> <script type="text/javascript" src="js/themes/fusioncharts.theme.fint.js"></script> <script> FusionCharts.ready(function () { var populationMap = new FusionCharts({ type: 'maps/world', renderAt: 'chart-container', width: '600', height: '400', dataFormat: 'json', dataSource: { "chart": { "caption": "Global Population", "theme": "fint", "formatNumberScale":"0", "numberSuffix":"M" }, "colorrange": { "color": [ { "minvalue": "0", "maxvalue": "100", "code": "#E0F0E0", "displayValue" : "Below 100M" }, { "minvalue": "100", "maxvalue": "500", "code": "#D0DFA3", "displayValue" : "100-500M" }, { "minvalue": "500", "maxvalue": "1000", "code": "#B0BF92", "displayValue" : "500-1000M" }, { "minvalue": "1000", "maxvalue": "5000", "code": "#91AF64", "displayValue" : "Above 1B" } ] }, "data": [ { "id": "NA", "value": "515" }, { "id": "SA", "value": "373" }, { "id": "AS", "value": "3875" }, { "id": "EU", "value": "727" }, { "id": "AF", "value": "885" }, { "id": "AU", "value": "32" } ] } }).render(); }); </script> </head> <body> <div id="chart-container">A world map will load here!</div> </body> </html> Share this post Link to post Share on other sites
Nabajeet Report post Posted April 3, 2015 Hi, We have tested your code in IE8 and it is running fine. Please check screenshot. Thanks. Share this post Link to post Share on other sites
