I am developing a web application which has Chart Controls. I have developed a common chart User Control to use across the application.
I am looking for an elegent way to set the Chart control's along with other control's width, height based on the screen(browser size).
Please help me Thanks Shaik
Generally speaking, the easiest way to size an element relative to the client screen is to give it a width specified as a percentage (e.g. 25%). You can also size an object relative to the font size by specifying the width in terms of ems (e.g. 10em).
If percentages won't work, then the alternative is to use JavaScript to resize the object dynamically in the client's browser. The downside to this is that JavaScript has to interact with the HTML elements that make up the control, rather than acting on the control directly.
Sounds like you want to resize a server-side dynamic image based on a client-side value. You would first need to load the page once, use Javascript to get the screen size. (Google for that. You can get the full cross browser technical list of which Javascript elements to use at Quirksmode.org, but you'll still need to figure out how to write the script yourself.) Then, post that size back to the server, set the control with this new size, then render it to the client as usual. Keep in mind, if the user resizes the browser window at all it won't "fit" anymore. And you can always use percentage sizes with CSS like Aaron mentioned, but then of course the browser will resize the image, which never looks that good.
Another alternative would be to put it in a Flash control. Those resize dynamically better usually, as long as the chart is rendered with vector elements by Flash.
Either way, you'll want to make sure that this makes sense for your web design. Some times its good to make it dynamic, other times a certain amount of static size makes sense--all depends on lots of stuff, including whether or not its worth it to go to all that trouble.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With