turing
V2EX  ›  Node.js

Charts 支持主流客户端图表方案的邮件图表嵌入服务

  •  
  •   turing · Mar 12, 2014 · 4777 views
    This topic created in 4468 days ago, the information mentioned may be changed or developed.
    很多时候,在邮件里嵌入图表都是一件很繁琐的事情,尤其当这些数据还是由服务动态生成的。如果你要找一个可以让你的程序发出的邮件既美观又能胜任动态数据图表嵌入这个需求的库或者服务,以往通常有这几种方法:

    1. 在服务器端绘制图表。
    2. 在服务器端截取客户端图表。
    3. 人工在客户端将图表转换成base64编码图片,再由服务端存取。

    Charts 采用了第二种方法,通过 Theme 的支持,Charts 可以判断不同 Url 以匹配不同的 node_modules 中的解决方案目录。然后根据 width,height 与提供的数据,绘制出正确而美观的图片。以嵌入在邮件当中。

    简单来说,就是这样在邮件里嵌入:

    <img src="http://yourserver/sparkline/300x100/1,4,4,7,5,9,10,100,20,12">

    上述链接将会返回一张 inline 的 sparkline 图表,类似这样:


    当然,使用这种解决方案,你还可以自己制作想要的图表解决方案,然后将它们 publish 到 npm,再置于 Charts 的依赖模块目录下,重启服务即可。

    这是一张采用 Chartjs 方案制作的嵌入图表:


    使用 npm 安装:
    $ [sudo] npm install charts -g

    欢迎 Star && fork:
    https://github.com/turingou/charts
    4 replies    1970-01-01 08:00:00 +08:00
    zhangxiao
        1
    zhangxiao  
       Mar 12, 2014
    Mcatt
        2
    Mcatt  
       Mar 13, 2014
    楼主高质高产!
    mtmzorro
        3
    mtmzorro  
       Mar 13, 2014
    STAR 帮顶! ~
    qiuai
        4
    qiuai  
    PRO
       Mar 13, 2014
    漂亮.支持一个~
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2492 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 46ms · UTC 00:51 · PVG 08:51 · LAX 17:51 · JFK 20:51
    ♥ Do have faith in what you're doing.