natg504 Report post Posted July 25, 2012 I would like to create a map of our company's district, which includes parts of 4 states. Using the example provided in MyFirstMap.fla, I have created a customized map, but I am still having some issues. It loads when I use the FusionCharts.js, but it does not work correctly with FusionMaps.js, so I can't use some of those functions with it. If I use FusionMAPS.js, it will load when I use setDataXML with a string, although the width & height & scale are not correct. If I use an external XML file and setDataURL, it will just display part of the map that is blacked-out. In both cases these maps are cropped and enlarged, so it's ignoring the width & height I sent in the variables. If I use it as a FusionChart instead of FusionMap, this works and it's displayed correctly. I just have other issues in that case with not being able to use some functions I want to use. ============================================ MY HTML CODE ============================================ <HEAD> <TITLE>FusionMaps & JavaScript - Updating map using setDataURL() Method</TITLE> <script LANGUAGE="Javascript" SRC="assets/js/FusionMaps.js"></SCRIPT> <script LANGUAGE="JavaScript"> function updateMap(datafile){ //Get reference to map object using Dom ID var mapObj = FusionCharts("map1Id"); //Update its URL mapObj.setDataURL("data/"+datafile+".xml"); mapObj.render("map1div"); } </SCRIPT> </HEAD> <BODY> <div id="map1div"> FusionMaps </div> <script language="JavaScript"> var map1 = new FusionMaps("assets/charts/ourdistrict.swf", "map1Id", "750", "400", "1", "1"); map1.setDataURL("data/ourDistrict_data.xml"); //map1.setDataXML("<map showCanvasBorder='1' canvasBorderColor='f1f1f1' canvasBorderThickness='2' borderColor='00324A' fillColor='F0FAFF' hoverColor='C0D2F8'></map>"); map1.render("map1div"); </script> <form name='frmUpdate'> <input name="mapOpt" type="radio" value="ourDistrict_data" onChange="javaScript:updateMap(this.value);" />ourDistrict_data <input name="mapOpt" type="radio" value="ourDistrict_population" onChange="javaScript:updateMap(this.value);" />ourDistrict_population </form> </BODY> </HTML> ============================================ MY ACTIONSCRIPT CODE IN THE .FLA FILE ============================================ #include "com/fusionmaps/includes/LoadingFunctions.as" #include "com/fusionmaps/includes/AppMessages.as" //initialize variables var stageWidth = 600; var stageHeight = 450; var chartX = 0; var chartY = 0; var chartDebugMode = false; var xmlFile = ""; var xmlString = ""; //flashVars chartWidth = _root.chartWidth; chartHeight = _root.chartHeight; if (_root.debugMode == "1"){ chartDebugMode = true; } xmlFile = _root.dataURL; xmlString = _root.dataXML; //set chart position var chartX = (stageWidth - chartWidth)/2; var chartY = (stageHeight - chartHeight)/2; // -------------- Actual Code to create the map ------------// //To create a map, you first need to create an empty movie clip to act as map holder. var mapContainerMC:MovieClip = this.createEmptyMovieClip("MapHolder", 1); // ------------- XML Data for the map -------------- // if (xmlString != ""){ var OurDistrict_Data:XML = new XML(xmlString); loadMap(); }else{ var OurDistrict_Data:XML = new XML(); OurDistrict_Data.ignoreWhite = true; OurDistrict_Data.load(xmlFile); } // --------------------------------------------------- // OurDistrict_Data.onLoad = function(success) { if (success) { loadMap(); } }; function loadMap(){ //Now, instantiate the map using Constructor function of the map. //Convey the XML data to map. var myMap:OurDistrictMap = new OurDistrictMap(mapContainerMC, 1, chartWidth, chartHeight, chartX, chartY, chartDebugMode, "EN", "exactFit", false, ""); myMap.setXMLData(OurDistrict_Data); //Draw the map myMap.render(); } //Stop stop(); Share this post Link to post Share on other sites
Sanjukta Report post Posted July 31, 2012 Hi, Could you please confirm if you have customized the map source file by yourself? Also, please mail us at "[email protected]" for further details on this. Share this post Link to post Share on other sites
