| << Chapter < Page | Chapter >> Page > |
Drawing the polygon (or the polyline)
Getting back to the Java code in Listing 11 , you can insert any number (two or more) of x-y coordinate-pairs inside the curly brackets (but you must insert them in pairs) . Line segments will be drawn from the first coordinate location to the second, from the second tothe third, and so on. (Of course there need to be two or more coordinate pairs in order for things to make sense.)
If you examine the coordinate values shown in Listing 11 , you will see that they define the vertices of a triangle whose base is parallel to thehorizontal axis. Since this is a polygon, it will be drawn as a closed triangle with lines for all three sides. If it were a polyline, it would not be drawn asa closed triangle. Instead, only two lines would be drawn and the third side of the triangle would be open.
SVG code to draw a polygon
Listing 12 shows the SVG code produced by the Java code in Listing 11 .
| Listing 12 . SVG code to draw a polygon. |
|---|
<polygon stroke="black" stroke-width="1" fill="none"
points="675 675 855 675 765 540 "><title>polygon</title></polygon> |
The attribute named points
The polygon element in Listing 12 contains a new attribute name that you haven't seen before: points .
As you have probably figured out by now, the value of the attribute named points is aseries of numeric values, separated by spaces, that represent the x-y coordinate pairs in Listing 11 , converted from inches to SVG units.
Hopefully by now you are beginning to see patterns that relate the Java code to the resulting SVG code.
The drawing in Figure 2 shows a pulley connected to the rightmost end of the table. The drawing of the pulley consists of a rectangle as the support memberand a circle as the pulley wheel. The Java code to draw the pulley support is shown in Listing 13 .
| Listing 13 . Draw the rectangular pulley support. |
|---|
//Draw pulley support
Element pullySupport = SvgLib21.makeRect(svg,ns,
"rectangle",7.883,
3.595,0.392,
1.06); |
The Java code in Listing 13 simply draws another rectangle, so it shouldn't need further explanation.
The Java code in Listing 14 draws a circle to serve as the pulley wheel in the drawing.
| Listing 14 . Draw a circle. |
|---|
//Draw the pulley wheel.
Element pulleyWheel = SvgLib21.makeCircle(svg,
ns,"circle",
8.05, //x-coordinate of center of circle4.56, //y-coordinate of center of circle
0.45 //radius of circle); |
What are you allowed to change?
There are only four things that you are allowed to change in the code in Listing 14 :
You will need to examine the coordinate values for the center of the circle along with the radius of the circle and imagine how the position and size of thecircle relates to the right end of the table top in Figure 2 . (Or hopefully, get a tactile version of the drawing and explore it by touch.)
Notification Switch
Would you like to follow the 'Accessible physics concepts for blind students' conversation and receive update notifications?
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|