Javascript SVG画布、轴和坐标

我是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制作图形/图表等，我强烈建议您查看D3 javascript库。是的，我实际上打算在D3.js中完成所有工作，但我正试图首先了解svg的工作原理。关于如何设置SVG轴、画布和坐标来处理这样的数据，有什么建议吗？你能为我们缩小你的问题范围吗，@Charlie？我已经对我的文章进行了编辑，并进行了澄清。谢谢