tester82

Is Fusinmaps responsive to window resizing

Recommended Posts

I have a map with the width and height set to 100% however when I resize the screen the map does not change size like it should.  Is fusionmaps responsive to window resizing ?? How is this done?

 

Share this post


Link to post
Share on other sites

Hi,

 

Do you want the map to occupy the entire page and it should re-size when you re-size your browser window?

 

If yes, please set the width and height of the Div and HTML as 100% using styles in the head section.

 

Ref.

 

<style>

    html,body,div

{

 width:100%,

height:100%

}

 

</style>

 

Hope this helps.

Share this post


Link to post
Share on other sites

Hi there,

 

The map will be inside a div on the page.  Here is an example of some code:

 

    <div id="mapdiv">
                            FusionMaps.</div>
                        <script type="text/javascript">
                       
                                var map = new FusionCharts("../flash/FCMap_World8.swf", "Map1Id", "100%", "100%", "0", "0"); map.setDataURL("../flash/data.xml"); map.render("mapdiv");
 
                            
                            
                           
                        </script>

Share this post


Link to post
Share on other sites
Hi,

 

If you want your map to re-size according to the dimensions of your containing Div, then you may set the dimensions of the map and Div in percentages. You may set the dimensions of HTML,Body,Div elements to 100% and then the dimensions of the map to desired percentage.

 

Ref.

<head>


<style>

html, body { height: 100%; width: 100%; }

div { height: 100%; width: 100%; }

</style>

</head>

<body>


<div id="mapdiv" >FusionMaps.</div>

<script type="text/javascript">

     var map = new FusionCharts("../flash/FCMap_World8.swf", "Map1Id", "30%", "30%", "0", "0"); map.setDataURL("../flash/data.xml"); map.render("mapdiv");

</script>

</body>

 

When you do this, the map will always occupy 30% of the Div. You may try re-sizing the browser window to see the change.

 

Hope this helps.

Share this post


Link to post
Share on other sites

Hi,

 

We created a sample and tested it on IE 8. It seems to be working fine on IE 8 too.

 

Attached the sample for your reference.

 

Do test it at your end and let us know your feedback.

Map -resize.zip

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