I am developing a web application which has Chart Controls. I have developed a common chart User Control to use across the application.
我正在开发一个具有图表控件的Web应用程序。我开发了一个通用的图表用户控件来在整个应用程序中使用。
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).
我正在寻找一种方法来设置Chart控件以及其他控件的宽度,高度(基于屏幕)(浏览器大小)。
Please help me Thanks Shaik
请帮我谢谢谢克
4 个解决方案
#1
3
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.
听起来您想要根据客户端值调整服务器端动态图像的大小。您首先需要加载页面一次,使用Javascript来获取屏幕大小。 (Google就是这样。您可以在Quirksmode.org上获得要使用哪些Javascript元素的完整跨浏览器技术列表,但是您仍然需要弄清楚如何自己编写脚本。)然后,将该大小发布回到服务器,使用此新大小设置控件,然后照常将其呈现给客户端。请记住,如果用户完全调整浏览器窗口的大小,它将不再“适合”。并且您可以随时使用像Aaron所提到的CSS的百分比大小,但当然浏览器会调整图像的大小,这看起来不那么好。
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.
另一种选择是将其置于Flash控件中。只要图表由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.
无论哪种方式,您都希望确保这对您的网页设计有意义。有时候它有利于使它变得动态,有时候一定量的静态大小是有意义的 - 所有这些都取决于很多东西,包括它是否值得去解决所有麻烦。
#2
4
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).
一般来说,相对于客户端屏幕调整元素大小的最简单方法是给它指定一个百分比宽度(例如25%)。您还可以通过以ems(例如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.
如果百分比不起作用,那么替代方法是使用JavaScript在客户端的浏览器中动态调整对象的大小。这样做的缺点是JavaScript必须与构成控件的HTML元素进行交互,而不是直接对控件进行操作。
#3
1
A product from Cyscape called "Browserhawk" http://www.cyscape.com/showbrow.aspx will provide you with the information you need to make the correct rendering decisions on the server side.
来自Cyscape的名为“Browserhawk”的产品http://www.cyscape.com/showbrow.aspx将为您提供在服务器端做出正确渲染决策所需的信息。
#4
0
a hidden div set to 100% by 100% can be used to tell you the browser window client area size; i don't think there is a way to measure the screen without a postback/callback
隐藏的div设置为100%100%可用于告诉您浏览器窗口客户区的大小;我不认为有一种方法可以在没有回发/回调的情况下测量屏幕
see How to implement a web page that scales when the browser window is resized for additional info
请参阅如何实现在调整浏览器窗口大小以获取其他信息时进行扩展的网页
#1
3
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.
听起来您想要根据客户端值调整服务器端动态图像的大小。您首先需要加载页面一次,使用Javascript来获取屏幕大小。 (Google就是这样。您可以在Quirksmode.org上获得要使用哪些Javascript元素的完整跨浏览器技术列表,但是您仍然需要弄清楚如何自己编写脚本。)然后,将该大小发布回到服务器,使用此新大小设置控件,然后照常将其呈现给客户端。请记住,如果用户完全调整浏览器窗口的大小,它将不再“适合”。并且您可以随时使用像Aaron所提到的CSS的百分比大小,但当然浏览器会调整图像的大小,这看起来不那么好。
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.
另一种选择是将其置于Flash控件中。只要图表由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.
无论哪种方式,您都希望确保这对您的网页设计有意义。有时候它有利于使它变得动态,有时候一定量的静态大小是有意义的 - 所有这些都取决于很多东西,包括它是否值得去解决所有麻烦。
#2
4
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).
一般来说,相对于客户端屏幕调整元素大小的最简单方法是给它指定一个百分比宽度(例如25%)。您还可以通过以ems(例如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.
如果百分比不起作用,那么替代方法是使用JavaScript在客户端的浏览器中动态调整对象的大小。这样做的缺点是JavaScript必须与构成控件的HTML元素进行交互,而不是直接对控件进行操作。
#3
1
A product from Cyscape called "Browserhawk" http://www.cyscape.com/showbrow.aspx will provide you with the information you need to make the correct rendering decisions on the server side.
来自Cyscape的名为“Browserhawk”的产品http://www.cyscape.com/showbrow.aspx将为您提供在服务器端做出正确渲染决策所需的信息。
#4
0
a hidden div set to 100% by 100% can be used to tell you the browser window client area size; i don't think there is a way to measure the screen without a postback/callback
隐藏的div设置为100%100%可用于告诉您浏览器窗口客户区的大小;我不认为有一种方法可以在没有回发/回调的情况下测量屏幕
see How to implement a web page that scales when the browser window is resized for additional info
请参阅如何实现在调整浏览器窗口大小以获取其他信息时进行扩展的网页