[cairo-commit] [cairo-www] src/tutorial.mdwn

Chris Wilson ickle at freedesktop.org
Tue Oct 21 07:12:56 PDT 2008


 src/tutorial.mdwn |   70 +++++++++++++++++++++++++++---------------------------
 1 file changed, 35 insertions(+), 35 deletions(-)

New commits:
commit 22ceb31845670c299a4245d6c7de58abc08c4c3e
Author: Chris Wilson <chris at chris-wilson.co.uk>
Date:   Tue Oct 21 15:12:35 2008 +0100

    [tutorial] Fixup broken links.

diff --git a/src/tutorial.mdwn b/src/tutorial.mdwn
index d76981d..c808ce3 100644
--- a/src/tutorial.mdwn
+++ b/src/tutorial.mdwn
@@ -76,7 +76,7 @@ isn't shown.
 <div class="tutright"><img src="destination.png" alt="" /></div>
 
 The destination is the
-[surface](http://www.cairographics.org/manual/Surfaces.html) on which
+[surface](http://www.cairographics.org/manual/cairo-surfaces.html) on which
 you're drawing. It may be tied to an array of pixels like in this
 tutorial, or it might be tied to a SVG or PDF file, or something else.
 This surface collects the elements of your graphic as you apply them,
@@ -90,9 +90,9 @@ The source is the "paint" you're about to work with. I show this as it
 is&mdash;plain black for several examples&mdash;but translucent to show
 lower layers.  Unlike real paint, it doesn't have to be a single color;
 it can be a
-[pattern](http://www.cairographics.org/manual/cairo-Patterns.html) or
+[pattern](http://www.cairographics.org/manual/cairo-pattern.html) or
 even a previously created destination
-[surface](http://www.cairographics.org/manual/Surfaces.html). Also
+[surface](http://www.cairographics.org/manual/cairo-surfaces.html). Also
 unlike real paint it can contain transparency information&mdash;the
 Alpha channel.
 
@@ -135,7 +135,7 @@ PNG file.  There is also a data type for the surface, called
 The cairo context in this example is tied to an image surface of
 dimension 120&nbsp;x&nbsp;120 and 32 bits per pixel to store RGB and Alpha
 information. Surfaces can be created specific to most cairo backends,
-see the [manual](http://cairographics.org/manual/Surfaces.html) for details.
+see the [manual](http://cairographics.org/manual/cairo-surfaces.html) for details.
 
 <h2 id="L2verbs">Verbs</h2>
 
@@ -191,10 +191,10 @@ the edge of the path and no further.
 alt="" /></a></div>
 
 The
-[`cairo_show_text()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-show-text)
+[`cairo_show_text()`](http://www.cairographics.org/manual/cairo-text.html#cairo-show-text)
 operation forms the mask from text. It may be easier to think of
 `cairo_show_text()` as a shortcut for creating a path with
-[`cairo_text_path()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-text-path)
+[`cairo_text_path()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-text-path)
 and then using
 [`cairo_fill()`](http://www.cairographics.org/manual/cairo-context.html#cairo-fill)
 to transfer it. Be aware `cairo_show_text()` caches glyphs so is much
@@ -310,22 +310,22 @@ src="setsourcergba.png" alt="" /></a></div>
 
 Gradients describe a progression of colors by setting a start and stop
 reference location and a series of "stops" along the way. [Linear
-gradients](http://www.cairographics.org/manual/cairo-Patterns.html#cairo-pattern-create-linear)
+gradients](http://www.cairographics.org/manual/cairo-pattern.html#cairo-pattern-create-linear)
 are built from two points which pass through parallel lines to define
 the start and stop locations. [Radial
-gradients](http://www.cairographics.org/manual/cairo-Patterns.html#cairo-pattern-create-radial)
+gradients](http://www.cairographics.org/manual/cairo-pattern.html#cairo-pattern-create-radial)
 are also built from two points, but each has an associated radius of the
 circle on which to define the start and stop locations. Stops are added
 to the gradient with
-[`cairo_add_color_stop_rgb()`](http://www.cairographics.org/manual/cairo-Patterns.html#cairo-pattern-add-color-stop-rgb)
+[`cairo_add_color_stop_rgb()`](http://www.cairographics.org/manual/cairo-pattern.html#cairo-pattern-add-color-stop-rgb)
 and
-[`cairo_add_color_stop_rgba()`](http://www.cairographics.org/manual/cairo-Patterns.html#cairo-pattern-add-color-stop-rgba)
+[`cairo_add_color_stop_rgba()`](http://www.cairographics.org/manual/cairo-pattern.html#cairo-pattern-add-color-stop-rgba)
 which take a color like `cairo_set_source_rgb*()`, as well as an offset
 to indicate where it lies between the reference locations. The colors
 between adjacent stops are averaged over space to form a smooth blend.
 Finally, the behavior beyond the reference locations can be controlled
 with
-[`cairo_set_extend()`](http://www.cairographics.org/manual/cairo-Patterns.html#cairo-pattern-set-extend).
+[`cairo_set_extend()`](http://www.cairographics.org/manual/cairo-pattern.html#cairo-pattern-set-extend).
 
 <div class="tutright"><a href="setsourcegradient.c"><img
 src="setsourcegradient.png" alt="" /></a></div>
@@ -407,10 +407,10 @@ Cairo uses a connect-the-dots style system when creating paths.  Start
 at 1, draw a line to 2, then 3, and so forth. When you start a path, or
 when you need to start a new sub-path, you want it to be like point 1:
 it has nothing connecting to it. For this, use
-[`cairo_move_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-move-to).
+[`cairo_move_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-move-to).
 This sets the current reference point without making the path connect
 the previous point to it. There is also a relative coordinate variant,
-[`cairo_rel_move_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-rel-move-to),
+[`cairo_rel_move_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-rel-move-to),
 which sets the new reference a specified distance away from the current
 reference instead. After setting your first reference point, use the
 other path operations which both update the reference point and connect
@@ -423,10 +423,10 @@ to it in some way.
 <div class="tutright"><img src="path-lineto.png" alt="" /></div>
 
 Whether with absolute coordinates
-[`cairo_line_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-line-to)
+[`cairo_line_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-line-to)
 (extend the path from the reference to this point), or relative
 coordinates
-[`cairo_rel_line_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-rel-line-to)
+[`cairo_rel_line_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-rel-line-to)
 (extend the path from the reference this far in this direction), the
 path connection will be a straight line. The new reference point will be
 at the other end of the line.
@@ -443,9 +443,9 @@ point you directly specify is not on the path. Instead it is the center
 of the circle that makes up the addition to the path. Both a starting
 and ending point on the circle must be specified, and these points are
 connected either clockwise by
-[`cairo_arc()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-arc)
+[`cairo_arc()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-arc)
 or counter-clockwise by
-[`cairo_arc_negative()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-arc-negative).
+[`cairo_arc_negative()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-arc-negative).
 If the previous reference point is not on this new curve, a straight
 line is added from it to where the arc begins. The reference point is
 then updated to where the arc ends. There are only absolute versions.
@@ -460,9 +460,9 @@ Curves in cairo are cubic Bézier splines. They start at the current
 reference point and smoothly follow the direction of two other points
 (without going through them) to get to a third specified point. Like
 lines, there are both absolute
-([`cairo_curve_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-curve-to))
+([`cairo_curve_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-curve-to))
 and relative
-([`cairo_rel_curve_to()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-rel-curve-to))
+([`cairo_rel_curve_to()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-rel-curve-to))
 versions. Note that the relative variant specifies all points relative
 to the previous reference point, rather than each relative to the
 preceding control point of the curve.
@@ -486,7 +486,7 @@ caps for there is no place to put them.
 <h3 id="L3text">Text</h3>
 
 Finally text can be turned into a path with
-[`cairo_text_path()`](http://www.cairographics.org/manual/cairo-Paths.html#cairo-text-path).
+[`cairo_text_path()`](http://www.cairographics.org/manual/cairo-paths.html#cairo-text-path).
 Paths created from text are like any other path, supporting stroke or
 fill operations. This path is placed anchored to the current reference
 point, so <a href="#L3moving">`cairo_move_to()`</a> your desired
@@ -503,9 +503,9 @@ href="#L3fill">`cairo_fill()`</a>.
 alt="" /></a></div>
 
 To use text effectively you need to know where it will go. The methods
-[`cairo_font_extents()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-font-extents)
+[`cairo_font_extents()`](http://www.cairographics.org/manual/cairo-text.html#cairo-font-extents)
 and
-[`cairo_text_extents()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-text-extents)
+[`cairo_text_extents()`](http://www.cairographics.org/manual/cairo-text.html#cairo-text-extents)
 get you this information. Since this diagram is hard to see so small, I
 suggest getting its [[source|textextents.c]] and bump the size up to 600. It shows the
 relation between the reference point (red dot); suggested next reference
@@ -532,15 +532,15 @@ width would suggest.
 
 In addition to placement, you also need to specify a face, style, and
 size. Set the face and style together with
-[`cairo_select_font_face()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-select-font-face),
+[`cairo_select_font_face()`](http://www.cairographics.org/manual/cairo-text.html#cairo-select-font-face),
 and the size with
-[`cairo_set_font_size()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-set-font-size).
+[`cairo_set_font_size()`](http://www.cairographics.org/manual/cairo-text.html#cairo-set-font-size).
 If you need even finer control, try getting a
-[`cairo_font_options_t`](http://www.cairographics.org/manual/cairo-Font-Options.html#cairo-font-options-t)
+[`cairo_font_options_t`](http://www.cairographics.org/manual/cairo-font-options.html#cairo-font-options-t)
 with
-[`cairo_get_font_options()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-get-font-options),
+[`cairo_get_font_options()`](http://www.cairographics.org/manual/cairo-text.html#cairo-get-font-options),
 tweaking it, and setting it with
-[`cairo_set_font_options()`](http://www.cairographics.org/manual/cairo-Text.html#cairo-set-font-options).
+[`cairo_set_font_options()`](http://www.cairographics.org/manual/cairo-text.html#cairo-set-font-options).
 
 <h1 id="L1transforms">Working with Transforms</h1>
 
@@ -554,28 +554,28 @@ relation between two coordinate systems. The device-space coordinate
 system is tied to the surface, and cannot change. The user-space
 coordinate system matches that space by default, but can be changed for
 the above reasons. The helper functions
-[`cairo_user_to_device()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-user-to-device)
+[`cairo_user_to_device()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-user-to-device)
 and
-[`cairo_user_to_device_distance()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-user-to-device-distance)
+[`cairo_user_to_device_distance()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-user-to-device-distance)
 tell you what the device-coordinates are for a user-coordinates position
 or distance.  Correspondingly
-[`cairo_device_to_user()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-device-to-user)
+[`cairo_device_to_user()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-device-to-user)
 and
-[`cairo_device_to_user_distance()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-device-to-user-distance)
+[`cairo_device_to_user_distance()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-device-to-user-distance)
 tell you user-coordinates for a device-coordinates position or distance.
 Remember to send positions through the non-distance variant, and
 relative moves or other distances through the distance variant.
 
 I leverage all of these reasons to draw the diagrams in this document.
 Whether I'm drawing 120&nbsp;x&nbsp;120 or 600&nbsp;x&nbsp;600, I use
-[`cairo_scale()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-scale)
+[`cairo_scale()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-scale)
 to give me a 1.0&nbsp;x&nbsp;1.0 workspace. To place the results along
 the right column, such as in the discussion of <a
 href="#L1drawingmodel">cairo's drawing model</a>, I use
-[`cairo_translate()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-translate).
+[`cairo_translate()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-translate).
 And to add the perspective view for the overlapping layers, I set up an
 arbitrary deformation with
-[`cairo_transform()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-transform)
+[`cairo_transform()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-transform)
 on a
 [`cairo_matrix_t`](http://www.cairographics.org/manual/cairo-matrix.html#cairo-matrix-t).
 
@@ -598,7 +598,7 @@ set your line width while the scale factor was 1, the line width setting
 is always in user-coordinates and isn't modified by setting the scale.
 While you're operating under a scale, the width of your line is
 multiplied by that scale. To specify a width of a line in pixels, use
-[`cairo_device_to_user_distance()`](http://www.cairographics.org/manual/cairo-Transformations.html#cairo-device-to-user-distance)
+[`cairo_device_to_user_distance()`](http://www.cairographics.org/manual/cairo-transformations.html#cairo-device-to-user-distance)
 to turn a `(1, 1)` device-space distance into, for example, a `(0.01,
 0.01)` user-space distance. Note that if your transform deforms the
 image there isn't necessarily a way to specify a line with a uniform


More information about the cairo-commit mailing list