python用Pygal如何生成漂亮的SVG图像详解


Posted in Python onFebruary 10, 2017

前言

SVG可以算是目前最最火热的图像文件格式了,它的英文全称为Scalable Vector Graphics,意思为可缩放的矢量图形。它是基于XML(Extensible Markup Language),由World Wide Web Consortium(W3C)联盟进行开发的。严格来说应该是一种开放标准的矢量图形语言,可让你设计激动人心的、高分辨率的Web图形页面。用户可以直接用代码来描绘图像,可以用任何文字处理工具打开SVG图像,通过改变部分代码来使图像具有交互功能,并可以随时插入到HTML中通过浏览器来观看。

First Head in Pygal

首先安装 pygal 啦:

pip install pygal

如果你要把生成格式设为除了 svg 之外的格式,如 png,jpg 之类,就要安装底下几个库了:

pip install lxml

在 Ubuntu 中按照如下提示安装即可:

sudo apt-get install libxml2-dev libxslt1-dev python-dev
sudo apt-get install python-lxml
pip install cairosvg

安装该库原理同上:

sudo apt-get install python-cairosvg

如下两个库,只需正常 pip 安装即可:

pip install tinycss

pip install cssselect

Hello SVG

import pygal              
bar_chart = pygal.Bar()           
bar_chart.add('Fibonacci', [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55]) 
bar_chart.render_to_file('Hello.svg')

生成的是黑色的 Hello.svg 文件,因为是 svg 格式的,一般的话直接是不能打开的,选择默认的浏览器打开吧,看到就是底下这个样子:

python用Pygal如何生成漂亮的SVG图像详解

更加炫酷点的图:

import pygal
line_chart = pygal.Line()
line_chart.title = 'Browser usage evolution (in %)'
line_chart.x_labels = map(str, range(2002, 2013))
line_chart.add('Firefox', [None, None, 0, 16.6, 25, 31, 36.4, 45.5, 46.3, 42.8, 37.1])
line_chart.add('Chrome', [None, None, None, None, None, None, 0, 3.9, 10.8, 23.8, 35.3])
line_chart.add('IE',  [85.8, 84.6, 84.7, 74.5, 66, 58.6, 54.7, 44.8, 36.2, 26.6, 20.1])
line_chart.add('Others', [14.2, 15.4, 15.3, 8.9, 9, 10.4, 8.9, 5.8, 6.7, 6.8, 7.5])
line_chart.render_to_file('Hello_line_chart.svg')

生成的图就是下面这个样子:

python用Pygal如何生成漂亮的SVG图像详解

Hello PNG

有时候,我们不需要 svg,只需要 png 格式的图表,没关系,pygal 也能够做到:

import pygal
bar_chart = pygal.Bar()
bar_chart.add('Fibonacci', [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55])
bar_chart.render_to_file('bar_chart.svg')
# 生成 png 格式图表
bar_chart.render_to_png(filename='bar_chart.png')

注意绿色的标示,成功生成 png 格式的图片啦:

python用Pygal如何生成漂亮的SVG图像详解

Hello Flask and Pygal

让 Pygal 生成的 svg 格式图片中,显示在你的网页上呗,我们选择 flask 来提供 web 支持:

pip install flask

核心代码如下,没错就是这么短:

import pygal
from flask import Flask, Response

app = Flask(__name__)

@app.route('/')
def index():
 return 
"""
 <html>
 <body>
  <h1>hello pygal and flask</h1>
  <figure>
  <embed type="image/svg+xml" src="/hellosvg/" />
  </figure>
 </body>
 </html>'
"""

@app.route('/hellosvg/')
def graph():
 """ render svg graph """
 bar_chart = pygal.Bar()
 bar_chart.add('Fibonacci', [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55])
 return Response(response=bar_chart.render(), content_type='image/svg+xml')

if __name__ == '__main__':
 app.run()

打开 127.0.0.1:5000 就能看到下面的样子咯:

python用Pygal如何生成漂亮的SVG图像详解

当然咯,你还可以做出如下更为炫酷的 svg 图像,不过这一切都是 pygal 的用法啦:

python用Pygal如何生成漂亮的SVG图像详解

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果想学习更多内容还请移步 pygal 官方文档吧。希望本文的内容对大家能有一定的帮助。

Python 相关文章推荐
Python中pygame的mouse鼠标事件用法实例
Nov 11 Python
python 请求服务器的实现代码(http请求和https请求)
May 25 Python
对python:循环定义多个变量的实例详解
Jan 20 Python
Python3列表内置方法大全及示例代码小结
May 10 Python
pytorch 输出中间层特征的实例
Aug 17 Python
简单了解python元组tuple相关原理
Dec 02 Python
python递归函数求n的阶乘,优缺点及递归次数设置方式
Apr 02 Python
Python SMTP配置参数并发送邮件
Jun 16 Python
python语音识别指南终极版(有这一篇足矣)
Sep 09 Python
Python字符串及文本模式方法详解
Sep 10 Python
教你使用Pandas直接核算Excel中快递费用
May 12 Python
使用python绘制分组对比柱状图
Apr 21 Python
Ubuntu下创建虚拟独立的Python环境全过程
Feb 10 #Python
简单谈谈Python中的几种常见的数据类型
Feb 10 #Python
Python使用QQ邮箱发送Email的方法实例
Feb 09 #Python
python3中bytes和string之间的互相转换
Feb 09 #Python
python实现下载文件的三种方法
Feb 09 #Python
Python如何实现守护进程的方法示例
Feb 08 #Python
详解Python中表达式i += x与i = i + x是否等价
Feb 08 #Python
You might like
php学习之数据类型之间的转换介绍
2011/06/09 PHP
destoon实现调用自增数字从1开始的方法
2014/08/21 PHP
浅谈php自定义错误日志
2015/02/13 PHP
Smarty3配置及入门语法
2017/02/22 PHP
laravel 5.4 + vue + vux + element的环境搭配过程介绍
2018/04/26 PHP
日期函数扩展类Ver0.1.1
2006/09/07 Javascript
JavaScript下通过的XMLHttpRequest发送请求的代码
2011/06/28 Javascript
JavaScript数组常用操作技巧汇总
2014/11/17 Javascript
DropDownList控件绑定数据源的三种方法
2016/12/24 Javascript
JavaScript创建对象_动力节点Java学院整理
2017/06/27 Javascript
微信小程序实现图片放大预览功能
2020/10/22 Javascript
vue-cli 3.0 自定义vue.config.js文件,多页构建的方法
2018/09/19 Javascript
JS数组方法reverse()用法实例分析
2020/01/18 Javascript
jquery制作的移动端购物车效果完整示例
2020/02/24 jQuery
vue项目中微信登录的实现操作
2020/09/08 Javascript
token 机制和实现方式
2020/12/15 Javascript
python判断字符串是否包含子字符串的方法
2015/03/24 Python
Python中文件操作简明介绍
2015/04/13 Python
numpy排序与集合运算用法示例
2017/12/15 Python
Django + Uwsgi + Nginx 实现生产环境部署的方法
2018/06/20 Python
符合语言习惯的 Python 优雅编程技巧【推荐】
2018/09/25 Python
Python函数的参数常见分类与用法实例详解
2019/03/30 Python
Django web框架使用url path name详解
2019/04/29 Python
详解Numpy数组转置的三种方法T、transpose、swapaxes
2019/05/27 Python
pip指定python位置安装软件包的方法
2019/07/12 Python
python中必要的名词解释
2019/11/20 Python
python实现sm2和sm4国密(国家商用密码)算法的示例
2020/09/26 Python
手把手教你用纯css3实现轮播图效果实例
2017/05/04 HTML / CSS
CSS Grid布局教程之什么是网格布局
2014/12/30 HTML / CSS
HTML5的postMessage的使用手册
2018/12/19 HTML / CSS
Oasis服装官网:时尚女装在线
2020/07/09 全球购物
写给女生的道歉信
2014/01/14 职场文书
《王二小》教学反思
2014/02/27 职场文书
保护环境建议书
2014/03/12 职场文书
保护环境演讲稿
2014/05/10 职场文书
四风查摆问题及整改措施
2014/10/10 职场文书