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

Question

x 방향으로 내 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)

Answer 1

나는 스크롤을 추가하기 위해이 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> 

Answer 2

우선 은 차트가 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의 폭과 높이를 설정하고 내가 설정이다 그래프의 오버 플로우 된 부분을 스크롤하는 래퍼. 이 도움이

희망 ...

Answer 3

그냥

overflow-x: scroll; 

를 추가

div로