| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <style> |
| 3 body { |
| 4 font-size: 10px; |
| 5 } |
| 6 </style> |
| 7 <body> |
| 8 <template id="target-template"> |
| 9 <svg width="0" height="0" viewBox="0 0 1000 1000"> |
| 10 <text class="target"/> |
| 11 </svg> |
| 12 </template> |
| 13 <script src="../svg-attribute-interpolation/resources/interpolation-test.js"></s
cript> |
| 14 <script> |
| 15 'use strict'; |
| 16 |
| 17 assertAttributeInterpolation({ |
| 18 property: 'y', |
| 19 underlying: '1, 1, 1', |
| 20 from: '-1, -2, 1', |
| 21 fromComposite: 'add', |
| 22 to: '4, -7, 6', |
| 23 toComposite: 'add', |
| 24 }, [ |
| 25 {at: -0.4, is: '-2, 1, 0'}, |
| 26 {at: 0, is: '0, -1, 2'}, |
| 27 {at: 0.2, is: '1, -2, 3'}, |
| 28 {at: 0.6, is: '3, -4, 5'}, |
| 29 {at: 1, is: '5, -6, 7'}, |
| 30 {at: 1.4, is: '7, -8, 9'}, |
| 31 ]); |
| 32 assertAttributeInterpolation({ |
| 33 property: 'y', |
| 34 underlying: '1em, 1ex, 1rem', |
| 35 from: '-1em, 0ex, 1rem', |
| 36 fromComposite: 'add', |
| 37 to: '4em, 5ex, 6rem', |
| 38 toComposite: 'add', |
| 39 }, [ |
| 40 {at: -0.4, is: '-2em, -1ex, 0rem'}, |
| 41 {at: 0, is: '0em, 1ex, 2rem'}, |
| 42 {at: 0.2, is: '1em, 2ex, 3rem'}, |
| 43 {at: 0.6, is: '3em, 4ex, 5rem'}, |
| 44 {at: 1, is: '5em, 6ex, 7rem'}, |
| 45 {at: 1.4, is: '7em, 8ex, 9rem'}, |
| 46 ]); |
| 47 assertAttributeInterpolation({ |
| 48 property: 'y', |
| 49 underlying: '50, 50, 0', |
| 50 from: '50%, 0em, 0', |
| 51 fromComposite: 'add', |
| 52 to: '0em, 50%, 0', |
| 53 toComposite: 'add', |
| 54 }, [ |
| 55 {at: -0.4, is: '750, -150, 0'}, |
| 56 {at: 0, is: '550, 50, 0'}, |
| 57 {at: 0.2, is: '450, 150, 0'}, |
| 58 {at: 0.6, is: '250, 350, 0'}, |
| 59 {at: 1, is: '50, 550, 0'}, |
| 60 {at: 1.4, is: '-150, 750, 0'}, |
| 61 ]); |
| 62 |
| 63 assertAttributeInterpolation({ |
| 64 property: 'y', |
| 65 underlying: '1, 1, 1', |
| 66 from: '0, -1, 2', |
| 67 fromComposite: 'replace', |
| 68 to: '4, -7, 6', |
| 69 toComposite: 'add', |
| 70 }, [ |
| 71 {at: -0.4, is: '-2, 1, 0'}, |
| 72 {at: 0, is: '0, -1, 2'}, |
| 73 {at: 0.2, is: '1, -2, 3'}, |
| 74 {at: 0.6, is: '3, -4, 5'}, |
| 75 {at: 1, is: '5, -6, 7'}, |
| 76 {at: 1.4, is: '7, -8, 9'}, |
| 77 ]); |
| 78 assertAttributeInterpolation({ |
| 79 property: 'y', |
| 80 underlying: '1em, 1ex, 1rem', |
| 81 from: '0em, 1ex, 2rem', |
| 82 fromComposite: 'replace', |
| 83 to: '4em, 5ex, 6rem', |
| 84 toComposite: 'add', |
| 85 }, [ |
| 86 {at: -0.4, is: '-2em, -1ex, 0rem'}, |
| 87 {at: 0, is: '0em, 1ex, 2rem'}, |
| 88 {at: 0.2, is: '1em, 2ex, 3rem'}, |
| 89 {at: 0.6, is: '3em, 4ex, 5rem'}, |
| 90 {at: 1, is: '5em, 6ex, 7rem'}, |
| 91 {at: 1.4, is: '7em, 8ex, 9rem'}, |
| 92 ]); |
| 93 assertAttributeInterpolation({ |
| 94 property: 'y', |
| 95 underlying: '1em, 10%, 0', |
| 96 from: '55%, 5em, 0', |
| 97 fromComposite: 'replace', |
| 98 to: '4em, 45%, 0', |
| 99 toComposite: 'add', |
| 100 }, [ |
| 101 {at: -0.4, is: '750, -150, 0'}, |
| 102 {at: 0, is: '550, 50, 0'}, |
| 103 {at: 0.2, is: '450, 150, 0'}, |
| 104 {at: 0.6, is: '250, 350, 0'}, |
| 105 {at: 1, is: '50, 550, 0'}, |
| 106 {at: 1.4, is: '-150, 750, 0'}, |
| 107 ]); |
| 108 |
| 109 assertAttributeInterpolation({ |
| 110 property: 'y', |
| 111 underlying: '0, -1, 2', |
| 112 from: neutralKeyframe, |
| 113 to: '5, -6, 7', |
| 114 toComposite: 'replace', |
| 115 }, [ |
| 116 {at: -0.4, is: '-2, 1, 0'}, |
| 117 {at: 0, is: '0, -1, 2'}, |
| 118 {at: 0.2, is: '1, -2, 3'}, |
| 119 {at: 0.6, is: '3, -4, 5'}, |
| 120 {at: 1, is: '5, -6, 7'}, |
| 121 {at: 1.4, is: '7, -8, 9'}, |
| 122 ]); |
| 123 assertAttributeInterpolation({ |
| 124 property: 'y', |
| 125 underlying: '0em, 1ex, 2rem', |
| 126 from: neutralKeyframe, |
| 127 to: '5em, 6ex, 7rem', |
| 128 toComposite: 'replace', |
| 129 }, [ |
| 130 {at: -0.4, is: '-2em, -1ex, 0rem'}, |
| 131 {at: 0, is: '0em, 1ex, 2rem'}, |
| 132 {at: 0.2, is: '1em, 2ex, 3rem'}, |
| 133 {at: 0.6, is: '3em, 4ex, 5rem'}, |
| 134 {at: 1, is: '5em, 6ex, 7rem'}, |
| 135 {at: 1.4, is: '7em, 8ex, 9rem'}, |
| 136 ]); |
| 137 assertAttributeInterpolation({ |
| 138 property: 'y', |
| 139 underlying: '55%, 5em, 0', |
| 140 from: neutralKeyframe, |
| 141 to: '5em, 55%, 0', |
| 142 toComposite: 'replace', |
| 143 }, [ |
| 144 {at: -0.4, is: '750, -150, 0'}, |
| 145 {at: 0, is: '550, 50, 0'}, |
| 146 {at: 0.2, is: '450, 150, 0'}, |
| 147 {at: 0.6, is: '250, 350, 0'}, |
| 148 {at: 1, is: '50, 550, 0'}, |
| 149 {at: 1.4, is: '-150, 750, 0'}, |
| 150 ]); |
| 151 </script> |
| 152 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1587533002:
Add composition support for SVG Web Animation of x, y, dx, dy attributes (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master