Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/78.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/google-chrome/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 在chrome中只有三条路径未正确绘制的简单SVG_Html_Google Chrome_Svg - Fatal编程技术网

Html 在chrome中只有三条路径未正确绘制的简单SVG

Html 在chrome中只有三条路径未正确绘制的简单SVG,html,google-chrome,svg,Html,Google Chrome,Svg,我有以下简单的SVG文件,它绘制了三条对角线: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1

我有以下简单的SVG文件,它绘制了三条对角线:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; fill-rule:evenodd; "
viewBox="0 0 6989 5119"
 xmlns:xlink="http://www.w3.org/1999/xlink">

   <path fill="#000000" d="M4409 930c63,37 125,74 187,112 -1,1 -2,3 -3,4 -62,-37 -124,-74 -187,-111 1,-2 2,-3 3,-5z"/>
   <path fill="#000000" d="M4426 906c62,37 124,74 186,111 -1,2 -2,4 -3,5 -62,-37 -124,-74 -186,-111 1,-2 2,-4 3,-5z"/>
   <path fill="#000000" d="M4442 881c62,38 124,75 186,112 -1,2 -2,3 -3,5 -62,-37 -124,-74 -186,-112 1,-1 2,-3 3,-5z"/>   
</svg>

要在HTML文件中显示SVG,我添加了以下HTML标记:

<object height="1080px" type="image/svg+xml" data="test.svg"></object>

在Firefox中,一切正常,见下图

在Chrome中,中间的线条有问题(见下图)


为什么这在Chrome和Firefox中有所不同?如何让Chrome正确绘制线条?

如果将中间线更改为

<path fill="#000000" d="M4426 906c62,37 124,74 186,111 -1,2 -2,4 -3,5 -62,-37 -124,-74 -186,-111 1,-2 2,-3 3,-5z"/>


它在两种浏览器中都能正常工作。

这对您有效吗


使用曲线渲染的旋转矩形的形状略有不同。使每个形状相同并不能解决我在Chrome上的问题



谢谢,但我看不出您提供的路径有什么不同,我是否遗漏了什么?@Thomas我很抱歉,我没有更改代码。最后必须是-3而不是-4。为什么需要4个贝塞尔来画一条线?