Question

我是SVG的新手。

我正在尝试将画布设置为宽度（浏览器窗口的100％）。没问题。

对于x轴，100％宽度相当于10秒。

对于y轴，我想用毫米来表示单位。

我的数据看起来像这样：

x (sec)     y (μV/mm)
0           1.898876286
0.001953    0.987415571
0.003906    -1.898876286
0.005859    -4.139550286
0.007813    -0.911460571
0.009766    1.822921286
0.011719    1.974831286
0.013672    7.36764
0.015625    6.570112
0.017578    4.291460286
0.019531    1.519101
0.021484    -2.962247
0.023438    -4.215505429
.... many more .......

我的目标是制作包含此数据的折线图。

有人能让我开始走正确的道路吗？

----------编辑----------

我稍微修改了上面的数据，使其更容易理解。我正在使用SVG路径绘制数据，如下所示：

<svg width="100%"  height="100%">
<path d="M0,1.898876286
        L1.001953,0.987415571
        L2.003906,-1.898876286
        L3.005859,-4.139550286
        L4.007813,-0.911460571
        L5.009766,1.822921286
        L6.011719,1.974831286
        L7.013672,7.36764
        L8.015625,6.570112
        L9.017578,4.291460286
       style="stroke:#660000; fill:none;" />    
</svg>

我的问题是如何定义SVG的x轴和y轴的单位？

我的数据的x轴值是秒。 y轴是毫米。

100％的屏幕宽度应相当于10秒，因此屏幕宽度的10％相当于1秒。

y轴应将数据解释为毫米。

我希望上面的数据在整个浏览器屏幕上绘制为水平摇摆线，波浪的高度（幅度）在大约-4到7毫米之间。

这更有意义吗？

SVG画布，轴和坐标

0 个答案: