【问题标题】:Problem rendering SVG in Chrome mobile and iOS Safari mobile在 Chrome 移动设备和 iOS Safari 移动设备中呈现 SVG 时出现问题
【发布时间】:2021-04-20 01:07:29
【问题描述】:

Video of the problem

当有屏幕切换或浏览器最小化时会出现问题,并且只发生在 svg 元素上。有没有人遇到过这个?怎么修? imagem here

【问题讨论】:

    标签: ios google-chrome svg mobile render


    【解决方案1】:

    我设法纠正了 通过这篇文章很好

    Clipping path in SVG not working in Safari 还有这个帖子http://tutorials.jenkov.com/svg/clip-path.html 但我不得不做出一些调整……

    我是怎么解决这个问题的

    第一名 必须更改所有sinline svgs之前的内联结构

    之前:[在此处输入图片描述][1] [1]:https://i.stack.imgur.com/W8Pbl.jpg 后: enter image description here

    到目前为止,我已经将所有补丁转换为点

    帮助我完成这项工作的工具:

    第一个关键工具,因为它可以将路径代码转换为多边形的点代码 https://codepen.io/team/amcharts/full/zYORoNE software built on the code pen

    第二个工具用于删除部分不必要的文本,例如花括号 ({}) 空格和逗号,因为转换工具会将结果转换为数组

    http://www.unit-conversion.info/texttools/replace-text/

    第三个删除换行符的工具 https://www.textfixer.com/tools/remove-line-breaks.php

    第四个最后一个工具,但同样重要,因为可以在将其最终插入代码之前直接在线测试 https://www.w3schools.com/graphics/tryit.asp?filename=trysvg_polygon

    这是个好工具

    最终结果:

    之前 before applying any new structure

    之后:after applying any new structure

    我要感谢所有与我合作的开发人员,无论是通过创建免费软件还是发布帖子,我要感谢大家,stackoverflow 的人,谢谢!

    【讨论】:

      猜你喜欢
      • 2020-02-21
      • 1970-01-01
      • 1970-01-01
      • 2018-11-27
      • 2016-11-24
      • 2020-03-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多