سؤال

Ok, so the thing is this,

I have a view wich renders a chart ( .net charts ) and I want the chart to be the same size as the web browser window ( browser will always be IE 9 ).

I have tried several examples but none works for me. Since the chart gets rendered as an Image, I need to know the size of the browser before the charts gets rendered ( this happens on server side ).

My intention is that people can create the chart just by sending parameters thru the URL so having those values from another View or the controller is not an option.

Is there a way to do this? Here is the View Code

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Charts.Master" Inherits="System.Web.Mvc.ViewPage<KpiDataBase.Models.ChartModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<%if (Model.Series != null)
{         
System.Web.UI.DataVisualization.Charting.Chart Chart1 = new System.Web.UI.DataVisualization.Charting.Chart();

Chart1.Width = 1400; -> this are the values that need to be dynamic 
Chart1.Height = 1100;-> this are the values that need to be dynamic 

 ... code for generating the chart....

// Render chart control
Chart1.Page = this;
HtmlTextWriter writer2 = new HtmlTextWriter(Page.Response.Output);
Chart1.RenderControl(writer2);                                 
}%>  
</asp:Content>

Any help would be very appreciated. By searching in the internet I have found that this can only be achieved thru JavaScript. If could run this script:

    <script type="text/javascript">

    function getWidth() {
        var width = $(window).width();}
    return width, height ;
 </script>

 <script type="text/javascript">

    function getHeigth() {
        var height = $(window).height();}
    return height ;
  </script>

And then use those values to render my chart, that would be great.

هل كانت مفيدة؟

المحلول

At the end I used Ajax to perform this.

<script type="text/javascript">
$(document).ready(function () {
    var width = screen.width;
    var height = screen.height;
    $.ajax({
        type: "GET",
        url: "/Charts/Chart",
        data: { 'width': width, 'height': height },
        success: function () {
        }
    });
}); 

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top