不使用 javascript 的电子邮件中的 Html 图表 [关闭]

Posted

技术标签:

【中文标题】不使用 javascript 的电子邮件中的 Html 图表 [关闭]【英文标题】:Html charts in email without using javascript [closed] 【发布时间】:2014-04-10 16:14:11 【问题描述】:

我正在为我的时事通讯寻找漂亮的图表。由于 javascript 对电子邮件不友好,我需要一个仅 html 的解决方案。

我会每月发送一次电子邮件,其中包含用户在当月的表现和完成的事情的统计数据。

那么您认为最好的解决方案是什么? 我能找到一些不错的基本 html 图表,我可以在后端对用户数据进行少量更改吗?

我知道使用 JS 会很容易,但不是我的情况。 我会同时发送到手机和桌面。

非常感谢!!

【问题讨论】:

这可能有用,github.com/ryanrolds/quiche 您可以像使用developers.google.com/chart/image 一样简单地使用<img src="https://chart.googleapis.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World" /> image-charts.com/chart 就是为此而建的???? (它是已弃用的 Google Image-Charts 的替代品)......它还支持 gif 动画???? 如果您将 Chart.js 用于您的 Javascript 图表,请查看 quickchart.io。这是一个开源网络服务,可将 Chart.js 转换为可嵌入电子邮件中的图像。 您好,有点晚了,不过您也可以使用charttt.com 生成可以嵌入到电子邮件中的图像图表 【参考方案1】:

这里的游戏有点晚了,但我在 Ramen 的团队最近将一些内部功能分离到一个独立的产品中:https://ChartURL.com

您可以使用“加密 URL”方案动态生成图表,或者您可以向我们发送大量数据并返回将解析为图像的短 URL。这些 URL 可用于网络应用和移动应用,但最初的意图是电子邮件图表,所以我希望这会有所帮助!

【讨论】:

很有趣的概念,我试试看! 看起来真的很酷:) 不工作了:(【参考方案2】:

我建议不要尝试附加基于 js/css/html 的图表,您会遇到很多问题。我在这里写了一个关于将图表生成为图像并附加到电子邮件的教程:http://www.sqldashboards.com/b/send-email-with-graphs/ 基本上是你

    配置 mutt 以允许发送电子邮件 在命令行生成图表。 使用 mutt 发送带有附件的电子邮件

【讨论】:

【参考方案3】:

您可以使用任何您想要预先发送的脚本语言,但电子邮件本身需要是纯 html。发送后更改其内容的唯一方法是将其链接到托管图像,然后换出该图像。

话虽如此,如果您正在寻找一个带有图表的 html 电子邮件示例以开始使用,take a look here。它是一种流畅的模板,是移动、网络和桌面浏览器支持最广泛的技术。

【讨论】:

【参考方案4】:

您不能简单地使用原始HTML 来获取图表。这根本不可能,只能使用脚本语言来做到这一点,HTML 不是。

如果你愿意使用CSS3 让你的图表成为现实,我建议你看看这篇好文章:http://www.ssiddique.info/dynamic-chart-in-css.html

【讨论】:

是的,我知道,这就是为什么我的想法是在后端编写脚本部分并发送已格式化的电子邮件,显示仅使用 html 内容制作的图表。无论如何,我怎么能包含在电子邮件客户端接受的电子邮件脚本中? 您愿意使用哪些语言? 任何语言,重要的是脚本可以被客户阅读。例如 Gmail 不接受 javascript,所以我不能将它用于图表。 我现在更清楚地理解了您的问题。你必须使用纯 html5 和 css3,查看我给你的链接:ssiddique.info/dynamic-chart-in-css.html【参考方案5】:

最好的办法是生成图像并发送它们,因为您不能使用纯 html 来制作图表。

【讨论】:

图片是个好主意,但我担心处理和电子邮件负载会很重 @gigilatrottola 恐怕这可能是实现这一目标的唯一方法。如果需要,您可以将其设为 GIF 格式,其尺寸会非常小,并且不会像普通图片那样影响电子邮件的处理和大小。【参考方案6】:

尝试创建动画 gif。

http://www.emailology.org/ 可能有适合你的东西。

【讨论】:

以上是关于不使用 javascript 的电子邮件中的 Html 图表 [关闭]的主要内容,如果未能解决你的问题,请参考以下文章

Javascript 中的 preventDefault 停止发送电子邮件

如何使 Ninja Forms 3.1 中的字段唯一?

电子邮件模板中的图像 url 发生更改,图像无法正确显示 [重复]

JavaScript javascript中的有效电子邮件

JavaScript JavaScript中的电子邮件验证

基于Web的JavaScript电子表格