Python : 用模版渲染SVG作图

2019-03-18 07:55:22 织梦安装使用
  • 文章介绍
子寅 子寅

近期有多个团队之间进行绩效比拼, 思考了下如何通过一张图来既展示业务数据, 又显示比较结果?

情况大致是这样的: 张三李四宋五赵六王二麻子是一组好基友.

这一天, 几个相约做起了一个游戏, 规则是: 选择对手进行比赛, 胜者累计1分, 负者不计分. 以最后的得分相比, 得出胜负.

p = [张三, 李四, 宋五, 赵六, 王二, 麻子]
pks = []
for i, eo in enumerate(p):
   for j, ei in enumerate(p[i+1:]):
       rand = randint(0,1)
       pks.append((eo, ei, rand, 1-rand))

为了展示两两对赛的关系, 和胜负的结果, 作此图:

源码已传至Github

构图处理思路是:

1. 以圆点表示个体

2. 以连线表示两者间对比关系

3. 以mark表示两者间的胜负关系

4. 数字标签

首先, 想到是用百度的echarts来实现, 关系图基本能实现两两之间的关系, 但胜负和数据值处理未找到合适的办法. 再者, 用D3.js来处理, 因为自己不太熟悉语法, 未曾尝试.

前几年曾看过一些SVG相关语法, 依稀尚有印象, 感觉以上几点并不算复杂, 于是乎想到用原生语法来画图.

作图涉及内容点:

1. svg标记语言: circle, path, text, 主要在于理解坐标系的概念, 通过函数运算或偏移得到坐标点.

2. jinja模版语法


    阅读原文

    发送中

    阅读原文

    上一篇:html5点击按钮酷炫云雾动画弹出文字..

    下一篇:没有了

    相关文档推荐

    精品模板推荐

    专业的织梦模板定制下载站,在线购买后即可下载!

    商业源码

    跟版网模板,累计帮助5000+客户企业成功建站,为草根创业提供助力!

    立刻开启你的建站之旅
    
    QQ在线客服

    服务热线

    织梦建站咨询