Tuesday, April 05, 2011

Instructions for SVG mods


Modifying svg image: Nearby Stars.
Each object represents a star with following elements:
  • text
  • path
  • one or more eclipses (multiple eclipses represent stellar systems with multiple stars).




Text

  • id="text7939"
  • font-size="20px"
  • y="420.75485"
  • x="251.64108"
  • style=
    • font-size:20px
    • fill:#ff0000
    • font-family:DejaVu Sans
Alpha Centauri




Path Actions
!-- start marker for path
******************************************************************************************************************************
******************************************************************************************************************************
stop --

(path style="fill:none;fill-opacity:1;stroke:#a40000;stroke-width:0.5;stroke-linecap:butt;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffs et:0;stroke-opacity:1;display:inline" d="M 377.24363,314.02758 L 377.24363,325.08957 L 303.86863,296.71458" id="path5538" / )
Find relevant "path" element and change:
  • color from near red (stroke:#a40000) to near green (stroke:#a4ff00).
  • width from narrow (stroke-width: 0.5) to less narrow (stroke-width: 2.5).
 Go to *.svg image and look for one star's path different color from others.

(path name="61 Cygni"
style="fill:none;fill-opacity:1;stroke:#a40000;stroke-width:0.5;stroke-linecap:butt;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;display:inline" d="M 474.93163,132.58958 L 474.93163,295.02758 L 303.86863,296.71458" id="path5552" /)
  1. fill:none
  2. fill-opacity:1
  3. stroke:#a40000
  4. stroke-width:0.5
  5. stroke-linecap:butt
  6. stroke-miterlimit:4
  7. stroke-dasharray:none
  8. stroke-dashoffset:0
  9. stroke-opacity:1
  10. display:inline"
d="M 474.93163,132.58958 L 474.93163,295.02758 L 303.86863,296.71458"


Eclipse actions:
!-- start marker for path
******************************************************************************************************************************
******************************************************************************************************************************
stop --
("ellipse .................... id="ellipse7862" rx="1.5" ry="1.5")
(ellipse .................... id="ellipse7862" rx="15" ry="15")
then inspect for much greater image.

then change back to original size and insert new attribute, name, as shown:
(ellipse ...............name="starName" id="ellipse7862" rx="1.5" ry="1.5")

ellipse

  • id="ellipse7854"
  • ry="1.5"
  • rx="1.5"
  • cy="529.25"
  •  cx="674.93799"
  • sodipodi:cx="674.93799"
  • sodipodi:cy="529.25"
  • sodipodi:rx="1.5"
  • sodipodi:ry="1.5"
  • style="fill:#f57900"
  • style="stroke:none"
  • transform="translate(-270.17782,-216.20096)"




Grouping with element "g" with name attribute.

Add OCT-? to above name attribute where ? can be 1 thru 8.

To observe effect of code change on image, save *.svg as "any file".
Be sure to change back with code change reversed, but keep name attribute.
NOTE: you don't want to save file as *.txt file, you want to replace current *.svg file with new code; thus, you should see a warning box alerting you to this.

Reference CLIP ART site.

0 Comments:

Post a Comment

<< Home