Changing Map Messages | |||||||||||||||||||||
FusionMaps XT allows you to change the various messages that gets displayed to the user like "Loading Map ", "Retrieving data" etc. The following attributes define the different messages for the map: |
|||||||||||||||||||||
|
|||||||||||||||||||||
Using configure() function to set messages | |||||||||||||||||||||
Let's quickly see an example where we edit the map's "Error in loading data " message. This can be effectively useful to debug a map if there is any error present in the data provided. It is recommended to use the configure() function to set map messages. For instance, if you wish to set map LoadDataErrorText message, you need to pass the attribute name and the message text to the configure() function before rendering the map. e.g., <div id="mapContainer">FusionMaps XT will load here</div> <script type="text/javascript"><!-- var myMap = new FusionCharts("FCMap_World.swf", "myMapId", "600", "550", "0", "1"); myMap.setXMLUrl("Wrong.xml"); myMap.configure("LoadDataErrorText", "Map data missing!"); myMap.render("mapContainer"); // --></script> In the above code, we have deliberately provided a wrong xml file (Wrong.xml) that does not exist. Before rendering the map we also called configure() and passed the message type - LoadDataErrorText. The LoadDataErrorTextmessage sets a custom message when the data file does not exist. As the second parameter of the function we pass the custom message that is to be shown in this situation and the message text. To hide a map message please provide a blank space as the custom message. For example, if you wish to disable the map loading message, you may use myMap.configure("PBarLoadingText", " "); It is very easy again to set multiple messages. You can opt to call the configure() function multiple times and set one message at a time. e.g., <div id="mapContainer">FusionMaps XT will load here</div> <script type="text/javascript"><!-- var myMap = new FusionCharts("FCMap_World.swf", "myMapId", "600", "550", "0", "1"); myMap.setXMLUrl("Wrong.xml"); myMap.configure( "LoadDataErrorText", "Map data missing!"); myMap.configure( "InvalidXMLText", "Please validate data"); myMap.render("mapContainer"); // --></script> In case you wish to set all the messages at one go, you can also achieve it calling configure() function once. You need to pass an object to the function, where each message type will be property name and the custom message will be the respective value. For e.g., <div id="mapContainer">FusionMaps XT will load here</div> <script type="text/javascript"><!-- var myMap = new FusionCharts("FCMap_World.swf", "myMapId", "600", "550", "0", "1"); myMap.setXMLUrl("Wrong.xml"); myMap.configure( { "LoadDataErrorText" : "Map data missing!" , "InvalidXMLText" : "Please validate data" }); myMap.render("mapContainer"); // --></script> You can also use the deprecated function addVariable() instead of configure() to do the same things shown above. |
|||||||||||||||||||||
Deprecated method of setting map message | |||||||||||||||||||||
You can also use the deprecated method by passing the message as query string values to the map SWF path in map's constructor. e.g., |
|||||||||||||||||||||
<div id="mapContainer">FusionMaps XT will load here</div> <script type="text/javascript"><!-- var myMap = new FusionCharts("FCMap_World.swf?LoadDataErrorText=Map data missing!", "MapId1", "600", "550", "0", "1"); myMap.setXMLUrl("Wrong.xml"); myMap.render("mapContainer"); // --></script> This method is not supported in JavaScript maps. |
|||||||||||||||||||||
Set background color of the map when map messages are shown | |||||||||||||||||||||
If you wish to set a background color for the map when these messages are shown, you can do this by setting the bgColor parameter of the FusionCharts JavaScript constructor. For e.g., if you wish to set, say, the color purple as the background color while the messages are being shown, your code should be as shown below: <div id="mapContainer">FusionMaps XT will load here</div> <script type="text/javascript"><!-- var myMap = new FusionCharts("FCMap_World.swf", "myMapId", "600", "550", "0", "1", "#DCD8EB"); myMap.setXMLUrl("Wrong.xml"); myMap.configure("LoadDataErrorText", "Map data missing!"); myMap.render("mapContainer"); // --></script> Note that this color actually stays below each map when the map renders with its own background color. You can blend the background color of map and the hidden color below by setting the bgAlpha attribute of XML or JSON of the map, to a value lower than 100. |