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

标签 javascript html css google-chrome svg

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

现在我的屏幕是 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 中它在屏幕上正确显示 我需要在两种浏览器上保持一致的输出。

请帮帮我

最佳答案

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

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

关于javascript - Chrome 和 Firefox 中的 SVG 像素差异,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23312224/

相关文章:

javascript - RESTful cookie 路径在 IE 中失败,没有尾部斜线

javascript - CSP - 允许来自给定目录的我自己的脚本

c# - 从确认框获取值

HTML &lt;input type ='file'> 应用过滤器

html - CSS - 移动按钮出现在不同的区域,不同的设备

javascript - 我们如何使前三列的 html 表格标题固定,而其他所有列都可以滚动

php - Chrome 将 CSS 样式表解释为图像

css - 在选择框中设置单个选项的样式

javascript - 在行分组级别 ag-grid 启用单元格字段的编辑

javascript - 使用 Skrollr.js 制作圆形边框动画