SVGimage

Walter Davis 19 Mar 2013, 17:42

Yeah, if you are able to import the SVG as a pass-through image, you will find that it will work perfectly in modern browsers without this Action, but any IE < 10 or 11 will not show anything. You have to import the image as a normal graphic in order to force Freeway to create the JPEG fallback.

James Wages 4 Apr 2013, 06:37

If you create SVG's in Illustrator, read this: http://tinyurl.com/carpoyk

In my experience, converting text to Outlines solves font problems, but the SVG filesize skyrockets! The smallest filesize is obtained by using Adobe CEF and "Only Glyphs Used" but those fonts won't display in most browsers. And SVG fonts aren't supported by FireFox. Embedding a WOFF font would be ideal, but neither Illustrator nor this Action make that an easy task.

Walter Davis 4 Apr 2013, 12:07

To be fair, this Action does nothing except get Freeway to link up the original image along with its converted (JPEG) version. It cannot influence the inner workings of the SVG – Freeway (and thus the Actions API) have no particular powers there.

Christian Wallach 21 Apr 2013, 16:10

With me the Action does not work. I import a SVG (not as a pass-through but I tried this as well) into a graphic box and set the Action to work. While Safari shows the SVG correctly, Firefox and IE do not display the JPEG fallback although Freeway does create and upload it. What am I doing wrong ?

Walter Davis 21 Apr 2013, 16:42

Please post a link to your page. Also, make sure that your Web server properly supports the svg mime-type. It may not be configured correctly.

Christian Wallach 21 Apr 2013, 19:01

Thanks for your answer. Here's the link to the page: www.biriba.ch HTML for the banner ("biriba"): <div id="biribaLogo" class="f-ms"><object type="image/svg+xml" data="Resources/biriba%20Logo.svg"><img src="Resources/biribalogo.jpeg" border=0 width=188 height=113 alt="biribaLogo" style="float:left"></object> Safari displays the SVG correctly !

Christian Wallach 21 Apr 2013, 19:02

The HTML-code vanished, sorry. Safari displays the SVG correctly !

Walter Davis 21 Apr 2013, 19:51

You might try removing the space from the filename. I'm not sure why else it might appear correctly on one and not the other browser.

Christian Wallach 21 Apr 2013, 20:08

I did remove the space. Unfortunately, this does not solve the problem. Both SVG and JPEG are in the ressources folder. Firefox and IE seem not to show the JPEG but instead try to display the SVG.

Walter Davis 21 Apr 2013, 20:26

Firefox should show the SVG, that's totally native. Make sure your server is sending the correct mime-type for SVG.

Christian Wallach 21 Apr 2013, 21:31

The Mime-Type for the SVG sent by the server is "image/svg+xml". I cannot post the html-code but under "data" it refers to the SVG and under "src" to the JPEG.

Walter Davis 21 Apr 2013, 22:27

Try converting the letter characters to paths before you export as SVG. I see the SVG in Firefox, it just doesn't look very good because the embedded fonts are being ignored.

Christian Wallach 24 Apr 2013, 19:07

The problem was the SVG itself. It had been made with OpenOffice. I made the new one with Inkscape. The Action now works perfectly well. Tanks for your help !

James Wages 14 May 2013, 05:56

Neither the SVG nor the fallback will appear in Freeway's PREVIEW (which is built on WebKit). Everything looks great when previewing in WebKit browsers like Safari or Chrome though. Is this a problem with your action, or is it a problem in Freeway? (I've confirmed this problem in Freeway 5.6.5 and 6.x.) Thanks.

Walter Davis 14 May 2013, 13:19

WebKit is not Safari. It's just the HTML rendering engine for Safari. As far as I know, it doesn't even include the JavaScript runtime – Safari (and Freeway) adds that separately, too.

James Wages 16 May 2013, 06:23

Adding a link to a graphic with the SVGimage Action applied displays a clickable link in Freeway's Preview only. When viewing in FF or Chrome or Safari there is no clickable link, despite the fact the HTML code contains the correct <a href>. If not a bug in the Action, then what's the solution to make a clickable link on SVGs?

James Wages 13 Jan 2015, 00:53

Can this Action please be modified (or could someone please tell us specifically how to modify it) so that we can manually add the physical dimensions of the SVG within the Actions palette? The reason this is needed is because Illustrator (and other SVG creation apps) don't always include WIDTH & HEIGHT tags in the SVG's code, and without those tags you have two problems: (1) the SVG won't display in Freeway's Page View, and (2) Freeway will not generate the bitmapped fallback image. I can workaround the problem now only by opening my SVGs in a text editor and adding the WIDTH and HEIGHT tags. But that job would be much simpler and faster if it could be done within Freeway's Action palette, via the SVG Image action.

Thanks.

Walter Davis 13 Jan 2015, 01:16

I'm confused. Do you want the Action to rewrite the contents of the SVG file, or to give the generated img tag the dimensions you set? I haven't tried to do the former, but the latter, while trivially easy to do, probably won't fix anything.

James Wages 13 Jan 2015, 01:27

You're right, Walter. I didn't think about the need for the Action to re-write the SVG (which, as you say would not be a trivial task). So I guess I will need to stick with my present workaround for now (manually typing in those tags for each SVG in a text editor). Thanks.

James Wages 14 Jan 2015, 01:29

Walter, does the SVG IMAGE action create the bitmapped fallback image for SVGs, or is Freeway doing that?

The absence of Height & Width tags is apparently important for CSS styling of SVGs, however, in Freeway the lack of Height & Width tags kills the creation of the bitmapped fallback image. More info on that on FreewayTalk here:

http://freewaytalk.net/thread/view/157714

Walter Davis 14 Jan 2015, 01:33

Freeway builds it. It's done because when you import any image-like file into a graphics box, Freeway will try to build a JPG or GIF of it (whatever setting you use in the Export tab of the Inspector). The Action just looks up the path to the actual source file and constructs an inline SVG tag for it, using the Freeway generated image as the fallback. It's related to how my HTML5 Video Action works, in that you apply it to a graphics box, and that image gets used in the process.