나는이처럼 보이는 ASP 차트가

x 방향으로 내 ASP 차트를 스크롤 가능하게하는 방법 :나는이처럼 보이는 ASP 차트가

<asp:Chart ID="Chart1" runat="server" BorderlineColor="Black" 
    BorderlineDashStyle="Solid" BackColor="#B6D6EC" BackGradientStyle="TopBottom" 
    BackSecondaryColor="White" Height="700px" Width="1800px" onload="Chart1_Load" 
        style="margin-top: 0px; margin-left: 10px; OVERFLOW-X:scroll;"> 

    <ChartAreas> 
     <asp:ChartArea Name="ChartArea1"> 
     </asp:ChartArea>  
    </ChartAreas> 
    <Titles> 
     <asp:Title Alignment="TopCenter" Font="Verdana, 12pt, style=Bold" Name="Title1" 
            Text="Graph" ForeColor="Blue"> 
     </asp:Title> 
    </Titles> 
</asp:Chart>

당신은 내가 내 차트를 스크롤 할 것이라고 생각 일부 CSS를 추가 한 볼 수를 :

OVERFLOW-X : 스크롤;

그러나 이것은 작동하지 않습니다. 또한 div에이 차트를 캡슐화하고 div를 스크롤 가능하게 만들려고 시도했지만 차트가 페이지 밖으로 확장됩니다. 이 차트를 페이지 내에서 스크롤 할 수있게하고 차트 크기를 유지하십시오 (700px x 1800x1200)

출처

2014-04-10 R Doolabh

차트를 스크롤 가능한 DIV *로 놓고 div 고정 된 크기를 입력하면. "700x700"이 효과가 있습니까? –

나는 그것을 시도했다. 고정 치수를 설정하면 작동합니다. 그러나 차트 크기에 따라 차트를 확장 할 수 있습니다. 그래서 내 div의 너비와 높이가 100 %가되도록하고 싶습니다. –

퍼센트로 설정하지 마십시오. 윈도우의'resize' 이벤트를 잡아서 DIV의 크기를 픽셀 단위로 설정하십시오. –

나는 스크롤을 추가하기 위해이 jQuery를 추가 할 수 있었다 그것은 큰 일 : 나는이 같은 사업부 내 차트를 포함

<script class="code" language="javascript" type="text/javascript"> 
    $(document).ready(function() { 
     var window_width = $(window).width() - 280; 
     $("#chartdiv").css("width", window_width + "px"); 
    }); 

    $(window).resize(function() { 
     var window_width = $(window).width() - 280; 
     $("#chartdiv").css("width", window_width + "px"); 
    }); 
</script>

<div id="chartdiv" style="overflow-x: scroll;"> 
    CHART GOES HERE 
</div>

출처

2014-04-18 16:53:35

우선 은 차트가 img 태그로 렌더링되고 오버플로를 설정할 수 없으므로 차트와 작동하지 않습니다. 이미지로. 당신이 당신의 페이지 제목에 뷰포트 메타 태그를 설정해야

첫째 : 내가 제대로을 받았다면 나는이 당신을 위해 무엇을 찾고있을 거라고 생각

, 그것을 시도

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />

그리고 영문 페이지 :

//The left div you mentioned in the comment 
<div id="lefty" style="float:left;width:18vw;height:100vh;border:1px solid #000;"></div> 
//The wrapper div of the chart 
<div id="wrap" style="width:80vw;height:100vh;overflow:scroll;"> 
    <asp:Chart ID="Chart1" runat="server" BorderlineColor="Black" 
       BorderlineDashStyle="Solid" BackColor="#B6D6EC" BackGradientStyle="TopBottom" 
       BackSecondaryColor="White" Height="600px" Width="1800px" Style="height:100%;"> 

       <ChartAreas> 
        <asp:ChartArea Name="ChartArea1"> 
        </asp:ChartArea> 
       </ChartAreas> 
       <Titles> 
        <asp:Title Alignment="TopCenter" Font="Verdana, 12pt, style=Bold" Name="Title1" 
         Text="Graph" ForeColor="Blue"> 
        </asp:Title> 
       </Titles> 
      </asp:Chart> 
</div>

간단히, 내가 무슨 짓을했는지 나는 뷰포트의 폭과 높이의 폭과 높이의 비율로 래퍼 DIV의 폭과 높이를 설정하고 내가 설정이다 그래프의 오버 플로우 된 부분을 스크롤하는 래퍼. 이 도움이

희망 ...

출처

2014-04-15 21:31:10

응답 @KarimAG에 감사드립니다. 뷰포트 메타 태그를 사용하여 접근 방식을 시도했을 때 x 방향으로 스크롤을 적용했습니다. 그러나 여전히 차트의 너비와 높이를 설정하고 있습니다. 이 때문에 차트는 화면의 측면에서 계속 실행되며 스크롤은 적은 양만 스크롤합니다. 내가 제안하고있는 동적 div에 맞게 차트를 맞추려면 어떻게해야합니까? 감사 –

-1

그냥

overflow-x: scroll;

를 추가

div로

출처

2014-04-22 10:27:24 Jean

나는이처럼 보이는 ASP 차트가

답변

관련 문제