From 0f9c0ebb2f9f0a7bebd91fdbc10583526c1fa682 Mon Sep 17 00:00:00 2001 From: David Storey Date: Wed, 9 May 2018 16:29:58 -0700 Subject: [PATCH 1/4] Remove Mesh gradients --- master/coords.html | 12 - master/definitions.xml | 66 +-- master/linking.html | 6 +- master/painting.html | 2 +- master/pservers.html | 1162 +--------------------------------------- master/render.html | 3 - master/shapes.html | 133 +---- master/struct.html | 22 - master/styling.html | 2 +- 9 files changed, 18 insertions(+), 1390 deletions(-) diff --git a/master/coords.html b/master/coords.html index 9ba23b9f..d9e9d0ac 100644 --- a/master/coords.html +++ b/master/coords.html @@ -1138,18 +1138,6 @@

Object bounding box units

gradient is applied. - - - 'meshgradient' - 'gradientUnits' - Indicates that the attributes which specify the paint server - mesh starting point ('x', 'y') represent - fractions or percentages and that mesh path data represents - fractions of the bounding box of the element to which the mesh - is applied. If the mesh is rendered inside a 'mesh' element - the current SVG viewport is used in place of a bounding box. - - 'pattern' diff --git a/master/definitions.xml b/master/definitions.xml index 5cc88b50..158d27a4 100644 --- a/master/definitions.xml +++ b/master/definitions.xml @@ -228,54 +228,6 @@ - - Any number of animation elements, descriptive elements, 'mask element', 'clipPath', 'marker element', 'script', and 'style element' elements, along with zero or one 'meshgradient' element. - - - - - - - - - - - - - - Any number of descriptive elements, 'script' and from two to four 'stop' elements. - - - - - - - - - - + + + + + - - + + @@ -961,7 +913,6 @@ - @@ -971,9 +922,6 @@ - - - diff --git a/master/linking.html b/master/linking.html index 4c33b141..24b6631b 100644 --- a/master/linking.html +++ b/master/linking.html @@ -259,7 +259,7 @@

Deprecated XLink URL reference attributes

Animatable - xlink:href + xlink:href URL [URL] (none) (see below) @@ -295,7 +295,7 @@

Deprecated XLink URL reference attributes

Animatable - xlink:title + xlink:title <anything> (none) no @@ -664,8 +664,6 @@

Valid URL targets

  • the 'hatch' element must reference another 'hatch' element
  • the 'image' element must reference a document that can be processed as an image
  • the 'linearGradient' element must reference a different 'linearGradient' or 'radialGradient' element
    • -
  • the 'meshgradient' element must reference a different 'meshgradient' element
    • -
  • the 'mesh' element must reference a 'meshgradient' element
  • the 'pattern' element must reference another 'pattern' element
  • the 'radialGradient' element must reference a 'linearGradient' or another 'radialGradient' element
  • the 'script' element must reference an external document that provides the script content
    • diff --git a/master/painting.html b/master/painting.html index 1f772a01..d6fb04b0 100644 --- a/master/painting.html +++ b/master/painting.html @@ -45,7 +45,7 @@

    Definitions

    • a single color,
      • -
    • a gradient (linear, radial, or mesh),
      • +
    • a gradient (linear or radial)
    • a pattern (vector or raster, possibly tiled),
    • a hatch,
    • other images as specified using CSS Image Value syntax [css3-images].
      • diff --git a/master/pservers.html b/master/pservers.html index ac935b3f..3b47d857 100644 --- a/master/pservers.html +++ b/master/pservers.html @@ -334,8 +334,7 @@

      Gradients

      Once a gradient is defined, a graphics element can be @@ -425,12 +424,6 @@

      Gradients

      applied to the gradient.

      -

      Color transitions for mesh gradients are defined by an array of -color stops. The mapping of colors to -the drawing surface in this case is done by geometric data located -in the stops. This is discussed in detail in the -mesh gradients section.

      -

      Definitions

      @@ -1227,1087 +1220,13 @@

      Notes on radial gradients

      -

      Mesh gradients

      - - - -

      Mesh gradients are defined by a -'meshgradient' element.

      - -
      - - - - - - - - - - - - - - - - - -
      SVG 2 Requirement:Support photorealistic gradients.
      Resolution:Mesh gradients are accepted by the WG for SVG 2.
      Purpose:To allow more complex gradients such as those found in nature.
      Owner:Tav (ACTION-3121)
      -
      - -
      -

      Resolution: Rename stop-path to 'd' or 'path' (Coons patch syntax).

      -

      Seattle 2011 F2F day 3

      -
      - -
      -

      Resolution: We will allow just C/c/L/l in mesh path data. We will leave out tensor control points. - We will not allow multiple colors at mesh intersections, just use zero size patches instead.

      -

      Boston 2011 F2F

      -
      - -
      -

      Resolution: We will have a type="smooth-bicubic" or similar on <mesh>. (Note: In the resolution, the attribute is incorrectly placed on <patch>; see the minutes.)

      -

      Sydney 2015 F2F

      -
      - -

      - New in SVG 2. Added to allow complex shadings. This is needed, for - example, in creating life-like drawings or in interpolating data - points on a two-dimensional grid. -

      - -

      - The mesh gradients in SVG are based on an array of Coons Patches. A - Coons Patch is a shading defined by colors place at the corners of - an area enclosed by four Bézier curves. The interpolation of the - corner colors into the patch can either be bilinear or bicubic. -

      - -
      - Image of single mesh patch. - -

      A single Coons-Mesh patch.

      -
      - -

      - A Coons Patch is equivalent to a bi-cubic Ferguson patch where the - distance between a cubic Bézier end point and its nearest control - point is one-third the length of the corresponding Ferguson tangent - line. -

      - -

      Mesh Structure

      - -

      - A mesh gradient consists of patches placed in an array. There - are two reasons for using an array. The first is that an array of - meshes is a natural result for most content creation processes - (start with a path and then subdivide its area into rows and - columns of patches). The second is that the data can be compacted - by sharing sides and corners. The array structure is conceptual - only. The actual mesh can be distorted in any way possible. The - mesh gradient syntax is designed so that it is easy to simulate - other types of gradients such as conical gradients or triangle - meshes as shown in the examples below. -

      - -

      - The structure of a mesh gradient: -

      - -
      -
      -<mesh x="100" y="100">
-  <meshrow>
-    <meshpatch>
-      <stop .../>
-        Up to four stops in first patch. See details below.
-    </meshpatch>
-    <meshpatch>
-      Any number of meshpatches in row.
-    </meshpatch>
-  </meshrow>
-  <meshrow>
-    Any number of meshrows, each with the same number of meshpatches as in the first row.
-  </meshrow>
-</mesh>
-
      -
      - -

      - The first 'meshpatch' in the first 'meshrow' contains - four 'stop' elements. These elements correspond conceptually, - in order, to the top, right, bottom, and left edges of the first - patch. The following patches in the first row contains - three 'stop' elements, corresponding to the top, right, and - bottom edges of the patch. The left edge of one of these patches is - taken from the (reversed) right edge of the previous patch. The - first patch of following rows contains three 'stop' elements, - corresponding to the right, bottom, and left edges. The top edge is - taken from the (reversed) bottom edge of the first patch in the row - above. The remaining patches contain two 'stop' elements, - corresponding to the right and bottom edges of the patch. The top - edge is taken from the patch directly above in the array of patches - while the left edge is taken from the previous patch in the same - row. -

      -

      - Each 'stop' element contains a 'path' attribute - which consists of a single 'c', 'C', 'l', or 'L' path command. The - initial point for the path command is taken from the last point of - the previous edge of the patch (which for the first 'stop' in - a patch is defined in the patch to the left or top), except for the - first patch in the first row where the initial point is given by the - 'meshgradient/x' and 'meshgradient/y' attributes in - the 'meshgradient' - element. The path command in the last 'stop' element of - a 'meshpatch' has one less point than normal as this - "missing" point necessary to close the path is already defined. -

      -

      - For each 'stop' element there is a color and opacity - that correspond to the patch corner at the initial point of - the stop's edge. This color and opacity are defined inside - the 'stop' by the 'stop-color' - and 'stop-opacity' properties except for the first - stop in all patches other than the first patch in the first - row where the stop color and opacity are already defined by a - previous patch. -

      - -

      - Here is an annotated example of a two by two mesh gradient: -

      - -
      - 
      -<meshgradient x="50" y="50" id="example"> <!-- x, y used for initial point in first patch. -->
-  <meshrow> <!-- No attributes, used only to define begin/end of row. -->
-	<meshpatch>
-	  <stop path="c  25,-25  75, 25  100,0" stop-color="lightblue" />
-	  <stop path="c  25, 25 -25, 75  0,100" stop-color="purple" />
-	  <stop path="c -25, 25 -75,-25 -100,0" stop-color="red" />
-	  <stop path="c -25,-25, 25,-75"        stop-color="purple" /> <!-- Last point not needed (closed path). -->
-	</meshpatch>
-	<meshpatch>
-	  <stop path="c  25,-25  75, 25  100,0" /> <!-- stop-color from previous patch. -->
-	  <stop path="c  25, 25 -25, 75  0,100" stop-color="lightblue" />
-	  <stop path="c -25, 25 -75,-25"        stop-color="purple" /> <!-- Last point not needed (closed path). -->
-	  <!-- Last path (left side) taken from right side of previous path (with points reversed). -->
-	</meshpatch>
-  </meshrow>
-  <meshrow> <!-- New row. -->
-	<meshpatch>
-	  <!-- First path (top side) taken from bottom path of patch above. -->
-	  <stop path="c  25, 25 -25, 75  0,100" /> <!-- stop-color from patch above. -->
-	  <stop path="c -25, 25 -75,-25 -100,0" stop-color="purple" />
-	  <stop path="c -25,-25, 25,-75"        stop-color="lightblue" /> <!-- Last point not needed (closed path). -->
-	</meshpatch>
-	<meshpatch>
-	  <!-- First path (top side) taken from bottom path of patch above (with points reversed). -->
-	  <stop path="c  25, 25 -25, 75  0,100" /> <!-- stop-color from patch above. -->
-	  <stop path="c -25, 25 -75,-25"        stop-color="lightblue" /> <!-- Last point not needed (closed path). -->
-	  <!-- Last path (left side) taken from right side of previous path (with points reversed). -->
-	</meshpatch>
-  </meshrow>
-</meshgradient>
-
      -
      - -

      - The above mesh gradient is rendered as: -

      - -
      - Rendering of a two by two mesh. -

      - The rendering for the above two by two mesh example. The overlaid - paths show the order in which the patch edges are defined. -

      -
      - -

      - Coons patch meshes can simulate other types of gradients. Here is - an example of a conic gradient: -

      - -
      - Rendering of a one by four mesh where each mesh covers - a conic section. -

      - The rendering for a one row, four patch mesh that simulates - a conic gradient. The bottom edge of each patch is of zero - length. -

      -
      - -

      Painting a Mesh Patch

      - -

      - The corner colors are mapped to the patch area with a two step - process. First the colors are placed at the corners of a unit - square and the area inside the square is then colored using either - bilinear interpolation or bicubic interpolation. Second, the points - inside the square are mapped to points inside the patch using the - following formula: -

      - - - -
      - - S - = - - S - C - - + - - S - D - - − - - S - B - - - 
      -    $S = S_C + S_D - S_B$
-
      -
      - -

      where

      - -
      - - - - - - S - C - - ( - u - , - v - ) - - - - = - ( - 1 - − - v - ) - × - - C - 1 - - ( - u - ) - + - v - × - - C - 2 - - ( - u - ) - , - - - - - - S - D - - ( - u - , - v - ) - - - - = - ( - 1 - − - u - ) - × - - D - 1 - - ( - v - ) - + - u - × - - D - 2 - - ( - v - ) - , - - - - - - S - B - - ( - u - , - v - ) - - - - = - ( - 1 - − - v - ) - × - [ - ( - 1 - − - u - ) - × - - C - 1 - - ( - 0 - ) - + - u - × - - C - 1 - - ( - 1 - ) - ] - - - - - - - - - - - + - v - × - [ - ( - 1 - − - u - ) - × - - C - 2 - - ( - 0 - ) - + - u - × - - C - 2 - - ( - 1 - ) - ] - . - - - - - 
      -    $$
-    \begin{align}
-    S_C(u,v) &= (1-v)×C_1(u) + v×C_2(u),\\
-    S_D(u,v) &= (1-u)×D_1(v) + u×D_2(v),\\
-    S_B(u,v) &= (1-v)×[(1-u)×C_1(0) + u×C_1(1)]\\
-    &\qquad {}+  v×[(1-u)×C_2(0) + u×C_2(1)].
-    \end{align}
-    $$
-
      -
      - -

      - - C1 - , - - C2 - , - - D1 - , and - - D2 - - are the curves at the top, bottom, left, and right of the - patch, respectively; - - u - and - - v - are the coordinates inside the unit square. The subtraction - term ensures that the boundary conditions are met. -

      - -

      Come up with better explanation of the mapping with diagram.

      - -
      -

      One method of rendering a patch is to "divide and conquer." Check - if the four corner colors of the patch are the same within a - specified tolerance. If so, paint the patch with the average color - using the normal path filling routine. If not, divide the patch - into four smaller patches and repeat the color tolerance - check. Repeat the process as many times as necessary.

      - -

      Another way to render a patch is to first divide the patch - vertically or horizontally into a series of smaller patches that - are each less than one pixel high or wide. Then each resulting - patch can be rendered as a path.

      -
      - -

      - Bilinear interpolation of the corner colors depends only on the - values of the corner colors. The color profile along two opposite - edges is first computed and then corresponding points along those - edges are interpolated to fill in the interior. The color profile - across a patch boundary may not be smooth, leading to an optical - phenomena known as Mach banding. -

      -

      - Bicubic interpolation requires knowing not only the value of the - corner colors but also their derivatives. The derivatives are chosen - to ensure a smooth transition across patch boundaries and that there - are no color value minima or maxima in the patch interior - (i.e. a monotone cubic interpolation). Only the derivatives in - x and y (where the x and y are the - directions along the rows and columns of the conceptual mesh grid) - are used (the cross derivatives are set to zero). -

      - -

      - To calculate the derivatives: - Let - - ck be - the color value at the point - - pk, - where - - k=0, ... ,n. -

      -
        -
      1. - First compute the secant lines: -
        - - - Δ - k - - = - - - - - c - - k - + - 1 - - - − - - c - k - - - - ∣ - - p - - k - + - 1 - - - − - - p - k - - ∣ - - - - - 
        -	\Delta_k = {{c_{k+1}-c_k}\over{\lvert p_{k+1}-p_k\rvert}}
-
        -
        - If - - pk - = - pk+1 - , set - - - Δ - k - - = - 0 - . -
        2. -
      2. - The provisional derivative at - - pk is then -
        - - - δ - k - - = - - - - - Δ - - k - − - 1 - - - + - - Δ - k - - - 2 - - - - 
        -	$ \delta_k = {\Delta_{k-1} + \Delta_k\over 2}  $
-
        -
        - for - - k=1, ... , - n−1. - The derivatives for - - k=0 and - - k=n are calculated later (see below). -
        3. -
      3. - If - - - Δ - - k - − - 1 - - - - and - - - Δ - k - - - are of opposite sign then set - - - δ - k - - = - 0 - . (This is a local minima or maxima.) Skip the remaining steps. -
        4. -
      4. - If - - ∣ - - δ - k - - ∣ - > - ∣ - 3 - × - - Δ - - k - − - 1 - - - ∣ - - then set - - - δ - k - - = - 3 - × - - Δ - - k - − - 1 - - - . - This step and the following step ensure that the interpolation is - monotonic. -
        5. -
      5. - If - - ∣ - - δ - k - - ∣ - > - ∣ - 3 - × - - Δ - k - - ∣ - - then set - - - δ - k - - = - 3 - × - - Δ - k - - . -
        6. -
      6. - Find the end point derivatives: - If - n>2 - then: -
        - - - δ - 0 - - = - 2 - × - - Δ - 0 - - − - - δ - 1 - - - 
        -	$ \delta_1 = 2\times\Delta_1 - \delta_2  $
-
        -
        -
        - - - δ - n - - = - 2 - × - - Δ - - n - − - 1 - - - − - - δ - - n - − - 1 - - - - 
        -	$ \delta_n = 2\times\Delta_{n-1} - \delta_{n-1}  $
-
        -
        - else - - - δ - 1 - - = - - δ - n - - = - - Δ - 0 - - . -
        7. -
      - -

      - The typical method for dealing with the start or end of a bicubic - interpolation is to add an extra point before and an extra point - after the given points. The value of the point before (after) is - assigned either the value of the first (last) point or a value so - that the secant before (after) is the same as the secant after - (before) the first (last) point. The method described here does not - rely on the addition of points but instead fits a quadratic curve - to the color values and the already determined derivative at the - other edge of the patch. This produces an interpolation that does - not have an inflection point inside the patch. -

      -

      - Bicubic interpolation will produce smooth patch boundaries when a - mesh is laid out on a rectangular grid and where the patch edges are - linear. If the grid is distorted or the patch edges are not lines - (i.e. they are Bézier curves), it is still possible to produce - non-smooth transitions across patch boundaries. -

      - -

      Mesh gradients are defined by a 'meshgradient' -element.

      - -

      - Note that in case-sensitive contexts (XML parsing and scripting), - the name of the element is all lowercase, - unlike the older elements 'linearGradient' and 'radialGradient'. -

      - -

      - The capitalization of 'meshgradient' posed a conflict of priorities. - While inconsistency with the older elements is unfortunate, - mixed-case names require special treatment in HTML contexts. - Feedback from implementers and authors on the practicality of - mixed-case versus all-lowercase names is welcomed during the implementation period. -

      - - - -

      Attributes

      - -

      - Note that the 'x' and 'y' attributes - on a 'meshgradient' are not presentation attributes; - the used value is not affected by CSS styles. - The 'transform' attribute is a presentation attribute. -

      - -
      - -
      gradientUnits
      -
      -

      - Defines the coordinate system for attributes 'x' and - 'y'. -

      - -
      - -
      Value
      userSpaceOnUse | objectBoundingBox
      -
      Initial value
      objectBoundingBox
      -
      Animatable
      yes
      - -
      - -
      - -
      userSpaceOnUse
      -
      -

      - If gradientUnits="userSpaceOnUse", - - 'x' and 'y' - - represent values in the coordinate system that results - from taking the current user coordinate system in place at - the time when the gradient element is referenced (i.e., - the user coordinate system for the element referencing the - gradient element via a 'fill' or 'stroke' - property) or when the mesh is rendered on its own - (i.e. not as a paint server) and then applying the - transform specified by attribute - 'transform'. Percentages represent values - relative to the current SVG viewport. -

      -
      - -
      objectBoundingBox
      -
      -

      - Path data to be interpreted as fraction of bounding box - (between 0 and 1) agreed to during the - 16 - July 2015 Weekly Teleconference. -

      - -

      - If gradientUnits="objectBoundingBox", - the user coordinate system for attributes - 'x' and 'y', and for mesh path data - is established using the bounding box of the element to - which the gradient is applied - (see Object - bounding box units) and then applying the transform - specified by attribute 'transform'. - - For the 'x' and 'y' attributes, percentages - represent values relative to the bounding box for the - object. For mesh path data, coordinates represent - fractions of the bounding box. -

      -

      - When a mesh is rendered on its own (i.e., not as a paint - server) the current SVG viewport is used in place of the - bounding box. -

      -
      - -
      -
      - -
      - transform -
      -
      - -

      - Contains the definition of an optional additional - transformation from the mesh coordinate system onto the - target coordinate system - - (i.e., 'userSpaceOnUse'). - - This allows for things such as skewing the gradient. - - This additional transformation matrix is post-multiplied to - (i.e., inserted to the right of) any previously defined - transformations. -

      - -
      -
      Value
      <transform-list>
      -
      Initial value
      identity transform
      -
      Animatable
      yes
      -
      - -
      - -
      x
      -
      - -

      - 'x' and 'y' define the starting point - of the mesh grid. -

      - -
      -
      Value
      <length>
      -
      Initial value
      0%
      -
      Animatable
      yes
      -
      - -
      - -
      y
      -
      - -

      - See 'x'. -

      - -
      -
      Value
      <length>
      -
      Initial value
      0%
      -
      Animatable
      yes
      -
      - -
      - -
      - href -
      -
      -

      - A URL reference to a template element, - which must be a different 'meshgradient' element to be valid. -

      -

      - Refer to the process for using paint servers as templates, - and to the common handling defined for URL reference attributes and - deprecated XLink attributes. -

      -

      - The specified attributes that will be copied from the template are: -

      - - -
      -
      Value
      URL [URL]
      -
      Initial value
      empty
      -
      Animatable
      yes
      -
      - -
      - -
      - type -
      -
      -

      - Determines the type of interpolation to use when painting - a patch. -

      - -
      -
      Value
      bilinear | bicubic
      -
      Initial value
      bilinear
      -
      Animatable
      no
      -
      -
      -
      - -       - - - -

      Mesh rows are defined by a 'meshrow' element.

      - - - -       - - - -

      Mesh patches are defined by a 'meshpatch' -element.

      - - - -       -

      Gradient stops

      -

      The vector (linear and radial gradients) -or array (mesh gradients) of colors to use in a gradient is +

      The vector of colors to use in a gradient is defined by the 'stop' elements that are child elements to a -'linearGradient', 'radialGradient', or 'meshpatch' +'linearGradient', or 'radialGradient' element.

      In SVG 1.1, the above read: "The ramp of @@ -2330,7 +1249,7 @@

      Attributes

      along the gradient vector. For radial gradients, it represents a fractional distance from the edge of the innermost/smallest circle to the edge of the outermost/largest - circle. This attribute does not apply to mesh gradients. + circle.

      @@ -2352,35 +1271,6 @@

      Attributes

      - -
      - path -
      -
      - -

      - Gives the path for one side of a mesh gradient patch. - - This attribute applies only to mesh gradients. -

      - -
      - -
      Value
      mesh path data
      -
      Initial value
      see notes below
      -
      Animatable
      yes
      - -
      - -

      - Mesh path data consists of a single 'l', 'L', 'c', or 'C' - path command (as defined for the 'd' property). - See the 'mesh' section - above for how the path data is interpreted. -

      - -
      -

      Properties

      @@ -3500,9 +2390,7 @@

      Interface SVGGradientElement

      The gradientTransform IDL attribute reflects the computed value of the 'transform' property -and either the 'transform' presentation attribute, -for 'meshgradient' elements, or the -'gradientTransform' presentation attribute +and the 'gradientTransform' presentation attribute for 'linearGradient' and 'radialGradient' elements.

      The spreadMethod IDL attribute @@ -3567,46 +2455,6 @@

      Interface SVGRadialGradientElement - -

      Interface SVGMeshGradientElement

      - - - -The SVGMeshGradientElement interface corresponds to the -'mesh' element. - -
      [Exposed=Window]
-interface SVGMeshGradientElement : SVGGradientElement {
-};
      - -

      Note that the SVGMeshGradientElement does not have any -reflecting IDL attributes for its 'x', 'y', -'transform', 'href' and 'type' -attributes.

      - -       - - -

      Interface SVGMeshrowElement

      - -

      An SVGMeshrowElement object represents a 'meshrow' element -in the DOM.

      - -
      [Exposed=Window]
-interface SVGMeshrowElement : SVGElement {
-};
      - - -

      Interface SVGMeshpatchElement

      - -

      An SVGMeshpatchElement object represents a 'meshpatch' element -in the DOM.

      - -
      [Exposed=Window]
-interface SVGMeshpatchElement : SVGElement {
-};
      - -

      Interface SVGStopElement

      diff --git a/master/render.html b/master/render.html index 5382c346..535cd745 100644 --- a/master/render.html +++ b/master/render.html @@ -895,9 +895,6 @@

      The effect of the 'ove other svgvisiblehiddenvisible | scrollvisiblehiddenscroll -meshvisiblen/avisiblevisiblehiddenhidden - - textvisiblehiddenvisiblevisiblehiddenhidden diff --git a/master/shapes.html b/master/shapes.html index 97c205f5..f4bb64b5 100644 --- a/master/shapes.html +++ b/master/shapes.html @@ -35,9 +35,8 @@

      Introduction and definitions

    • circles, created with the 'circle' element,
    • ellipses, created with the 'ellipse' element,
    • straight lines, created with the 'line' element,
      • -
    • polylines, created with the 'polyline' element,
      • -
    • polygons, created with the 'polygon' element, and
      • -
    • meshes, created with the 'mesh' element.
      • +
    • polylines, created with the 'polyline' element, and
      • +
    • polygons, created with the 'polygon' element

    Mathematically, these shape elements are equivalent to a @@ -552,119 +551,6 @@

    The 'polygon' element< -

    The 'mesh' element

    - -

    - New in SVG 2. -

    -

    - Added by resolution at the - Amsterdam - Editor's Meeting in order to distinguish a mesh as a graphics - element from mesh as a paint server. Behavior of overflow resolved - on the last day. -

    - - - -

    - The 'mesh' element is a wrapper for a 'meshgradient' - paint server. Its geometry is determined by the referenced - 'meshgradient'. -

    - - - -
    -
    - - - - - - - - - - - - - -
    NameValueInitial valueAnimatable
    hrefURL [URL](none)yes
    -
    -
    -

    - An URL reference to - a 'meshgradient' paint server. -

    - Refer to the common handling defined for - URL reference attributes. -
    -
    - -

    - If the 'href' points to a valid 'meshgradient' paint - server, use that to render the 'mesh' element; else if the - first 'meshgradient' child element is valid use that. - Otherwise, the 'mesh' will not render. A non-rendered - 'mesh' behaves the same as a 'path' that has - a 'd' property with value - none. Note: The - 'fill' property is not used to define the paint of a - 'mesh', however a 'mesh' may have a stroke and - markers positioned using the equivalent path. -

    -

    - The equivalent path consists of a path constructed to match - the outer shape of the referenced 'meshgradient'. To - construct the path, start at the first corner of the first - 'meshpatch' and then walk around the ouside of - the 'meshgradient', adding each linear or Bézier segment - encountered to the path. When the starting point is reached, the - path should be closed with a segment-completing close path - command. -

    - -
    - A simple 2x2 patch mesh with a thick black stroke along - the outside. A red dot is at the upper left corner and an - arrow showing the direction the path is constructed. -

    - A 2x2 patch mesh gradient. The equivalent path is shown by the - heavy black path. The path starting point is indicated by the red - circle and the path direction by the arrow. -

    -
    - -

    - Meshes can fold over such that there may be painted regions that - are outside the equivalent path. Painting of these regions is - controlled by the 'overflow' property. The initial value - for this property is - visible. -

    - -
    - Two simple one patch meshes with thick black strokes along - the outsides. -

    - Single patch mesh gradient with different values of the - 'overflow' property. Left: 'overflow' with value - display. Right 'overflow' - with value hidden. -

    -
    - -

    - A 'mesh' is always painted as if the fill rule - is nonzero regardless of the - value of the 'fill-rule' property. -

    - -     -

    DOM interfaces

    @@ -774,21 +660,6 @@

    Interface SVGLineElement

    - -

    Interface SVGMeshElement

    - - - -

    An SVGMeshElement object represents a 'mesh' element in the DOM.

    - -
    [Exposed=Window]
-interface SVGMeshElement : SVGGeometryElement {};
-
-SVGMeshElement includes SVGURIReference;
    - -     - -

    Mixin SVGAnimatedPoints

    The SVGAnimatedPoints interface is used to reflect diff --git a/master/struct.html b/master/struct.html index 66743a88..ca84ff8c 100644 --- a/master/struct.html +++ b/master/struct.html @@ -2623,28 +2623,6 @@

    Implicit and Allowed ARIA Semantics

    none no role may be applied - - 'mesh' - img role - if the element meets the inclusion criteria, - otherwise none - no restrictions - - - 'meshgradient' - none - no role may be applied - - - 'meshpatch' - none - no role may be applied - - - 'meshrow' - none - no role may be applied - 'metadata' none diff --git a/master/styling.html b/master/styling.html index 3f678358..40139061 100644 --- a/master/styling.html +++ b/master/styling.html @@ -614,7 +614,7 @@

    User agent style sheet

    clipPath, mask, marker, desc, title, metadata, pattern, hatch, -linearGradient, radialGradient, meshGradient, +linearGradient, radialGradient, script, style, symbol { display: none !important; From eaf2f575d33cee3c981eb1ab4b7c79b29f6a154e Mon Sep 17 00:00:00 2001 From: David Storey Date: Wed, 9 May 2018 16:31:33 -0700 Subject: [PATCH 2/4] Add to changelog --- master/changes.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/master/changes.html b/master/changes.html index 8aacebfd..1f3bd6cb 100644 --- a/master/changes.html +++ b/master/changes.html @@ -666,8 +666,8 @@

    Paint Servers chapter (owner: BogdanBrinza)

  • Added an 'radialGradient/fr' attribute to the 'radialGradient' element, which allows specifying the radius of the focal circle.
    • -
  • Added a section for mesh gradients, defining the 'mesh', 'meshrow' - and 'meshpatch' elements. (Renamed 'meshGradient' to 'mesh', 'meshRow' to 'meshrow', +
  • Added a section for mesh gradients, defining the mesh, meshrow + and meshpatch elements. (Renamed 'meshGradient' to 'mesh', 'meshRow' to 'meshrow', and 'meshPatch' to 'meshpatch'.)
  • Added a section for hatches, defining the 'hatch' and 'hatchpath' elements. @@ -690,6 +690,7 @@

    Paint Servers chapter (owner: BogdanBrinza)

    From a1a07d4eb27763a3af59e3085b94c9b10205c8c5 Mon Sep 17 00:00:00 2001 From: David Storey Date: Tue, 15 May 2018 15:03:39 -0700 Subject: [PATCH 3/4] Make changelog more explicit that this is a deferment --- master/changes.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/master/changes.html b/master/changes.html index 1f3bd6cb..3815b34b 100644 --- a/master/changes.html +++ b/master/changes.html @@ -690,7 +690,7 @@

    Paint Servers chapter (owner: BogdanBrinza)

    From 5e623ebd0f3210dd9e503c02c839f649c77ea74c Mon Sep 17 00:00:00 2001 From: David Storey Date: Tue, 15 May 2018 15:14:04 -0700 Subject: [PATCH 4/4] Actually spell deferred correctly :D This is how HTTP referer became a thig :D --- master/changes.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/master/changes.html b/master/changes.html index 3815b34b..c09061d7 100644 --- a/master/changes.html +++ b/master/changes.html @@ -690,7 +690,7 @@

    Paint Servers chapter (owner: BogdanBrinza)

    • SVGGradientElement and SVGPatternElement no longer implement SVGUnitTypes. Github #291.
      • -
    • Defered mesh gradients, including mesh, meshrow, and meshpath elements to a future version of SVG.
      • +
    • Deferred mesh gradients, including mesh, meshrow, and meshpath elements to a future version of SVG.