Submissions/SVG and Text Editor

From Wikimania 2013 • Hong Kong

After careful consideration, the programme committee has decided not to accept the below submission at this time. Thank you to the author(s) for participating in the Wikimania 2013 programme submission, we hope to still see you at Wikimania this August.

Submission no.
5018
Subject no.
T1 or W2


Title of the submission
Drawing SVG with Text Editor
Type of submission
Presentation
Author of the submission
Terence Yuen
Country of origin
Hong Kong
Affiliation
Wikimedia Hong Kong Chapter
E-mail address
wrightbus@gmail.com
Username
User:Wrightbus
Personal homepage or blog
(None)
Abstract

SVG is one of vector graphic file format available for webpages, and is the recommended format of uploading logos, national or municipal flags to Wikimedia Projects. Inkscape is the most popular free software of creating SVG graphics. But I think complicated code like floating numbers generated by software is not necessary for graphic which is not complicated and can be done perfectly with only a text editor.

Detailed proposal

I used text editor to draw municipal logos and symbols of Hong Kong and Japan according to specifications. Since these logos usually contain only geometric shapes like polygons, circles, lines or arcs, many of them can be drawn perfectly with simple codes and integers. So I would like to share my experience of creating SVG logos.

Moreover, I experienced that glitches have been appeared in one of my work by using built-in renderer. So I would like to share my ways of preventing glitches as well.

Partial list of my drawings can be found at commons:User:Wrightbus/SVG Works.

The structure of my presentation will be as follows.

  • Translation and Rotation - One of my criteria of drawing SVG logos is to avoid using floating point numbers if possible. To translate an element horizontally or vertically to distance containing irrational factor like square root of 2 or 3, it can be done by using sine theorem in mathematics. I would like to demonstrate how it works by using my works as examples.
  • Glitch Prevention - In one of my SVG drawing, the code is rendered fine in web browsers, but glitches appeared in rasterized image after uploading to Wikimedia projects. Actually there are unknown errors inside the built-in SVG to PNG renderer of MediaWiki system. This example will be demonstrated to rectify the issue.
  • Validation - Like HTML documents, a valid SVG document is not only a source code which can be rendered in web browsers, but also no errors or warnings to be appeared if checked through W3C online validator. I have seen that there are many SVG documents uploaded in Wikimedia Projects have warnings by using the validator to check. So I would like to state the causes of warnings in these files and ways to rectify these issues.
Track
  • Technology and Infrastructure
Length of presentation/talk
15 Minutes
Language of presentation/talk
English (Cantonese could be added as subsidiary if there were more participants from HK)
Will you attend Wikimania if your submission is not accepted?
Yes
Slides or further information (optional)

To be created

Special requests


Interested attendees

If you are interested in attending this session, please sign with your username below. This will help reviewers to decide which sessions are of high interest. Sign with four tildes. (~~~~).

  1. YES! If you don't get to give the talk, I'd like to meet you in HK. Slashme (talk) 18:25, 7 April 2013 (UTC)[reply]
  2. +1000! I'll definitely be there if this one makes the cut. Also, what Slashme said. We could make a meeting of SVG handwriters :D --Waldir (talk) 00:25, 8 April 2013 (UTC)[reply]
  3. Daniel Mietchen (talk) 22:09, 22 April 2013 (UTC)[reply]
  4. --Nirakka (talk) 09:10, 7 May 2013 (UTC)[reply]
  5. Add your username here.