Here is my svg.xml code:
Expand|Select|Wrap|Line Numbers
- <?xml version="1.0" standalone="no"?>
- <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
- "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
- <svg width="100%" height="100%" version="1.1"
- xmlns="http://www.w3.org/2000/svg">
- <rect width="300" height="100" fill="rgb(120,90,255)" strokewidth="1" stroke="rgb(0,0,0)"
- style="fill:rgb(120,90,255);stroke-width:1;
- stroke:rgb(0,0,0)"/>
- <rect x="120" y="20" width="250" height="250" fill="purple" strokewidth="5" stroke="purple"
- style="fill:green;stroke:purple;stroke-width:5;"/>
- <rect x="20" y="120" width="250" height="250" fill="blue" strokewidth="15" stroke="pink"
- style="fill:blue;stroke:pink;stroke-width:15;"/>
- <rect x="200" y="200" width="250" fill="red" strokewidth="25" stroke="black"
- height="100" style="fill:red;stroke:black;
- stroke-width:25;"/>
- </svg>
Here is the desired output code ...
Expand|Select|Wrap|Line Numbers
- <?xml version="1.0" encoding="utf-8"?>
- <html>
- <body style="width: 100%; height: 100%">
- <div style="position: absolute; left: 20px ; top: 20px ; padding-bottom: 250px ; padding-right: 250px ; border-style: solid; border-width: 0px; background-color:blue;border-color:pink;border-width:5; fill-opacity:0.1;stroke-opacity:0.9"></div>
- <div style="position: absolute; left: 50px ; top: 100px ; padding-bottom: 5px ; padding-right: 10px ; border-style: solid; border-width: 0px; background-color:red;"></div>
- <div style="position: absolute; left: 200px ; top: 175px ; padding-bottom: 500px ; padding-right: 40px ; border-style: solid; border-width: 0px; background-color:purple; border-color:black; border-width: 10;"></div>
- </body>
- </html>
This is my visual basic code so far ... it outputs the html with the vector information as is. I want to alter it to change it to the desired output.
Expand|Select|Wrap|Line Numbers
- Imports <xmlns:svg="http://www.w3.org/2000/svg">
- ' *** LOOK OUT FOR THIS! ^^^^
- Public Class Form1
- Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
- ' svg -> rect*
- ' rect@x = 0, rect@y = 0, rect@width, rect@height
- ' html -> body
- ' body -> div*
- ' <div style="position: absolute; left: ...
- ' top: ... padding-bottom: ... padding-right: ...
- '
- End Sub
- Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
- Dim svg As XElement
- svg = XElement.Load("../../test.svg.xml")
- Dim html = <html>
- <body style="width: 100%; height: 100%">
- <%= From rectangle In svg.<svg:rect> Select <div style=<%= "position: absolute; left: " & rectangle.@x & _
- "px; top: " & rectangle.@y & _
- "px; padding-bottom: " & rectangle.@width & _
- "px; padding-right: " & rectangle.@height & _
- "px; border-style: solid; border-width: 0px; background-color: " & rectangle.@fill & _
- "; border-color: " & rectangle.@stroke & _
- "; border-width: " & _
- rectangle.@strokewidth %>>
- </div> %>
- </body>
- </html>
- html.Save("../../result.html")
- End Sub
- End Class
If anybody can help me with this, it would be much appreciated!