Giter Club home page Giter Club logo

Comments (4)

TransparentLC avatar TransparentLC commented on July 28, 2024

以前也有人报告过类似的问题 #49

我自己也发现过有错位现象，不过我自己测试的结果是不论是桌面还是 F12 模拟的手机界面都只有 Firefox 下才会错位而使用 Edge 就没有问题。

这个截图是用 html2canvas 生成的，朋友圈部分 #fakeWechatMoment 的 HTML 在浏览器里直接显示起来是没有问题的，不知道是不是这里有什么 html2canvas 支持不太好的部分……总之这个问题不太好修复的样子。

from wechatmomentscreenshot.

cqsn558 avatar cqsn558 commented on July 28, 2024

不知道到底是html2canvas的问题还是浏览器问题，这段时间我也在做网页生成海报的功能，也有这种情况，电脑端和手机端生成的都有一部分差距，我是尽量少的用CSS，用常用的CSS，不知道html2canvas对哪些CSS支持不太好，也发现在手机端用不同的浏览器也有点区别，可能两者都有一定关系吧。

from wechatmomentscreenshot.

TransparentLC avatar TransparentLC commented on July 28, 2024

Features - html2canvas

还有些是 Limited support 的样子……

如果是那种一张封面图一个标题一个摘要一个二维码这种简单的海报用 html2canvas 还好，复杂布局想要保证效果的话更常见的做法似乎是直接在服务端用 Selenium 或者 Puppeteer 跑浏览器？

from wechatmomentscreenshot.

cqsn558 avatar cqsn558 commented on July 28, 2024

以前做海报生成用background-image设置背景图始终有问题，最后改为 才成功，html2canvas虽然支持一些css属性，但觉得支持得也不太好，像复杂的情况直接用js的canvas绘画可能还好点，前端处理比后端处理好，对于站长来说。不过像有些内容是动态的可能就不好调整了。

from wechatmomentscreenshot.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.