javascript - Chrome 和 Firefox 中的 SVG 像素差异

Question

我想在网页上绘制图表。我打算使用 SVG。我需要全屏绘制图表。所以我正在使用 availHeight 和 availWidth 来查找客户端屏幕的高度和宽度并计划缩放它相应地。

现在我的屏幕是 1920 *1080 分辨率。

为了测试我画了一条线如下

<svg height="500" width="1920">
    <line x1="0" y1="50" x2="1900" y2="50" style="stroke:rgb(255,0,0);" />
</svg>

我的问题是在 chrome 中，行溢出屏幕并显示滚动条但在 firefox 中它在屏幕上正确显示我需要在两种浏览器上保持一致的输出。

请帮帮我

Answer 1

为什么你不让它像 SVG 一样响应？我会制作一个容器 div 并使 svg 响应。

这是一个很好的描述:http://soqr.fr/testsvg/embed-svg-liquid-layout-responsive-web-design.php