저울로 인쇄하기위한 SVG

Question

내 브라우저에 평면을 나타내는 SVG 파일이 있으며 특정 축척으로 출력물을 인쇄해야합니다. SVG 내용을 조작하기 위해 SVG.js를 사용하고 있지만 내 요구를 충족시키기 위해 올바른 뷰포트보기 상자 조합을 찾을 수 없습니다.

제가 아는 것은 SVG 소스 파일 크기입니다. x 및 y 좌표를 통해 평면에서 1cm와 일치하는 올바른 "화면 크기"를 찾기위한 거리를 픽셀 수로 계산했습니다.

인쇄의 경우 "특정 비늘"(예 : 1/50)을 존중해야합니다. 그래서 "화면 크기"와 SVG 파일 크기를 사용하여 실제 크기를 얻으려고했습니다. 그런 다음 전체 크기에 1/50 (0.02) 배율을 적용했습니다. 그런 다음 72dpi 해상도로 여러 픽셀을 추측하려고했습니다. 여기

내 코드입니다 :

var svgNode = SVG(planNode); 

var totalWidthCm = (svgNode.width().replace('px', '') * screenScale * printScaleVal); 
var totalHeightCm = (svgNode.height().replace('px', '') * screenScale * printScaleVal); 
var totalWidthPx = totalWidthCm * 0.393701 * 72; 
var totalHeightPx = totalHeightCm * 0.393701 * 72; 

svgNode.height(totalHeightPx + 'px'); 
svgNode.width(totalWidthPx + 'px'); 

svgNode.viewbox('0', '0', '1000', '600'); 

SVG 출력 상 :

<svg xmlns:cc="http://creativecommons.org/ns#" xmlns:svg="http://www.w3.org/2000/svg" 
    xmlns="http://www.w3.org/2000/svg" version="1.1" width="495.79113386880005px" height="387.87611496479997px" 
    preserveAspectRatio="xMinYMin slice" id="plan" xmlns:xlink="http://www.w3.org/1999/xlink" 
    xmlns:svgjs="http://svgjs.com/svgjs" viewBox="0 0 496 388"> 
    ..... 
</svg> 

사실은 내가 전체 또는 슬라이스를 표시 할 뷰포트 및 뷰 박스를 설정하는 방법을 모르겠입니다 A4 또는 A3 형식으로 인쇄하려면 SVG를 조정하십시오.

오 사랑하는 SVG 전문가, 내 병이 당신을 도달 할 것입니다 희망 : D

Answer 1

당신은 화면에 X 픽셀을 뭔가가 인쇄 할 때 X 픽셀 될 것입니다 사실에 의존 할 수 없다. 눈금을 계산하려면 일부 표본을 인쇄하고 인쇄 된 SVG를 측정해야합니다. 그리고 그것은 브라우저와 프린터간에 다를 것입니다.

먼저 SVG를 화면에 1 : 1로 렌더링되도록 설정하십시오. 이를 수행하려면 width="496" 및 height="388"을 viewBox와 일치하도록 설정하십시오.

알려진 치수를 인쇄하고 측정하십시오. 한 벽과 같은.

따라서 계획시 2m 벽을 인쇄 할 때 53mm라고 가정 해 보겠습니다. 그런 다음 인쇄 길이 스케일 팩터에 실제 길이가

2m = 53mm printed 
worldToPrinterScaleFactor = 53/2000 

이 1 인쇄하는 것입니다 : 객실의 1 규모의 사본을, 당신은 1/worldToPrinterScaleFactor로 (곱하기) 당신의 SVG를 확장해야합니다.

방의 절반 크기 사본을 인쇄하려면 SVG를 0.5/worldToPrinterScaleFactor으로 확장 (곱하기)해야합니다.

하지만 당신은 다음

printScale = 1/50 

당신하여 SVG를 확장 할 필요가 ... 1/50에서 인쇄하기를 원한다면 : 그래서 당신의 JS이어야

printScale/worldToPrinterScaleFactor 

같은 :

를