相关疑难解决方法(0)

我正在试验SVG元素.我试图创建一个简单的半圆但我的半圆由于某种原因旋转？如何让半圆不旋转？

我的方法是:

• SVG'画布'是400乘400px,半圆的半径为180px
• MoveTo点:20,200 - M20,200
• LineTo:画一条长360px的线并且不改变y位置--L360,0
• ArcTo:画圆弧完成圆弧,圆弧半径为180px - A180,180 0 0,1 20,200

在代码中,这是:

<svg width="400" height="400">
    <path d="M20,200 L360,0 A180,180 0 0,1 20,200 z"
        style="fill:#ff0000;
            fill-opacity: 1;
            stroke:black;
            stroke-width: 1"/>
</svg>

PS:如果我想创建一个只有275度的饼图,最好的方法是制作2条路径,一条180度(上半圈)和另一条90度的路径？或者是否可以用1 Path创建它？那么有人会非常友好地展示一个示例SVG代码吗？

我希望能够将数字/百分比传递给填充 svg 一部分的函数。例如，在一个桶的 svg 中，如果现实生活中的桶被填充了 90% 并且它返回 10 升作为整数我希望我网站上的桶 svg 用蓝色填充 90%。

我相信您可以将 SVG 分成带有 ID 的部分，并根据传递函数的数量填充每个 ID，然后使用某种 jquery 函数编辑每个部分？但是，我觉得只填充 SVG 的一部分肯定是更受欢迎的事情，但我一直无法找到一种直接/简单的方法来做到这一点？