Home >Backend Development >Python Tutorial >Detailed explanation of how to generate beautiful SVG images in python using Pygal
Detailed explanation of how to generate beautiful SVG images in python using Pygal
- 高洛峰Original
- 2017-02-13 16:23:583813browse
Preface
SVG can be regarded as the most popular image file format at present. Its full English name is Scalable Vector Graphics, which means scalable vector graphics. It is based on XML (Extensible Markup Language) and developed by the World Wide Web Consortium (W3C) alliance. Strictly speaking, it should be an open standard vector graphics language that allows you to design exciting, high-resolution web graphics pages. Users can directly use code to depict images, open SVG images with any word processing tool, make the images interactive by changing part of the code, and insert them into HTML at any time for viewing through a browser.
First Head in Pygal
First install pygal:
pip install pygal
If If you want to set the generated format to a format other than svg, such as png, jpg, etc., you need to install the following libraries:
pip install lxml
In In Ubuntu, you can install it according to the following prompts:
sudo apt-get install libxml2-dev libxslt1-dev python-dev sudo apt-get install python-lxml pip install cairosvg
The principle of installing this library is the same as above:
sudo apt-get install python-cairosvg
The following two libraries only need normal pip installation:
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')The black Hello.svg file is generated. Because it is in svg format, it cannot be opened directly. Select the default browser to open it, and you will see it. It looks like this below:
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')The generated picture is as follows This looks like:
Hello PNG
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')Pay attention to the green mark and successfully generate the image in png format:
Hello Flask and Pygal
pip install flaskThe core code is as follows, yes it is that short:
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()Open 127.0. 0.1:5000 you can see the following:
