X 축의 저울 유니폼

Question

동적으로 svg를 생성하므로 높이가 매우 높아질 수 있습니다. (그것은 테이블입니다.) 내 목표는 것입니다 : x 축에

1. 비율
2. 스크롤이
내가 SVG의 height 및 width 놀 알고

아래 이미지를 스크롤, viewBox과 preserveAspectRatio하지만, 내 목표를 달성하기 위해 바닥에 많은 공백을 남기는 더러운 트릭을 사용하고 있습니다. 이미지의 높이를 매우 높게 설정했습니다.

문제는 테이블 (이미지)이이 값을 결코 초과하지 않을 것이라는 점과 (결국 100000과 같은 값으로 설정하는 것을 원하지 않음) 문제입니다.

아무도 도와 줄 수 있습니까?

는 여기에 내가 해결책을 찾기 위해 일하고 있어요 예입니다 :

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 

<svg 
xmlns:svg="http://www.w3.org/2000/svg" 
xmlns="http://www.w3.org/2000/svg" 
version="1.1" 
width="100%" 
height="2000" 
viewBox="0 0 1366 768" 
preserveAspectRatio="xMinYMin meet"> 

<rect 
    width="1359.5181" 
    height="42.065403" 
    x="3" 
    y="3" 
    id="rect2985" 
    style="fill:#ffff78;stroke:#000000;stroke-width:10" /> 
<rect 
    width="719.58691" 
    height="805.50775" 
    x="316.83304" 
    y="177.29433" 
    id="rect2987" 
    style="fill:#ffff78;stroke:#000000;stroke-width:10" /> 
<text 
    x="15" 
    y="30" 
    id="text2989" 
    style="font-size:23px">LOL</text> 
</svg> 

Answer 1

그래, 내가해야 같아요.

지금이를 사용합니다 (아직 돼 완전히 테스트) :

function fixHeight() 
{ 
node = document.getElementById("table"); 
node.setAttribute("height", node.getBBox().width); 
}