svg images

[feitelberg]

I create create svg images with Visio and when I do this and insert the image in a topic, the arrowhead on my line disappears and the gradient shading on one image go solid gray.

Is that a flare problem or an svg issue?

[LTinker68]

Is it that way in the output, too, or just the authoring environment?

[rob hollinger]

If you open that SVG file in another software program and save it, does it work then?
We tested this with Illustrator and they worked fine from there.

When I view these files in Safari, they show error messages for the image.
When I view them in IE with the Visio plug-in, they seem to display fine.

[wbrisett]

Rob, I believe this is the same issue I reported to you. My guess is that Visio was used to create these SVG images. Is that true feitelberg?

If so, I believe this is a problem with Visio. As a test, you may want to install Ghostscript and Scribus (both are Gnu License projects) and see if you resave your SVG image out of Scribus what happens.

I had the same issue with the arrowheads on lines and I took the Visio graphic, opened it with Omnigraffle on Mac OS X, saved an SVG file there, reimported that into Flare 7, and it did not have the issue, so I belive it has something to do with the way the SVG graphics are being written out of Visio. Unfortunately, Visio is used by a lot of companies doing technical drawings.

Wayne

[feitelberg]

Yes I created the image in Visio.

I don't have another application to open the image; I thought of that so I can't tell if this is a Visio issue or not, hence the post.

[feitelberg]

And for clarification, I'm using Visio 2003. Don't know if a more recent version of Visio would have the issue.

But I can take the file and try to open it on my Mac to see if apps on that side have the same issue. Will report my results.

[feitelberg]

I opened the visio svg in illustrator and did not see the original image. This suggests that Visio does not write compatible svg.

I then took an illustrator file and saved it as svg. Flare had not problem with that file.

Note I saved the images as svg 1.1; don't know if that matters but I thought I would mention it.

[SteveS]

I create create svg images with Visio and when I do this and insert the image in a topic, the arrowhead on my line disappears and the gradient shading on one image go solid gray.

Is that a flare problem or an svg issue?

Is it possible to save the file in another format (ie jpg, gif, or png) as a workaround. Visio does a good job with pngs, it crops the image nicesly before exporting to a graphics format.

[LTinker68]

Well, since this is the beta and the output is scrambled anyway, the workaround wouldn't mean much at this point. But if MadCap doesn't fix it before the production release then they should at least post the problem with the release notes, along with the solution of producing PNG instead of SVG at this point.

Make sure you report it through the beta bug form so they have a record of it.

[wbrisett]

Make sure you report it through the beta bug form so they have a record of it.

This was one of the first things I did a few weeks back when testing Flare 7 since we use a lot of SVG graphics. I logged this error and provided MadCap with some examples. They were going to see if there was anything they could do since a lot of folks use Visio. However, since non-visio SVGs work, I'm not hold out much hope that Madcap can fix this. I think Microsoft will have to fix this (read probably not) defect.

As a free workaround, I would recommend people look into Ghostscript (which is required now for the equations anyhow), and Scribus. Save the Visio file out as an EPS image, open that up in Scribus and save as an SVG.

Wayne

[Ryan Cerniglia]

I just moved this topic from the beta forum over to general discussion as it goes over an issue we're starting to see more and more - SVG images from Microsoft Visio don't appear correctly in Flare.

It appears that Visio isn't putting out the correct code for things like heads on arrows, and at this time they will not import correctly. You will need to create and save SVG files using another program such as Illustrator, Omnigraffle, or the free product Scribus.

Alternatively, you can save a PNG file from Visio and use that without error.

[Graham Campbell]

I'm suffering this issue with SVG images saved from other applications. I've been using Inkscape, an opensource alternative, and it too is displaying oddly in the editor and in the PDF output.

The frustrating thing is that the errors in the image are not consistent between the editor and the output. The editor incorrectly displays arrow heads, and the PDF incorrectly colourises text that should be black, but uses a colour that appears in the image to colour a box.

Very odd, and all very frustrating. Seems like the fault is not (just) with Visio.

[Graham Campbell]

I can, in the meantime, confirm that wbrisett's suggestion of using Scribus and Ghostwrite does work but is a rather laborious process.

Hopefully nobody thinks I'm trying to pull April Fool's here!

[wbrisett]

Graham:

One of the things I've found is that anytime you save the SVG image out of Visio and open it up somewhere else (Inkscape or other), it may appear to be OK, but in reality the underlying description for the objects isn't. When the other application rewrites the SVG, it simply seems to be leaving the original vectors in their place, which means when you open them in Flare, they are still not correct. The only way to avoid this seems to be using a different authoring tool other than Visio, or saving in a format other than svg out of Visio. It's pretty much the garbage in, garbage out syndrome I think we're all experiencing here; that is if it's malformed to start with other tools can't repair them.

I agree that using Scribus isn't the perfect solution, but seems to be the only one I've found short of simply not using Visio to create the images. I'm fortunate in that I have an option and can draw things on the Mac using OmniGraffle (which I prefer over Visio anyhow), which doesn't have this problem. If your drawings aren't too complex you could use Inkscape to start with, which also will solve this for you.

Wayne

[RamonS]

You can also try LibreOffice (OpenOffice) Impress or Draw and see if those applications write the SVG files correctly. Unfortunately, there appears to be no direct way to open a Visio drawing in LibreOffice, thanks to proprietary file format. You can try copy and paste or use Draw / Impress to create the images.

[Graham Campbell]

@wbrisett Sorry if I wasn't clear before, but I'm not using Visio whatsoever to create my SVG images.

I started off using Inkscape and suffered the problem. Using your suggested Scribus workaround solved the issue for all but one of my images: all the lines in my diagram appear as dashed rather than solid in the built PDF, but not in the source. Once again, completely inconsistent rendering in the output from Flare.

[wbrisett]

This is an older topic, but I have found the solution (actually somebody else did but they only understood part of the solution... I was able to use their hack to fill in the Visio part).

So, here is what's messing up Flare, Batik, and just about every other SVG rendering engine. In the Visio SVG output for every arrowhead line you'll see a <marker> tag. Here is an example of one

Code: Select all

<marker id="mrkr13-46" class="st8" v:arrowType="13" v:arrowSize="2" v:setback="9.3" refX="-9.3" orient="auto"
				markerUnits="strokeWidth">
			<use xlink:href="#lend13" transform="scale(-3.1,-3.1) "/>
		</marker>

This particular line would be broken because there is a part missing. In addition to the marker, there should be an overflow value. In this case it should always be: <marker overflow="visible" ... For example:

Code: Select all

<marker overflow="visible" id="mrkr13-46" class="st8" v:arrowType="13" v:arrowSize="2" v:setback="9.3" refX="-9.3" orient="auto"
				markerUnits="strokeWidth">
			<use xlink:href="#lend13" transform="scale(-3.1,-3.1) "/>
		</marker>

I'm in the process of writing a perl script for us that will fix this, I know that Rob from Madcap was going to look into how they could fix this issue internally in Flare, so maybe this will be a moot point if Rob looks at this and incorporates this fix in later versions of Flare.

But you can either write a script to fix this or do a simple search and replace for <marker to <marker overflow="visible" using a text editor which will also fix the problem before you import it into Flare.

Wayne

[navoff]

So, I've read the information on how to get the arrow heads to display (adding the overflow="visible" option to the marker tags). That appears to work just fine (thanks, wbrisett, for the tip).

My problem is that when I create a drawing in Visio, it's placed on an 8.5" x 11" 'page' so when I save out the .svg image, it displays with all the white space around the image. I had thought I could just select all the elements of the page and save that but Visio gives me an error message when I do that and the resultant file is unusable.

I have set my stylesheet to have a maximum width for images in PDF (so they fit on the printed page). If need be, I'll customize a particular graphic to change the printed height to a smaller size and let the width auto-adjust. However, that presumes the boundary of the file is at the edge of the actual image, not one that has two inches of white space around it. Any suggestions on how to get rid of that?

[wbrisett]

Navoff:

To prevent the 8.5 x 11 page, simply select all the objects first, then perform the save. I have a visual basic macro that will actually fix the arrowhead problem. Contact me offline if you're interested and I'll send it to you.

Wayne

[navoff]

Navoff:

To prevent the 8.5 x 11 page, simply select all the objects first, then perform the save. I have a visual basic macro that will actually fix the arrowhead problem. Contact me offline if you're interested and I'll send it to you.

Wayne

I tried that. Yesterday Visio gave me an error message. I would tell you what it was but I don't recall exactly what it said and I couldn't get Visio to repeat the problem so I could see the error message again. It was something about an unrecognizable character and that it would substitute "?" for the unidentified elements. The file it created couldn't be parsed by Flare.

Today, it created the file with no complaints and Flare imported it just fine. <queue Twilight Zone theme song>

[navoff]

Navoff:

To prevent the 8.5 x 11 page, simply select all the objects first, then perform the save. I have a visual basic macro that will actually fix the arrowhead problem. Contact me offline if you're interested and I'll send it to you.

Wayne

I tried that. Yesterday Visio gave me an error message. I would tell you what it was but I don't recall exactly what it said and I couldn't get Visio to repeat the problem so I could see the error message again. It was something about an unrecognizable character and that it would substitute "?" for the unidentified elements. The file it created couldn't be parsed by Flare.

Today, it created the file with no complaints and Flare imported it just fine. <queue Twilight Zone theme song>

Hmmm, maybe it only works on odd numbered days. I was attempting to save out more Visio files to svg today and am running into the same error message:

The file was saved but some problems were encountered. Details of the problems were added to the log file.

Then in the log file it says:

[Warning] DataType:
Context: Line 2
Description: Visio encountered a low ASCII character or other illegal XML character that cannot be saved. Visio saved a question mark ('?') character instead of the illegal XML character.

Again, it will save the file as a .svg if I don't select just the image on the page but then I end up with all the extra white space. <sigh>

[sbrooks]

For this issue: My problem is that when I create a drawing in Visio, it's placed on an 8.5" x 11" 'page' so when I save out the .svg image, it displays with all the white space around the image.

Have you tried in Visio the "size to fit drawing" option? (Page Setup > Page Size tab > click Size to fit drawing contents > OK). Works for me.

[navoff]

The problem seems to be something with the original .vsd file. If I create a new file, copy and paste the old information into the new file and save it, then I don't have the problems with saving the drawing as a .svg file. It may have been that there was a compatibility issue caused by creating the drawing with a previous version of Visio than what I am currently using.

[clxmichelle]

I had a recent problem with Flare complaining about an SVG from Visio. Editing in Illustrator solved, so thanks for the suggestion. Though I should note the effort was a pretty long tail (so to speak).