Submitted by Paul_J_Miller on 2018/11/29 09:40
Following up on some of Pierres comments on SVG in the document pane I have been experimenting with inserting SVG images into the document pane.  SVG images generally take up less space than bitmap images.
 
However the problem is to get the image onto the page.
 
Copy and paste from Inkscape just inserts a frame (with re-size handles) which contains nothing.
 
Copy and paste from Internet Exploiter copies a bitmapped image.
 
If you edit the HTML code and insert the text of the SVG file then you get the image displayed correctly with the background colour showing through all the transparent bits, great, but this is more difficult than it should be and the image is also fragile.
 
Re-sizing the image or moving it can often cause it to disappear and/or mess up the rest of the page.
 
Upon inspection of the HTML code I found that the SVG code had been re-arranged and random bits of HTML code had been inserted into it ‽
 
But where it works it works well, just don't mess about with it once you have it displayed correctly :-
 
 
It would be nice if there was a better way of inserting an SVG image.
 

Comments

A different use-case scenario, but one can simply open an SVG file in the doc pane via file>open>etc -- it should display perfectly (does here).
 
I am unable to resize the displayed SVG files though -- @Pierre: should that not be possible? ( I can resize them in local IE install, version 11+ )

Paul_J_Miller

2018/11/29 15:08

In reply to by Tom

I can also open an SVG file in the document pane but I was wanting to embed an SVG image in the HTML of a document pane, this way I can easily edit the text around it.
 
Some of the SVG images allow re-sizing, those created by Adobe Illustrator allow re-sizing but those created by Inkscape do not, they have to be re-sized in Inkscape and re-copied into Info Qube.  I don't know what the difference is.
 

Pierre_Admin

2018/11/29 15:24

In reply to by Paul_J_Miller

It all depends on the actual SVG code... basically, it needs to have the viewbox attribute:
<svg width="500" height="200" viewBox="0 0 50 20" >

    <rect x="20" y="10" width="10" height="5"
          style="stroke: #000000; fill:none;"/>

</svg>
 
Pierre_Admin
IQ Designer
 

Paul_J_Miller

2018/11/29 17:27

In reply to by Pierre_Admin

Thank you I will ask t'internet for information on the viewbox attribute: