Hi I have managed to create a SVG with Python via Transcrypt. The code is like this:
#!/usr/bin/env python
# -*- coding: utf-8 -*-
class SVG:
def __init__(self):
self.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg")
self.svgNS = self.svg.namespaceURI
self.circle = document.createElementNS(self.svgNS,'circle')
self.svg.setAttribute('height', 300)
self.svg.setAttribute('width', 300)
self.circle.setAttribute('cx', 150)
self.circle.setAttribute('cy', 150)
self.circle.setAttribute('r', 100)
self.circle.setAttribute('stroke', 'black')
self.circle.setAttribute('stroke-width', 5)
self.circle.setAttribute('fill', 'red')
self.svg.appendChild(self.circle)
document.body.appendChild(self.svg)
self.b=document.createElement('br')
document.body.appendChild(self.b)
self.h=document.createElement('a')
self.t=document.createTextNode('A Circle')
self.h.setAttributeNS(null, 'href', 'http://www.google.com')
self.h.appendChild(self.t)
document.body.appendChild(self.h)
graphic = SVG()
This works fine when compiling with transcrypt. But if I change the code to this:
# svg_10.py
class SVG:
def __init__(self):
self.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg")
self.svgNS = self.svg.namespaceURI
r1_vars = {'x': 10, 'y': 10, 'width': 100, 'height': 20, 'fill':'#ff00ff'}
self.r1 = self.draw_graphic('rect', r1_vars)
self.svg.appendChild(self.r1)
r2_vars = {'x': 20, 'y': 40, 'width': 100, 'height': 40, 'rx': 8, 'ry': 8, 'fill': 'pink', 'stroke':'purple', 'strokeWidth':7 }
self.r2 = self.draw_graphic('rect', r2_vars)
self.svg.appendChild(self.r2)
document.body.appendChild(self.svg)
def draw_graphic(self, kind, vars):
graphic = document.createElementNS(self.svgNS, kind)
for key in vars.keys():
graphic.setAttribute(key, vars[key])
return graphic
graphic = SVG()
I do not get any output though transcrypt runs through without complaining. What went wrong? The html code for displaying it is:
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SVG</title>
</head>
<body>
</body>
<script language="javascript" src="__javascript__/svg_10.js"></script>
</html>
Still using Transcrypt 3.6 so the header is different. If you use a newer version change it to:
<script type="module">import * as svg_10 from './__target__/svg_10.js';window.svg_10 = svg_10;</script>
Hm, just found out that the following code seems to work though: