This is an archive of past discussions on Wikipedia:SVG help, for the period February 2009 to May 2010. Do not edit the contents of this page. If you wish to start a new discussion or revive an old one, please do so on the current main page.
By removing the following line from the opening tag, I was able to solve the problem:
viewBox="83 -119 34 34"
This seemed to restore the text to its proper form albeit in a smaller size. To simplify the process of maintaining object size I was a bit lazy and simply cut and pasted all the objects into a new document, which has the same overall effect. User A1 (talk) 15:07, 28 February 2009 (UTC)
Thanks, the text is OK now, but for some reason the file is now nominally 480 x 400 pixels (though the SVG source still has 400 x 400), which apparently causes it to be distorted -- not in the preview, but in the article (Freewheel). Joriki (talk) 00:21, 1 March 2009 (UTC)
I created this on Inkscape (the first time I've ever used it) and it's not showing up on the Image page and also the countries which I haven't coloured are not appearing for some reason. I don't know what I've done wrong or need to do. Please help! Secrets (talk) 22:51, 11 March 2009 (UTC)
Opening the file in inkscape gives me a "Image not found" warning. Looking at the file contents in a text editor, I noticed
This means that you are looking for a separate file on your computer called "BlankMap-World-v3.png". Unfortunately vector data is not raster data. A PNG file is a compressed bitmap graphic, and this will prevent the image from showing up correctly, as the image is embedded as a link, not the actual data (nor should it have the actual data). You may wish to look at File:BlankMap-World6.svg for an SVG version of a world map, more are available from WP:MAP. When saving the map, do not save the "image", as this is a PNG preview, instead save the link as a file then open it in inkscape. User A1 (talk) 23:52, 11 March 2009 (UTC)
Thanks for your suggestion! I'll try it out. As it is the first time I've used the program.. do I group the image at the end select "fit to selection"? Thanks. Secrets (talk) 23:06, 12 March 2009 (UTC)
I tend to do this, then expand the borders by a 1 or 2 percent, then align the objects to page centre. I like the look, but it is up to you -- there is not technical need to do that. User A1 (talk) 03:53, 13 March 2009 (UTC)
I'm experiencing severe problems with rendering of Cyrillic letters and fonts in wikipedia. I made this template in order to facilitate the creation of maps in the Russian Graphic Lab. Source is a French version of the same file. I used the exact same fonts in order to maintain "standard" convention and It looks great on my computer but when I upload it to commons, the whole thing becomes a total mess. There were also other complains from user about Cyrillic letters rendering. Could you explain what is causing it and how can it be fixed? Also there are issues with size of the file. I use Illustrator and for some reason it assigns font attributes to every single letter instead of a word. Yug has managed to fix the size, but the text is uneditable now. Thank you. --Ahnode (talk) 08:56, 8 May 2009 (UTC)
Unfortunately I don't know Cyrillic, could you post a PNG showing how it is meant to appear, so I can compare them? Currently I am unable to identify the problems in the linked SVG image. User A1 (talk) 13:09, 8 May 2009 (UTC)?
Hello, thanks for taking your time to help. I've uploaded png file and also changed all fonts to DejaVuSans and Serif in svg file. It increased its size twice. --Ahnode (talk) 15:55, 8 May 2009 (UTC)
Sorry for the delay. Haven't had time to look at it recently. It looks you made it in Adobe illustrator? There are some funny font names that I am not sure they are valid (nor am I sure it is invalid). For example: 'DejaVuSerif-Italic' should be DejaVu Serif and the style value should be set to font-style:italic. This is true if I am reading the spec correctly, which I am not super-familiar with.
Anyway, I have sort-of fixed it. Some manual changes, (I recommend inkscape over illustrator for SVG compliant SVGs) should fix it, namely correcting my lack of proper use of the style tag to fix italics where appropriate. Just make sure that inkscape doesn't try to rename the font. If it does, I can cook up a regular expression to fix it pretty quickly. Also I took the liberty of removing the PGF data at the end, which is some wierdo illustrator proprietary data, that appears to be stored in a base64 encoding, which could rewrite the SVG part of the file in its incorrect form if used as a data source. In short I think there could be some problems with the fonts installed on your machine, as they appear to have the wrong name :( I am not certain of ths however, but the problem appears to be at least partially resolved. Let me know if this is an improvement. User A1 (talk) 11:45, 20 May 2009 (UTC)
Thank you so much, you did really fix it, though I'm afraid to touch it now (I might ruin it again). --Ahnode (talk) 16:17, 27 May 2009 (UTC)
'Typical' problem: as the file history shows, having tried to fix this file either I get the black-box thing or no display at all. What do I need to do? The first change I made was switching the font to Sans; which gave the black-box problem. Then I tried the stroke to path change which removed any display on the image page at all. - Jarry1250(t, c)16:53, 13 May 2009 (UTC)
It would be good to know how I can fix it and avoid such trouble in the future but I just want it to look OK and I'm happy if someone else just fixes it. The main problem is that the text doesn't stay where it should be, but there's an issue with the background being partly transparent. I made the graphic in OpenOffice Draw on a Ubuntu machine, I'd be keen to know where to get alternative software for graphics like this. Nankai (talk) 10:55, 15 May 2009 (UTC)
Is that fixed now? Openoffice was doing some strange things, which I am not familiar with. Lots of unnecessary <g> tags, embedded font glyphs, unusual methods of formatting text etc. I ended up first trying to manually clean up the defs, but gave up, then opened the file in inkscape, copied the visible objects and pasted them into a new document, thus leaving all the old odds and ends behind. Not the best solution, but it worked (I think :) ) User A1 (talk) 13:35, 15 May 2009 (UTC)
It is now almost fixed. I succeded in adding Inkspace to my Ubuntu machine as User A1 advised. I discarded the original created in OpenOffice Draw. I downloaded A1's version and edited it in Inkspace, teaching myself as I went. I was able to place the labels in their appropriate positions. I edited this version into Japanese and saved it under a new name, then uploaded the Japanese version. I linked that to the Jpanese Wikipedia article, and it renders well as a small-scale thumbnail.
The thumbnail version in the English article still has ugly text; the fonts are not rendering very well at small scale. This is the only remaining problem. I will try to work out what to do (by looking in Meta's SVG Fonts advice) but some more help would be great. Nankai (talk) 09:26, 16 May 2009 (UTC)
You can convert the text to a Bezier path using "object to path", and the image you upload will match exactly what you see, regardless of fonts. However this is a one way trip -- you will not be able to directly edit the text again, only as nodes, and the SVG file size will be a bit larger as a result of the conversion. User A1 (talk) 16:12, 16 May 2009 (UTC)
Hello User A1, I was wondering if you could help me figure out this one too. I made a file in Illustrator, using a map previously done in Inkscape. (when I opened it everything was displaced as always, probably some intolerance btw Illustrator and Inkscape). Well anyways the only thing I did was adding the lines and text to creat an illustration. I saved the file and uploaded it to commons, which failed to render the file and showed only white space instead of anything. I tried several things, but at the end was forced to open svg file in inkscape and save it again. For some reason it worked, but the size significantly increased again. I find Inkscape really frustrating, but everytime wiki forces me to use it. Can you give me some hints on the matter? Why am I having these problems? Thanks.
--Ahnode (talk) 16:17, 27 May 2009 (UTC)
As adobe may be stuffing up the SVG output, you can't avoid using inkscape to fix it, unless you fix it by hand.
Here are a few hints, sorry for the delay, I have been busy of late:
You need to stop adobe from appending their proprietary PGF data to the SVG. This is not supported by RSVG and hence wiki, and is therefore both redundant and useless. It is base64 encoded binary data, and can be safely deleted, and will probably take about a third off the filesize. To do this, use inkscape's XML editor to delete the following node:
<i:pgf id="adobe_illustrator_pgf">
Adobe appears to be incorrectly writing italics and bold information into the file. Do your italics and bold corrections in inkscape.
Any data outside the bounds of what you need can be deleted. This will reduce the filesize considerably. In this case africa, bits of greenland, a good chunk of the mediterranean and spain could have been erased, as it lies outside the doucment bounds.
Inkscape has a "simplify" function to reduce the number of nodes along a path. This will reduce your filesize, but at the cost of a smoother approximation to the original path. Often the reduction is not noticable without detailed examination of the image
In short, the SVG output from inkscape appears, and I may be wrong here, to be correct and the output from adobe appears to be wrong. Hence RSVG will not render some of this information. Inkscape is doing its best to interpret what your adobe flavoured SVG file is actually trying to do, and is writing out correct SVG at the end.
As far as filesize goes, Inkscape will layout your SVG in a neat, human readable manner as well as including lots of inkscape metadata. By exporting to plain SVG, rather than inkscape SVG, the metadata will not be written to the file, and you will obtain a reduced filesize, however the neat layout is maintained regardless.User A1 (talk) 07:13, 7 June 2009 (UTC)
I've tagged this as resolved. Above you will note that for filesize reduction, the python script "scour" has been recommented. I've never tried it, but it might be worth a shot. User A1 (talk) 02:59, 15 August 2009 (UTC)
Latest comment: 15 years ago3 comments2 people in discussion
Resolved
Hello. Please can anyone help me produce a subscript in <text>? I've tried baseline-shift="sub" in a <tspan> but it has no effect, so clearly I'm doing something wrong. Here's a minimal example of it doing nothing (when rendered in Firefox 3) but the font size change does work:
Viewing your svg file in Opera and IE+ASV shows properly subscripted characters, so Firefox & RSVG may have bugs [1]. Globbet (talk) 22:30, 11 June 2009 (UTC)
Thank you Globbet, that's very useful information. I suspected Firefox may be the problem but had ruled it out, as my SVGs also display wrongly in Inkscape 0.46. If it's a browser issue then I think I've done the best I can and I'll leave it for the Mozilla team to fix! Certes (talk) 10:22, 12 June 2009 (UTC)
I have lines with terminating arrow heads defined as <symbol>s in my <defs> section. When I use those symbols (<use xlink:href="#arrow" .../>), the arrowhead appears, but the line does not (both are marked up as <path>s). Am I going insane, or is this some bug in librsvg? The small arrowheads for the angle indication are also a bit... well, screwed. I've tested, and it appears as I intend in Firefox and Opera. Thanks — Zazou20:21, 16 June 2009 (UTC)
It's a bug in our older version of librsvg. You can work around it by converting each stroke with arrowheads to a path. In Inkscape (which I realise you've not used in this case) that's Path → Stroke to Path (Ctrl-Alt-C). Certes (talk) 22:20, 16 June 2009 (UTC)
Ah, that applies to definitions other than markers? That's... well, incredibly inconvenient. Thanks for your help. — Zazou01:43, 17 June 2009 (UTC)
I created a set of four diagrams: 1234. To try to correct for text issues I did Path->Object to path. However:
in all images some of the text appears thickened
image 3 still has text overlapping problems.
All the images were drawn in illustrator, then loaded into Inkscape to save as svg. As you can tell, I am not very familiar with inkscape or svg. Thanks, Celefin (talk) 18:14, 20 June 2009 (UTC)
The text thickening is a font substitution problem, the same one as a couple of posts below. There is a mismatch in the naming between the fonts on your computer and the naming of fonts on the rendering computer (mediawiki). The correct name for "DejaVuSans" is "DejaVu Sans". As such the incorrect font is being used upon substitution. I am uncertain how to adjust illustrator's font-naming to fix this. You could open the file in a text editor and replace all instances of DejaVuSans with DejaVu Sans, but this will also affect font effects (bold, italic etc). As far as I can tell, illustrator appears to use different font face names, rather than font styles to inform the program to use italics/bold.
As for the overlapping problems, this is the result of a use of a <tspan> element. tspan elements currently cause problems for RSVG. If you wish to have unusual text placement, simply use two separate text boxes, rather than attempting to use a tspan. Use the "remove manual kerns" function in inkscape to remove the tspan elements (Text -> remove manual kerns). User A1 (talk) 06:34, 21 June 2009 (UTC)
Thank you very much for your help, I will look into these things. I guess the <tspan> is from Illustrator text areas. Celefin (talk) 12:29, 21 June 2009 (UTC)
Images are improved, thanks again. For the font issue, Inkscape for some reason wasn't seeing DejaVu Sans properly on my mac, reinstalling the font seemed to do the trick. Remove manual kerns resolved some but not all of the overlaps, so I recreated those problem bits of text in inkscape. Celefin (talk) 16:35, 21 June 2009 (UTC)
Sorry, the problems are not obvious again... Can you upload a PNG of what it should look like, or elaborate on the problem? User A1 (talk) 02:39, 27 June 2009 (UTC)
Well that is odd. I have been able to reproduce it locally with RSVG (2.26.0), so it is not a MediaWiki problem. I will see what I can come up with. User A1 (talk) 13:11, 28 June 2009 (UTC)
This still has me stumped. Black box testing is getting me nowhere. I will have to do a source build of RSVG. User A1 (talk) 04:44, 6 July 2009 (UTC)
I never got around to debugging this. You may want to submit a bug report to the rsvg tracker (although its not the most active of places). I'll tag this as stale, if I get the time I will look at it. User A1 (talk) 02:59, 15 August 2009 (UTC)
Having trouble with fonts here. The map (and others like it) are being created in ArcGIS using the Deja Vu font. I save the images, but have different problems. When I open the SVG in Inkscape, the font changes from Deja Vu to something else (Arial maybe?). I convert the text back to Deja Vu. I upload it, but get the misaligned text in PNG copies. When I look at the image itself, everything looks fine. On the other hand, when I open the svg in Illustrator, it has the correct font settings already. But when I upload the file, I still get the misaligned text, and when I look at the image itself, it definitely does not show the correct font (unless Deja Vu does have serifs). I have access to both Inkscape and Illustrator, but prefer Illustrator as it makes smaller file sizes. Can someone tell me what I'm doing wrong? Thanks! 25or6to4 (talk) 04:55, 29 June 2009 (UTC)
As per a few users below, you have the "DejaVuSans" vs "DejaVu Sans" problem and the font-weight vs font-name issue.
If you open your SVG file with a text editor you can see that it has many fonts specified as "DejaVu Sans" and "DejaVuSans". You need to ensure that only "DejaVu Sans" is being used. Try creating a simple illustrator file with just the letter "A" in "DejaVuSans"/"DejaVu Sans", and see what it spits out by examination with your handy text editor. Wiki will only recognise the name "DejaVu Sans", which I believe is the correct font-name. Check your font installation, and see if it has the right names, you may have to install the "DejaVu Sans" font. (Annoying, no?)
Again, as per below, illustrator seems to unusually specify the bolding of text. Instead of using the font-weight parameter, they instead use a different font. My computer does not respect this method of text bolding when rendering with either firefox, inkscape or RSVG, so I choose to blame illustrator here. I don't have a solution, you could try pestering adobe, call it a bug and see how far you get. I do however have a work-around. Use inkscape to do final bold & italic corrections, as inkscape uses the font-weight parameter. Alternatively correct every instance of font-weight=normal in combination with "DejaVuSans-Bold" using a find and replace in a text editor. Painful.
Finally your SVG has base64 encoded font URLs in the SVG file. I doubt (haven't tested though) that RSVG would honour these, for security reasons (Think time variant SVGs, simply change URL contents for hilarious/malicious results using symbol attacks, possibly involving substitution of custom genitalia glyphs for the "e" character, right before someone gives an important presentation. Or a funny SVG file could be used as a DDOS attack on someone's server. Anyway, I rant...)
If you want me to just magically fix it, let me know, but this will happen repeatedly until you find a good solution that works for you. If you know how to use regular expressions, you can probably cook up a quick and dirty solution for yourself. User A1 (talk) 10:20, 29 June 2009 (UTC)
All right, here's what I've found out since. It seems that some of the problems are coming originally from ArcGIS. The base64 section at the beginning is being created by it, and is setting the text as DejaVuSans. I fixed it in wordpad, but uploading a couple different versions still is not working. What did I miss here? Thanks for the help so far! 25or6to4 (talk) 21:25, 30 June 2009 (UTC)
Note how I convert the transformation matrix (the notation is in format, M 2x2, b 2x1) to the identity, and then bump up the glyph size. These should produce near-identical images, but they don't. This seems to be another aliasing bug in RSVG :( . I also removed the tspans for good measure. User A1 (talk) 03:18, 4 July 2009 (UTC)
OK, so what do I need to do to fix this now and in the future? This is not limited to this image. I have made hundreds of images that have the same problem, or have the wrong font completely. They used to look correct, but now they don't. 25or6to4 (talk) 03:48, 6 July 2009 (UTC)
if you can point me to, say, three different files, I will try to whip up a python script to solve this automagically. User A1 (talk) 04:43, 6 July 2009 (UTC)
I have started here, but it doesn't work yet. I think it is to do with soup's tuples. Feel free to have a play if you know how. I'll take another shot at this tomorrowUser A1 (talk) 13:40, 6 July 2009 (UTC)
Yes, actually -- Sorry i haven't replied earlier. I have a latest version of the code on that page above, however it still has one large bug, which as far as I can tell is a problem in BeautfulSoup (a 3rd party python lib), which happens when loading the XML file. the <g id="Label"> tag closes itself for some reason, making the text go below the rest of the image, and generally rendering the SVG completely differently. Annoying, and stopping me in my tracks.
Anyway, the code correctly substitutes fonts, fixes bolding & italics and nukes <tspan> usage. Unless someone can work out some way of fixing or work around the stonesoup bugs. An idea that does work is to cut and paste the text labels to a separate file using inkscape, then run the python code against that, then paste it back. Kinda sucks, and makes me annoyed at RSVG and BeautifulSoup's bugginess, but it works. Also took a lot longer than thought it would. User A1 (talk) 08:23, 19 July 2009 (UTC)
As that code works (albeit with much futzing around) I have tagged this as resolved. Feel free to un-tag it if you like User A1 (talk) 02:59, 15 August 2009 (UTC)
No file, but a general question
Latest comment: 15 years ago15 comments4 people in discussion
Resolved
Hope that's fine, but if it helps to look at a file, I can upload one. I would like some help in converting a string of coordinates in a path from absolute to relative.
I have code like this:
<path d="M -120.80299,326.11593 L -116.50534,308.21523 L -111.84056,290.3365 L -110.78977,286.10698 [...]
The files I'm working with are close to a megabyte in size, when they could be under a quarter of a megabyte, at least. I know they are so big only because the paths use a string of absolute coordinates rather than relative. Any help would be greatly appreciated. — Athelwulf[T]/[C]20:38, 9 August 2009 (UTC)
That sounds like the sort of change that needs a simple program. Do you have the skills and tools to produce one in a suitable language? (Personally I'd use Perl but I think Python would be a more popular choice.) The parsing algorithm is something like "on M a,b remember a,b; on L c,d if a,b remembered then replace by l c-a,d-b and remember c,d instead; on anything else forget a,b. It would be awkward and inefficient to parse every pathological case like <text>M 1,2 L 3,4</text>, but it may be easy to hack together a script that happens to work on the 99% of the subset of SVG used in these particular files. Certes (talk) 22:13, 14 August 2009 (UTC)
chirp, chirp. I think this depends on the program you are using to work on the SVG file and failing that what OS are you using. --Erp (talk) 21:46, 14 August 2009 (UTC)
Followup. You might want to look at Scour which is described as "aggressively" cleaning up SVG files. No guarantees, I have not tried this program but it does have a fair number of mentions on the web. The release notes indicate converting to relative coordinates is one thing it does. --Erp (talk) 21:54, 14 August 2009 (UTC)
I tried installing the Scour plugin for Inkscape, but it didn't work. The website says it should create an option to save as a "scoured SVG", but no option appears. The only computer languages I know are HTML and CSS, so I have zero knowhow or experience in creating programs. For what it's worth, I run Windows XP, and usually I edit .svg files directly with Notepad, because the cruft that Inkscape inserts really annoys me. — Athelwulf[T]/[C]07:29, 16 August 2009 (UTC)
You need to install python_(software) to run the program. Inkscape may have a bundled python interpreter under windows. I don't know. From the scour website:
To run scour on the command-line, first download and install Python, then download scour. The basics are:
$ python scour.py -i input.svg -o output.svg
Inkscape 0.47 does not include the script. I tried installing the extension on this new version of Inkscape, but again it didn't work. One problem is there is no extensions/ folder in my Inkscape installation, which the Scour website tells me to put the scripts in. There is only plugins\, python\, and seemingly unrelated folders in C:\Program Files\Inkscape\.
I tried installing Python, placing the executable in C:\Windows\. Then I put the scripts and the source .svg file in C:\Documents and Settings\{username}\ and ran the command. It gave me this:
Traceback (most recent call last):
File "scour.py", line 2324, in (module)
options, (input, output) = parse_args()
File "scour.py", line 2291, in parse_args
infile = maybe_gziped_file(options.infilename)
File "scour.py", line 2278, in maybe_gziped_file
return file(filename, mode)
NameError: global name 'file' is not defined
What am I doing wrong? Is there any other info I should give? This is already way too much effort just to convert a few paths... — Athelwulf[T]/[C]18:53, 17 August 2009 (UTC)
"file(...)" is a function in python that opens a file -- your system is not correctly set up. Do *not* move the python executable, this will render it unable to find the library functions it needs to work, and will cause it to fail as above. You need to change your %PATH% environment variable. How to set env. vars, and python windows FAQ. User A1 (talk) 01:00, 18 August 2009 (UTC)
I did not move the executable. While installing, I directed it to install at the directory C:\Windows\. I should've been more clear. I tried the web-based version, and although I couldn't get it to work earlier, now it does. It does something very strange to the path data, but the file renders properly and is significantly smaller now, so I guess I'll live with it for now. Meanwhile, I'll just figure out for myself how to make python work. Thanks. — Athelwulf[T]/[C]21:35, 18 August 2009 (UTC)
For the curious, here's what the web-based Scour does. It turns this:
M 101.03996,270.06644 L 101.03996,270.3065 L 101.27996,270.54656 L 101.27996,270.78661 [...]
Installing python under C:\Windows is not a good idea, if any files in python happen to have the same name as an important system file that windows uses, this may render your computer inoperable, and require a re-install. Good to see you got some output from the web-based versionlUser A1 (talk) 01:54, 19 August 2009 (UTC)
SVG standards
Latest comment: 15 years ago3 comments2 people in discussion
I cant see most .svg files on Wikipedia since they seem to either specify the foreground color as black and not specify the background or they specify the background as my font color and don't specify the foreground. I assume everyone who has a black background has this problem. Can we have a rule or standard that states that both or neither should be specified? --MLegion (talk) 20:33, 30 August 2009 (UTC)
Thanks. But there is still something odd here. The original version looked fine when viewing the SVG in my browser, but Mediawiki would lose the circles when rendering to PNG. Under your version, the circles are present in the Mediawiki PNG thumbs, but now they are missing from the SVG in my browser (Firefox 3.5.3). Is there no way to make this file digestible by both renderers? Hesperian23:23, 17 September 2009 (UTC)
I'd appreciate it. Meanwhile I'll try subtracting the bracts geometry from the background, so that the background is around the bracts rather than behind them. This ought to eliminate any z-ordering issues. Hesperian04:52, 18 September 2009 (UTC)
After doing the above, you can see the gap where the circles ought to be. This proves that the problem is not z-ordering; these circles simply aren't being rendered. Hesperian12:30, 18 September 2009 (UTC)
Hooray! I've fixed it. Your fix above was what was needed, except that for some unknown reason those circles were referencing that filter def, so the refs had to be removed as well. Hesperian13:09, 18 September 2009 (UTC)
Ok, I know this is a stupid question, but here it is: I'm trying to fix the colors on an obscure Balkans flag File:Flag of Herzeg-Bosnia.svg. I downloaded the thing, and it materialized as a PNG file, so I fixed it up with Photoshop (replace color). I naturally want my new image with the proper colors (which is still PNG) to replace the old one. So when I'm done, I use Inkscape to convert the PNG into an SVG. Then I go to commons, upload the image under the exact same name ("File:Flag of Herzeg-Bosnia.SVG"), it replaces the old one - but no thumbnail gets generated.
For the record, I realize I'm probably missing something obvious. I edit text, and I mostly don't get into images... --DIREKTOR(TALK)09:32, 10 October 2009 (UTC)
I think when you grabbed the image you right clicked and selected "save image as.. " or some-such? That won't work they way you think, as Wikipedia auto-renders PNG images from the SVG data files. You need to either click through the linked image or right click the image and save LINK as. At any rate the link is here, and it is most definitely an SVG image User A1 (talk) 14:20, 10 October 2009 (UTC)
Right, two more questions:
1) I went with "save link as", edited File:Flag of Herzeg-Bosnia.svg in Inkscape and uploaded the new fixed-up file in commons. It replaced the old file and a thumbnail did appear. Unfortunately, the image is the same as before. :P When I go to enWiki (specifically the Croatian Republic of Herzeg-Bosnia article), the image is the way it was (the wrong way), however, when I click on it - its the new file with the fixed colors (different shades of blue and red). I waited a while and this is still the case. Will the file eventually be updated?
2) In general, if I create a PNG file on my computer and convert it to SVG using "save as" in Inkscape, will I this SVG file work when I upload it to the Commons? Thanks
This is your local browser cache still caching the old image. You can bypass your cache to fix this. For other users who have not visited the file however, the update will be instantly visible.
No. Raster data and vector data are fundamentally different information types. You cannot convert a PNG to an SVG automatically and expect good results -- were this the case there would be an SVG conversion bot running around wiki :). Whilst inkscape has a built in automatic tracer called potrace, it generally produces less than optimal results for most images, and must be invoked from the path->Trace bitmap menu -- it is not invoked by simply dropping PNGs into inkscape. Secondly performing the conversion in the way you specify will not actually save the PNG as SVG data. All this will do is create an SVG that link to the PNG image, which (1) isn't scalable and (2) wont upload the PNG data to wiki when you upload the SVG, as it can't get the linked image. User A1 (talk) 01:32, 11 October 2009 (UTC)
Embedding links in SVGs
Latest comment: 15 years ago4 comments2 people in discussion
Is it possible to link parts of an SVG to Wikipedia articles? For example, I've created this SVG [2], and it would be really awesome if the text could actually link to the relevant wiki articles. Is this possible somehow? --Robin (talk) 14:57, 17 October 2009 (UTC)
I don't think that the infrastructure to do that exists. However, the easiest way to do what you want is to use "hot regions". See Electricty distribution and its talk page for examples. You can associate image regions with hyperlinks.User A1 (talk) 01:10, 18 October 2009 (UTC)
Alright, I guess ImageMaps aren't that painful to use. It would have been great if there were an easier way though, since this feels like more of a workaround. Thanks for the help. --Robin (talk) 02:13, 18 October 2009 (UTC)
Lines not showing up
Latest comment: 14 years ago9 comments3 people in discussion
The lines in this image are not showing up. I think the problem is that the wikipedia rendering function does not like the "shape-rendering:crispEdges" style used for the lines. However, this style allows the lines to be placed very precisely with very thin widths, but still visible at lower resolutions. So I would appreciate it if someone could let me know if I have a problem in my file, or if I there is another way to achieve the desired effect, or if it is something else. Jkasd06:07, 21 October 2009 (UTC)Category:Wikipedia image help
I just want to clarify that the lines only misbehave when viewed through the wikipedia rendering function. For example, the image behaves as desired here. Try zooming in and out to see how the lines stay visible at all resolutions. Jkasd06:17, 21 October 2009 (UTC)
I will look at this in about 12 hrs, but neither image shows anything byt a black bar for me... User A1 (talk)
They don't show up because each line is 0.0001 pixels wide. Set that to "1" or larger, and everything is fine. Having a <1px line for disabled antialiasing could be interpreted under the spec to use round(0.0001) or floor(0.0001) to set line width. 1px is exactly what you need. User A1 (talk) 11:05, 23 October 2009 (UTC)
But would this make the lines 1px at every scale? I don't want the lines to look thicker at different scales. Jkasd19:31, 23 October 2009 (UTC)
Technically by having the lines change thickness (to always 1px) at different scales, as you want to have, breaks the idea of a scale invariant image. All I can do is point you at the relevant bit of the specification [3]. So no -- the lines should become larger as the image is zoomed in -- this makes sense from a scale invariance point of view. User A1 (talk) 00:05, 24 October 2009 (UTC)
Yes I realize that that is the point of SVG files, but the image as is behaves as desired when rendered in firefox. This is probably just a bug in firefox though I guess. Anyway if anyone does no a way to do this I would appreciate it. Thank you. Jkasd00:56, 24 October 2009 (UTC)
This is a weakness of SVG for many applications, and goes against one of the proposed requirements here [4] (See 18.d). Keeping thickness and text size invariant with regardless of scale is needed, at least as an option. Think of CAD applications: you want to zoom into your house drawing without making lines thicker, or zoomable maps, where you want descriptive texts not grow. --150.241.250.3 (talk) 15:31, 14 May 2010 (UTC)
Safari
Latest comment: 15 years ago3 comments2 people in discussion
I cannot for the life of me get safari to view ANY svg on wikipedia properly. They show up as enormous files that can't be scrolled or zoomed so that you can only see a tiny portion, usually the extreme upper left corner. I'm using the latest safari, but my OS is 10.4.11. Any help would be appreciated. Thanks.Armandtanzarian (talk) 20:50, 25 October 2009 (UTC)
I am trying to upload this coat of arms I created, but firstly, the picture doesn't show unless I click to the full picture view, and secondly, a figure of an animal-head that's supposed to be on the front doesn't show up at all. I am pretty new to creating imagery in this way, so there's probably just something basic I did wrong. I have also head similar problems earlier. Can someone help? -GabaG (talk) 18:04, 31 October 2009 (UTC)
You have a linked image (i.e., a second file) which you'll need to put in the svg file rather than just linking (perhaps trace bitmap). I suspect this is also the reason nothing shows. --Erp (talk) 19:26, 31 October 2009 (UTC)
Could you say or suggest what specifically I should do to fix the problem? I'm not exactly an expert on this.. -GabaG (talk) 20:29, 31 October 2009 (UTC)
When you are editing, you cannot simply insert PNG or other raster image formats into inkscape and expect it to be able to convert it automatically to vector data. Vector and raster information is very different in nature. In the image you have uploaded the file "C:\Users\Jarle G\Documents\Hobby\CoA\SmørHeadb.png" is referenced externally to the document. Wikipedia (1) does not know about this file, as you have it on your computer, and not the not the wikipedia server and (2) this image is not scalable. If I zoom in, all I will see is pixels. SVG works as a Scalable image format, because it stores things in the form of "make a line here" and "make a circle there" type instructions, which do not require "pixel" (raster) sizes to be known until it comes time to draw it. If you wish to include the information in this file, you will need to draw over the top of "SmørHeadb.png" in inkscape, and then delete the PNG file prior to uploading. As Erp mentioned, there are automatic tools in inkscape (Path->Trace bitmap), but the output usually requires significant manual attention to make it non-crap.
In short vector data and raster data are two very different things, you cannot simply drag and drop a PNG and expect it to be automatically converted with any reasonable accuracy. There is too much judgement required, of which the computer is not capable. User A1 (talk) 00:36, 1 November 2009 (UTC)
Thank you very much. I managed to correct both my problems now. The figure also became kind of ok, pretty manual though. I see there is more issues I'll have to get a hold off too though, but that's another story, I'll just have to read some tutorials/help. But I was very happy with getting help with this, it was something that had really been bugging me. Regards, -GabaG (talk) 01:20, 1 November 2009 (UTC)
Font problems with text converted to paths
Latest comment: 14 years ago3 comments2 people in discussion
Resolved
I have uploaded a diagram in SVG here. It generally renders fine, but at the 2000px setting, there are text problems. (The 'k' and 'o' in "pseudoknot" at the top right corner overlap, and the distance between the 'r' and 'o' in "alphaproteo-" at top left is also off.) I had earlier had problems like this, and thought I had resolved them by converting fonts to paths, and re-uploading. However, while most of the PNGs are correct, the 2000px png is still wrong. I wonder if the 2000px simply didn't get re-rendered. If it helps, I'm using Adobe Illustrator CS to generate the SVGs. Zashaw (talk) 05:18, 7 December 2009 (UTC)
The image has a random black rectangle in the lower right hand corner that I'm trying to get rid of. I've tried converting the arrows to paths and saving as a plain SVG but neither have work. Any help is appreciated. Wizard191 (talk) 19:03, 17 December 2009 (UTC)
You have two zero-width rectangles in the image, which I found using a local copy of rsvg and then removing objects from the image, checking for the mysterious black boxes.. I have uploaded the fixed image.
Also you have some large invisible layers in that image -- do you need them? I assume you are keeping them for other files? User A1 (talk) 10:09, 22 December 2009 (UTC)
I made this file in Corel Draw 12 using older files such as File:Maksutov-Cassegrain-Telescope.svg for a template. The Corel SVG export highlighted errors (sorry, don't understand any of them) and the uploaded file was pretty messed up. I tried fixing errors by converting all text and line elements to curves, saving a new SVG, and uploading that. The new image looks much better but the image page and all the thumbs are still showing the PNG of the previous messed up SVG. Is there a way to purge the generated PNG? (Also is there a tutorial somewhere on exporting SVGs out of Corel Draw 12?). MrFloatingIP (talk) 02:43, 6 January 2010 (UTC)
Unfortunately, you may need to wait for the wiki computers to catch up. I am not entirely clear as to how the wikimedia systems are configured. However you can try bypassing your browser cache WP:CACHE. If you want to see how an uploaded file will look when rendered, you can use rsvg (which is what wikipedia is using) to view it on your local computer; however if you are running windows , you may need to find compiled "binaries" (executables), as the project only provides source code. If you have access to a linux or mac OSX computer, you can easily install precompiled binaries with a package manager (such as fink for mac, or synaptic for linux). User A1 (talk) 03:24, 6 January 2010 (UTC)
Hello, I am trying to translate http://upload.wikimedia.org/wikipedia/commons/4/47/Austria_Hungary_ethnic.svg into Spanish for use in the Spanish wikipedia but I have a weird issue with this file. I use inkscape to try and edit it but text is identified as an object (I can select it) but not as text (I cannot use the Text->Text and font option to change the texts in the map). Besides, I have tried editing the xml file in vi but I cannot find the text in the map at all... Funny. Any idea on what I may be doing wrong and how to get the text identified as text so that I can translate it? Thank you!--Rowanwindwhistler (talk) 20:21, 10 February 2010 (UTC)
Unfortunately, as you say the text in the SVG file has not been kept as text for editing, it has been converted into path information. (so each letter is actually a shape, fully represented by a filled spline). As such you will not be able to use the text tool to edit it, as text to path conversion is effectively one way (theoretically you could to OCR, but I know of no software that can do this). My recommendation is to simply delete the text one by one, and replace it with your translated text. It is a bit tedious, but unfortunately with the file data the way it is, that is what must be done. User A1 (talk) 10:32, 11 February 2010 (UTC)
Aha, I see, I suspected as much. I turned all the country and city names, title and legend into text (and Spanish as that was my original goal) and some river names as well (the ones that have a different name in Spanish as far as I know) and maybe this new version can be used for others to translate into different languages in a easier way. As usual my fonts do not look the same in inkscape as in commons but I'd say the map is readable enough... Thanks for your help!!--Rowanwindwhistler (talk) 16:33, 11 February 2010 (UTC)
Some thumbnails are garbled
Latest comment: 14 years ago2 comments2 people in discussion
Present Librsvg version (as of 2010-02-16) renders some Wikipedian thumbnails erroneously:
If I had to guess, I would say that there is an integer conversion happening when the glyph size is being computed, resulting in the text being far too large. Did you want me to play with the SVG to see if there is something I can do? Or are you happy just to leave it on this talk page ? User A1 (talk) 12:04, 16 February 2010 (UTC)
I didn't understand your question for 100%, but you are free to play with separate copy of this SVG. Please do not change the version which appears in the article: I'm pretty sure that the problem in graphic engine must be fixed, not the picture itself. By the way, Opera refuses to display this SVG image correctly: it renders something ca. 5 minutes taking 99% of CPU time, then displays boxes without labels. The SVG image's thumbnailBPK (talk) 21:35, 16 February 2010 (UTC)
The file does not rasterize on Wikipedia. I have not yet been able to determine why.
The original version renders fine with Inkscape; with Firefox 3.6 there is a minor image issue; with Adobe-SVG (IE) it renders with a complaint; but it does not rasterize on Wikipedia.
I have used "Scour" on the file. Now there are no issues on Firefox or Adobe-SVG (IE). I have downloaded and installed RSVG. RSVG rasterizes it, but with errors. Wikipedia still does not rasterize the file at all. I am unable to duplicate complete non-operation of RSVG.
For testing it would be nice if there was a quick way to have wikipedia rasterize a file without having to clutter up the file version log with minor blind changes in the hope of resolving the problem(s). Preferably this would also provide debugging output so problems can be readily identified.
Given that it is unlikely such an interface would exist in the near future, the other reasonable method of testing is to duplicate the problem on a local machine. What version of RSVG is wikipedia running at this point? Makyen (talk) 15:05, 17 February 2010 (UTC)
I was able to reproduce the problem on my local machine. RSVG failed to generate the image without (1) changing the XML header from width="100%" to width="100px" (actually I set it to 800 to look nice), and do the same for height. Secondly I had to remove the <g display="none">...</g> branches which contained external links. I am running RSVG 2.26.0, so it is possible that this behaviour has changed in later versions. RSVG gave no errors, so WP cannot catch this, without employing some form of heuristic test. Browsing the spec, I think, but am by no means certain, that RSVG is at fault here. The spec appears to state that % is a valid unit for the width attribute of the SVG element, but exactly what that % refers to a % of is a bit unclear to me.
If you are running a newer RSVG than I, then I would guess that RSVG has fixed this recently. If this is the case you could try talking to some wiki devs on IRC to see if they can update RSVG, or open a wiki bug in the appropriate place.
As for some more useful RSVG preview system, I would have no idea how one would go about implementing that, you would need to emulate the mediawiki behaviour, which would probably be easiest in the form of a script running on the toolserver. I am not a wiki-anything (just a user), so you might need to take this up with someone in the know. At any rate, your image is fixed :) User A1 (talk) 20:09, 17 February 2010 (UTC)
I recently created my first SVG using Inkscape and proceeded to upload it to the Commons. Everything worked out fine except that there is a small black mark underneath the raised arm in the image, and I do not know how to correct it. I'm not sure if this will help, but when using Google Chrome, the image at its file page appears with the black mark, but when I go directly to the online file, it doesn't. In Firefox, however, the black mark shows in both images. Thanks for your time, ~SuperHamsterTalkContribs00:41, 9 March 2010 (UTC)
I managed to fix the problem by simply opening a new document and copying/pasting the drawing, then re-uploading it. Must have been just a slight rendering issue with the original document. ~SuperHamsterTalkContribs03:35, 9 March 2010 (UTC)
For Template:Music (Template:Music/Doc) I'm trying to create an svg version of File:Three quarter flat.png since I assume the "scalable" aspect of "svg" will allow it display better. However, when I finally managed to convert it to svg with OpenOffice it was surrounded by whitespace. The only solution I've found is to stretch the image before exporting, and that is not satisfactory either. Hyacinth (talk) 07:39, 12 March 2010 (UTC)
Im not sure exactly what you have done, however you have simply re-encoded the PNG inside the SVG file, like so.
Thus this is not a "pure" SVG image. I personally would recommend inkscape over openoffice draw, and remember that you will need to trace over the image by hand to obtain the vector data, cutting and pasting a PNG does not allow the translation between the different types of data. User A1 (talk) 10:23, 12 March 2010 (UTC)
I didn't do anything with any code, so I have no idea what you mean. Inkscape says it can't find the X11 I installed for it. I don't know why you're talking about cutting and pasting, but the language used in OpenOffice is "open" and "export". Hyacinth (talk) 00:45, 13 March 2010 (UTC)
The problem here is one of understanding, in particular it is important to realise that vector and raster data are two completely different types of data. Whilst it is relatively easy to convert vector data into raster information, it is much more difficult to go the other way, and needs to be done manually.
When you "open" a PNG file, the data contained in is raster data. This data consists of rows of pixels with values for relative intensities of red,green and blue (slight simplification). This data is then reproduced on a device, and scaled as needed. When you zoom in on the image, you will notice that the edges become "blocky", as you are simply enlarging the boxes. Scalable vector graphics (svg)on the other hand contain vector data, which is usually represented by lines and curves (make a line between here and here, make a circle here, with a radius of blah, etc etc).
These two forms of information are fundamentally different, there is no single way of converting vector data into raster data, i.e. there is no simple answer that the computer can follow to get an unambiguous SVG from the PNG. When you opened the file, openoffice draw has simply dumped the PNG and done a nasty hack. It has simply taken the information (quite literally the bytes) from the PNG and left it in raster form, albeit dumped in the SVG file in a special way known as base64 encoding. Thus your SVG file is in fact not a true "Scalable" file, as it contains raster (unscalable) data, rather than pure vector information. You need to manually trace over the image to create your own interpretation of the raster data in vector form. Simply opening and exporting is insufficient to translate between the two styles of information.
At any rate, I have simply used the "Trace bitmap" feature in inkscape. It did a good job (simple path data), and the conversion is now done. User A1 (talk) 18:24, 2 April 2010 (UTC)
Erm, if you have any questions, you may of course ask, and I can help you. The pages on vector and raster data (links above) should help, but if you still are unsure why your upload had problems, I can try to explain better. User A1 (talk) 21:29, 3 April 2010 (UTC)
Arial
Latest comment: 14 years ago7 comments2 people in discussion
Given that we have Helvetica available in the SVG fonts lists, why then are we using Random Sans to substitute for Arial in SVGs originated on OpenOffice, rather than Helvetica, which Arial was purposely created to be drop-in interchangeable with? This seems to completely break up detailed formatting (eg in diagrams), in a way that is completely unnecessary.
Come to think of it, why is the formatting being broken up just so badly? I could understand a certain amount of mis-kerning as a result of the metrics not quite matching, or a bit of overflow, but instead given an unknown font, our SVG interpreter seems to just dump the text at the left margin.
This seems a completely unnecessary fail by the SVG interpreting software. Can it not be configured to fall through a bit more gracefully? Jheald (talk) 16:53, 14 March 2010 (UTC)
The odd thing is, having fixed the broken images, by replacing the characters with paths,
having done all that, I now find that, if I look at the old versions of the images, OpenOffice had actually provided encapsulated information for each of the characters used -- i.e. it had actually given full path information for each character in the file.
So whether on "free software" grounds the wiki software actually had the full fonts or not is completely irrelevant: the information it needed was actually given (as the copyright on these fonts allows) in the file all the time.
All this blather about copyright fonts is just so much hot air: what we really have here is a bug in the rendering software, plain and simple. Jheald (talk) 18:48, 14 March 2010 (UTC)
There are two problems here (1) should wiki allow embedded fonts? Probably (2) Is it technically supported, maybe not. Pragmatically, just use something like DejaVu sans, and you will not have any problems. No embedding required as the target machine has the font. Neater SVGs for all. I have not studied the Arial or helvetica licences (though I ran a quick search, but turned up nothing) to see whether font embedding is allowed, and how redistribution is to be done, nor am I in charge of any wiki servers :). Feel free to raise this somewhere more likely to get a response, such as the librsvg bug page. User A1 (talk) 22:23, 14 March 2010 (UTC)
The URW version of Helvetica supplied with Ghostscript, that WP has on the server, is as far as I am aware completely free software -- re-usable in any way anyone likes.
As for Arial, according to Microsoft the legal embedding rights can be found expressed in the embeddability bits in the font file. ([5] "Can I embed Microsoft fonts in my documents?"). For Arial, the permissions indicate "editable" -- the second highest level of permission -- meaning that the font can be embedded within content that can be edited by the user. Therefore yes, such use does seem to be entirely licensed and legal.
(In earlier days, these bits weren't always set accurately, so much software - including some versions of Adobe Distiller - simply ignored them. Agfa Monotype brought a famous case against Adobe, claiming that ignoring the bits breached the DMCA. But the courts held that the bits were just flags, and did not "effectively control access". [6] It seems also that Agfa could not assert that the software fell foul of "contributory infringement", since it had significant bona-fide applications. Nevertheless, none of that gives a user the right to embed a font that hasn't been licensed to be embeddable. However, at least according to its own font file, Arial has been licensed (from Monotype by Microsoft) to be embeddable. Which was our concern here).
On the technical side, we can conclude there currently seem to be (at least) two bugs:
(1) where fonts have been embedded, the libsvg software is not picking up the paths that are explicitly included in the file for glyphs from the embedded font -- or at least, it is not able to pick them up in the format that OpenOffice (as of 2005) saved them.
(2) even when the font name is identified as Arial, the software is not falling through to substitute for it with Helvetica (a much nearer match than DejaVu sans).
(3) whatever font it is that it is defaulting to, the software seems to be losing all the positioning information.
But you're right, there are more productive places to raise this -- indeed I think it may even be one of the longer standing wished-for fixes on the MediaWiki open issues board. Jheald (talk) 00:49, 15 March 2010 (UTC)
Rsvg seems to have a problem here--"Monte Solaro" (above the red triangle) renders fine Firefox, but in Wikipedia's preview the letters are on top of each other ("Mone Soho"). Rsvg bug or SVG problem, or both? Morn (talk) 11:12, 2 April 2010 (UTC)
For the time being, I've made a PNG version and used that instead. The Rsvg version really looks a bit crappy in general, particularly the font aliasing, compared to what Firefox or Inkscape produce... Morn (talk) 15:58, 2 April 2010 (UTC)
I looked at it, and played around with it in a text editor to no avail. I then played around with it in inkscape and managed to make it look OK, so it is fixed, but unfortunately I am not sure why, as inkscape changed the file a lot in between. User A1 (talk) 18:15, 2 April 2010 (UTC)
Thanks A1! I think the font for "Monte Solaro" still looks a little smaller/different from the rest though. Maybe because I made the map at a larger size and then scaled it all down, perhaps a rounding error related to font sizes? Anyway, I think I'll keep the PNG in the articles, it's a bit easier to read IMHO. Hopefully one day Wikipedia will use Batik for SVGs and all these little problems will go away. :-) Morn (talk) 19:48, 2 April 2010 (UTC)
Rsvg shows a black horizontal line at the top of the image (left corner) that shouldn't be there (and isn't in Inkscape or Firefox). Morn (talk) 20:07, 2 April 2010 (UTC)
I'll upload the fixed version now. again, librsvg is at fault, and shouldn't be rendering this according to the spec. User A1 (talk) 11:51, 3 April 2010 (UTC)
Aha, thanks! It's strange that Inkscape put that rect in there, and it's also strange that you couldn't select it in Inkscape and delete it. Is there a page for rsvg bug reports where I can report this or doesn't anybody bother with trying to fix rsvg anymore? :-) Morn (talk) 16:59, 3 April 2010 (UTC)
Fair use images probably shouldn't be in SVG format, not being "low resolution". To convert that image to SVG you would be best to redraw it manually using inkscape. There are many tutorials on how to use inkscape available on the 'net, such as this one. Whilst an automatic tracer built into inkscape will work, the output will almost be guaranteed to be of poor quality (lots of needless nodes, poor approximation to path, etc, etc). User A1 (talk) 09:18, 1 May 2010 (UTC)
Step 1, drag and drop the image you want to draw over into the inkscape window. Step 2, use the controls at the left (like line, circle, box, text) to draw on top of it. You may want a bit of practice, as this will demand artistic skills. Try working through the tutorial I mentioned, or this one here Wikipedia:How to draw a diagram with Inkscape. It is a bit hard to describe over a wiki. User A1 (talk) 16:35, 1 May 2010 (UTC)
Resolved
SVG after uploading to Commons
SVG as seen on my computer
Stale
Unresolved
_Bridge.svg:_text_subscript){kind=link}
_Bridge.svg){kind=link}
_Bridge.svg:_text_subscript){kind=link}
_map.svg){kind=link}
![[2]](https://en.wikipedia.org/wiki/File:Theoretical_computer_science.svg){kind=link}
