svg decode more support
This commit is contained in:
Ryan Oldenburg
parent
4d14870150
commit
79189a473e
4 changed files with 136 additions and 64 deletions
|
|
@ -1,75 +1,130 @@
|
|||
## Load and Save SVG files.
|
||||
|
||||
import chroma, pixie/images, pixie/common, pixie/paths, vmath, xmlparser, xmltree,
|
||||
strutils, strutils, bumpy
|
||||
import chroma, pixie/images, pixie/common, pixie/paths, vmath, xmlparser,
|
||||
xmltree, strutils, strutils, bumpy
|
||||
|
||||
const svgSignature* = "<?xml"
|
||||
|
||||
type Ctx = object
|
||||
fill, stroke: ColorRGBA
|
||||
strokeWidth: float32
|
||||
transform: Mat3
|
||||
|
||||
template failInvalid() =
|
||||
raise newException(PixieError, "Invalid SVG data")
|
||||
|
||||
proc draw(img: Image, matStack: var seq[Mat3], xml: XmlNode) =
|
||||
case xml.tag:
|
||||
of "g":
|
||||
let
|
||||
fill = xml.attr("fill")
|
||||
stroke = xml.attr("stroke")
|
||||
strokeWidth = xml.attr("stroke-width")
|
||||
transform = xml.attr("transform")
|
||||
proc initCtx(): Ctx =
|
||||
result.fill = parseHtmlColor("black").rgba
|
||||
result.strokeWidth = 1
|
||||
result.transform = mat3()
|
||||
|
||||
if transform != "":
|
||||
if transform.startsWith("matrix("):
|
||||
let arr = transform[7..^2].split(",")
|
||||
if arr.len != 6:
|
||||
failInvalid()
|
||||
var m = mat3()
|
||||
m[0] = parseFloat(arr[0])
|
||||
m[1] = parseFloat(arr[1])
|
||||
m[3] = parseFloat(arr[2])
|
||||
m[4] = parseFloat(arr[3])
|
||||
m[6] = parseFloat(arr[4])
|
||||
m[7] = parseFloat(arr[5])
|
||||
matStack.add(matStack[^1] * m)
|
||||
else:
|
||||
raise newException(
|
||||
PixieError, "Unsupported SVG transform: " & transform & ".")
|
||||
proc decodeCtx(inherited: Ctx, node: XmlNode): Ctx =
|
||||
result = inherited
|
||||
|
||||
for child in xml:
|
||||
if child.tag == "path":
|
||||
let d = child.attr("d")
|
||||
let
|
||||
fill = node.attr("fill")
|
||||
stroke = node.attr("stroke")
|
||||
strokeWidth = node.attr("stroke-width")
|
||||
transform = node.attr("transform")
|
||||
|
||||
if fill != "none" and fill != "":
|
||||
let
|
||||
fillColor = parseHtmlColor(fill).rgba
|
||||
(bounds, fillImg) = fillPathBounds(d, fillColor, matStack[^1])
|
||||
img.draw(fillImg, bounds.xy)
|
||||
|
||||
if stroke != "none" and stroke != "":
|
||||
let
|
||||
strokeColor = parseHtmlColor(stroke).rgba
|
||||
strokeWidth =
|
||||
if strokeWidth == "": 1.0 # Default stroke width is 1px
|
||||
else: parseFloat(strokeWidth)
|
||||
(bounds, strokeImg) =
|
||||
strokePathBounds(d, strokeColor, strokeWidth, matStack[^1])
|
||||
img.draw(strokeImg, bounds.xy)
|
||||
else:
|
||||
img.draw(matStack, child)
|
||||
|
||||
if transform != "":
|
||||
discard matStack.pop()
|
||||
if fill == "":
|
||||
discard # Inherit
|
||||
elif fill == "none":
|
||||
result.fill = ColorRGBA()
|
||||
else:
|
||||
raise newException(PixieError, "Unsupported SVG tag: " & xml.tag & ".")
|
||||
result.fill = parseHtmlColor(fill).rgba
|
||||
|
||||
if stroke == "":
|
||||
discard # Inherit
|
||||
elif stroke == "none":
|
||||
result.stroke = ColorRGBA()
|
||||
else:
|
||||
result.stroke = parseHtmlColor(stroke).rgba
|
||||
|
||||
if strokeWidth == "":
|
||||
discard # Inherit
|
||||
else:
|
||||
result.strokeWidth = parseFloat(strokeWidth)
|
||||
|
||||
if transform == "":
|
||||
discard # Inherit
|
||||
else:
|
||||
if transform.startsWith("matrix("):
|
||||
let arr = transform[7..^2].split(",")
|
||||
if arr.len != 6:
|
||||
failInvalid()
|
||||
var m = mat3()
|
||||
m[0] = parseFloat(arr[0])
|
||||
m[1] = parseFloat(arr[1])
|
||||
m[3] = parseFloat(arr[2])
|
||||
m[4] = parseFloat(arr[3])
|
||||
m[6] = parseFloat(arr[4])
|
||||
m[7] = parseFloat(arr[5])
|
||||
result.transform = result.transform * m
|
||||
else:
|
||||
raise newException(
|
||||
PixieError, "Unsupported SVG transform: " & transform & "."
|
||||
)
|
||||
|
||||
proc draw(
|
||||
img: Image, node: XmlNode, ctxStack: var seq[Ctx]
|
||||
) =
|
||||
if node.kind != xnElement:
|
||||
# Skip <!-- comments -->
|
||||
return
|
||||
|
||||
case node.tag:
|
||||
of "title":
|
||||
discard
|
||||
of "desc":
|
||||
discard
|
||||
of "g":
|
||||
let ctx = decodeCtx(ctxStack[^1], node)
|
||||
ctxStack.add(ctx)
|
||||
for child in node:
|
||||
img.draw(child, ctxStack)
|
||||
discard ctxStack.pop()
|
||||
of "path":
|
||||
let
|
||||
d = node.attr("d")
|
||||
ctx = decodeCtx(ctxStack[^1], node)
|
||||
if ctx.fill != ColorRGBA():
|
||||
let (bounds, fillImg) = fillPathBounds(d, ctx.fill, ctx.transform)
|
||||
img.draw(fillImg, bounds.xy)
|
||||
if ctx.stroke != ColorRGBA():
|
||||
let (bounds, strokeImg) = strokePathBounds(
|
||||
d, ctx.stroke, ctx.strokeWidth, ctx.transform
|
||||
)
|
||||
img.draw(strokeImg, bounds.xy)
|
||||
of "rect":
|
||||
let
|
||||
ctx = decodeCtx(ctxStack[^1], node)
|
||||
x = parseFloat(node.attr("x"))
|
||||
y = parseFloat(node.attr("y"))
|
||||
width = parseFloat(node.attr("width"))
|
||||
height = parseFloat(node.attr("height"))
|
||||
path = newPath()
|
||||
path.moveTo(x, y)
|
||||
path.lineTo(x + width, x)
|
||||
path.lineTo(x + width, y + height)
|
||||
path.lineTo(x, y + height)
|
||||
path.closePath()
|
||||
if ctx.fill != ColorRGBA():
|
||||
img.fillPath(path, ctx.fill, ctx.transform)
|
||||
if ctx.stroke != ColorRGBA():
|
||||
img.strokePath(path, ctx.stroke, ctx.strokeWidth, ctx.transform)
|
||||
else:
|
||||
raise newException(PixieError, "Unsupported SVG tag: " & node.tag & ".")
|
||||
|
||||
proc decodeSvg*(data: string): Image =
|
||||
## Render SVG file and return the image.
|
||||
try:
|
||||
let xml = parseXml(data)
|
||||
if xml.tag != "svg":
|
||||
let root = parseXml(data)
|
||||
if root.tag != "svg":
|
||||
failInvalid()
|
||||
|
||||
let
|
||||
viewBox = xml.attr("viewBox")
|
||||
viewBox = root.attr("viewBox")
|
||||
box = viewBox.split(" ")
|
||||
if parseInt(box[0]) != 0 or parseInt(box[1]) != 0:
|
||||
failInvalid()
|
||||
|
|
@ -77,11 +132,11 @@ proc decodeSvg*(data: string): Image =
|
|||
let
|
||||
width = parseInt(box[2])
|
||||
height = parseInt(box[3])
|
||||
var ctxStack = @[initCtx()]
|
||||
result = newImage(width, height)
|
||||
var matStack = @[mat3()]
|
||||
for n in xml:
|
||||
result.draw(matStack, n)
|
||||
for node in root:
|
||||
result.draw(node, ctxStack)
|
||||
except PixieError as e:
|
||||
raise e
|
||||
except:
|
||||
raise newException(PixieError, "Unable to load SVG")
|
||||
raise newException(PixieError, "Unable to load SVG")
|
||||
|
|
|
|||
BIN
tests/images/svg/triangle01.png
Normal file
BIN
tests/images/svg/triangle01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4 KiB |
11
tests/images/svg/triangle01.svg
Normal file
11
tests/images/svg/triangle01.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<?xml version="1.0" standalone="no"?>
|
||||
<svg width="4cm" height="4cm" viewBox="0 0 400 400"
|
||||
xmlns="http://www.w3.org/2000/svg" version="1.1">
|
||||
<title>Example triangle01- simple example of a 'path'</title>
|
||||
<desc>A path that draws a triangle</desc>
|
||||
<rect x="1" y="1" width="398" height="398"
|
||||
fill="none" stroke="blue" />
|
||||
<path d="M 100 100 L 300 100 L 200 300 z"
|
||||
fill="red" stroke="blue" stroke-width="3" />
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 440 B |
|
|
@ -1,9 +1,15 @@
|
|||
import pixie/fileformats/svg, pixie
|
||||
import pixie/fileformats/svg, pixie, strformat
|
||||
|
||||
let
|
||||
original = readFile("tests/images/svg/Ghostscript_Tiger.svg")
|
||||
image = decodeSvg(original)
|
||||
gold = readImage("tests/images/svg/Ghostscript_Tiger.png")
|
||||
const files = [
|
||||
"triangle01",
|
||||
"Ghostscript_Tiger"
|
||||
]
|
||||
|
||||
doAssert image.data == gold.data
|
||||
# image.writeFile("tests/images/svg/Ghostscript_Tiger.png")
|
||||
for file in files:
|
||||
let
|
||||
original = readFile(&"tests/images/svg/{file}.svg")
|
||||
image = decodeSvg(original)
|
||||
gold = readImage(&"tests/images/svg/{file}.png")
|
||||
|
||||
doAssert image.data == gold.data
|
||||
# image.writeFile(&"{file}.png")
|
||||
|
|
|
|||
Loading…
Reference in a new issue