svg路径的计算(以毫米为单位)

时间:2019-01-31 07:31:11

标签: javascript jquery svg

line_100mm_300dpi

png到svg的转换为我提供了以下输出:

<svg xmlns="http://www.w3.org/2000/svg" id="svg" version="1.1" width="963" height="694" x="0mm"><path id="svgpath" d="M488.000
339.563 C 228.675 525.701,12.725 680.731,8.112 684.074 C 0.525 689.571,-0.128 690.300,1.278 691.706 C 2.684 693.112,19.064 681.613,172.681 571.380 C 266.098 504.346,482.081 349.375,652.642 227.000 C 918.240 36.439,962.624 4.249,961.842 2.750 C 961.340 1.788,960.608 1.029,960.215 1.065 C 959.822 1.101,747.325 153.425,488.000 339.563 " stroke="none" fill="black" fill-rule="evenodd"/></svg>

在浏览器控制台中:

var svgimg = document.getElementById("svg");
var val  = svgimg.x.baseVal;  
console.log(val);

这使我在SVGLength对象下面:

SVGLength {unitType: 7, value: 0, valueInSpecifiedUnits: 0, valueAsString: "0mm"}
unitType: 7
value: 2367.94482421875
valueAsString: "626.519mm"
valueInSpecifiedUnits: 626.5187377929688
__proto__: SVGLength
SVG_LENGTHTYPE_CM: 6
SVG_LENGTHTYPE_EMS: 3
SVG_LENGTHTYPE_EXS: 4
SVG_LENGTHTYPE_IN: 8
SVG_LENGTHTYPE_MM: 7
SVG_LENGTHTYPE_NUMBER: 1
SVG_LENGTHTYPE_PC: 10
SVG_LENGTHTYPE_PERCENTAGE: 2
SVG_LENGTHTYPE_PT: 9
SVG_LENGTHTYPE_PX: 5

此计算告诉我图像中线条的长度为626.519mm 这是不正确的。它的长度是100mm。

我的问题是:这个计算正确吗? 如果是,那么它将覆盖哪些区域进行计算? 如果此计算是正确的,那么正确的计算应该如何计算以毫米或厘米为单位的svg路径长度?

var myPath = document.getElementById("svgpath");
var length = myPath.getTotalLength(); 
console.log(length);

这个长度不能以期望的单位给我长度。它只给我一些没有任何单位的数字。

0 个答案:

没有答案