diff options
| author | Saivan <savian@me.com> | 2018-03-05 02:24:43 +1100 |
|---|---|---|
| committer | Saivan <savian@me.com> | 2018-03-05 02:24:43 +1100 |
| commit | 4a03212d2dfac7079d51bd98faefe423889761cf (patch) | |
| tree | 7cc09f4340d98ffc8317ab40b47028810b8cb167 /playgrounds | |
| parent | c64401369e6a2e066c9a38abd7b0e385555fe36d (diff) | |
| download | svg.js-4a03212d2dfac7079d51bd98faefe423889761cf.tar.gz svg.js-4a03212d2dfac7079d51bd98faefe423889761cf.zip | |
Fixed recommendations by @Fuzzyma regarding transforms
This commit fixes a number of issues with transformations:
- Removed move/dmove/etc... on groups
- Sugar was being passed origin instead of ox, oy
- Updated the changelog
- Removed parseMatrix in favor of new SVG.Matrix()
- .matrix is the getter for a matrix, not .transform
- added a [02:24:41] Using gulpfile ~/Desktop/svg/svg.js/gulpfile.js
[02:24:41] Starting 'lint'...
[02:24:43] Finished 'lint' after 2.32 s directive
Diffstat (limited to 'playgrounds')
| -rw-r--r-- | playgrounds/playground.css | 5 | ||||
| -rw-r--r-- | playgrounds/transforms/transforms.html | 9 |
2 files changed, 9 insertions, 5 deletions
diff --git a/playgrounds/playground.css b/playgrounds/playground.css index 71fabed..f327905 100644 --- a/playgrounds/playground.css +++ b/playgrounds/playground.css @@ -4,8 +4,7 @@ } html { - background-color : #f5f6f7; - /* text-align: center; */ + background-color : #fefefe; } body { @@ -45,7 +44,7 @@ svg { width: 100%; grid-row: 3; grid-column: 2/4; - background-color: white; + background-color: #f5f6f7; border-radius: 20px; border: #f065 1px solid; } diff --git a/playgrounds/transforms/transforms.html b/playgrounds/transforms/transforms.html index ac60f14..89dc419 100644 --- a/playgrounds/transforms/transforms.html +++ b/playgrounds/transforms/transforms.html @@ -10,9 +10,14 @@ <body> - <h1>SVG JS Playground</h1> + <h1>Transformations</h1> - <svg viewBox="-200 -200 400 400"> + <p> + Here you can try out our transformation code, try moving around the pink + box in your console with its variable name: <code>mover</code> + </p> + + <svg viewBox="0 0 1500 1500"> <rect id="old" x=200 y=400 width=200 height=400 class="green"/> <rect id="new" x=200 y=400 width=200 height=400 class="pink"/> |