├── .gitignore ├── .npmignore ├── doc ├── lifecircle.png ├── README.md └── Janvas.jmind ├── .editorconfig ├── package.json ├── LICENSE ├── README.md └── dist └── janvas.min.js /.gitignore: -------------------------------------------------------------------------------- 1 | /.idea 2 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | /.idea 2 | -------------------------------------------------------------------------------- /doc/lifecircle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JarenChow/Janvas/HEAD/doc/lifecircle.png -------------------------------------------------------------------------------- /doc/README.md: -------------------------------------------------------------------------------- 1 | # Janvas.jmind 打开方式 2 | 3 | 使用 [在线 JMind](http://janvas.cn/JMind/) 打开或者下载 [JMind](https://github.com/JarenChow/JMind) 源代码进行本地打开。 4 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | #editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | max_line_length = 999 12 | 13 | [*.md] 14 | trim_trailing_whitespace = false 15 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "janvas", 3 | "version": "2.9.9", 4 | "description": "A lightweight&simple 2D javascript library based on HTML5 Canvas.", 5 | "main": "dist/janvas.min.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "git+https://github.com/JarenChow/Janvas.git" 12 | }, 13 | "keywords": [ 14 | "javascript", 15 | "canvas", 16 | "svg", 17 | "2d", 18 | "drawing", 19 | "graphic", 20 | "library" 21 | ], 22 | "author": "JarenChow", 23 | "license": "MIT", 24 | "bugs": { 25 | "url": "https://github.com/JarenChow/Janvas/issues" 26 | }, 27 | "homepage": "https://github.com/JarenChow/Janvas#readme" 28 | } 29 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 JarenChow 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Janvas\[暂停更新\] 2 | 3 | A lightweight&simple 2D javascript library based on HTML5 Canvas. 4 | 5 | 一款轻量、简单的基于 HTML5 Canvas 2d 绘图上下文的 JavaScript 绘图库。 6 | 7 | 它不是框架，它只做了它该做的基础建设。 8 | 9 | ## 安装 10 | 11 | 1. `` 12 | 2. `npm install janvas --save` 13 | 14 | ## [Hello World](https://jarenchow.github.io/JanvasExamples/html/hello_world.html) 15 | 16 | - 与既有 Canvas 项目整合（功能受限） 17 | 1. `` 18 | 2. `` 19 | 3. `var ctx = document.querySelector("canvas").getContext("2d");` 20 | 4. `var text = new janvas.Text(ctx, 50, 50, "HelloWorld"); // new 一个文本` 21 | 5. `text.fill(); // 文本绘制` 22 | 23 | - 使用 janvas.Canvas 开发（全部功能） 24 | 25 | ```html 26 | 27 | 28 |
29 | 30 | 31 | 65 | 66 | 67 | ``` 68 | 69 | ## Janvas 示例 70 | 71 | 详见 [JanvasExamples](https://github.com/JarenChow/JanvasExamples) 72 | 73 | 其他一些小示例写在 [CSDN](https://blog.csdn.net/M3oM3oChong) 和 [CodePen](https://codepen.io/jarenchow) 74 | 75 | ## 源代码 76 | 77 | 从一开始 **janvas** 本只想以最简洁的方式应用到项目中，所以没有以 npm 方式管理包，之后有需求与精力再重写。 78 | 79 | 目前 [janvas.min.js](./dist/janvas.min.js) 仅使用 [uglifyjs](https://github.com/mishoo/UglifyJS) --compress 简单压缩无混淆。 80 | 81 | ## 总览 82 | 83 | [Janvas.jmind](./doc/README.md) 84 | 85 | ### janvas.Canvas 86 | 87 | #### 生命周期 88 | 89 | 1. 创建：`var obj = new janvas.Canvas(options);` 90 | 2. 周期：![lifecircle](./doc/lifecircle.png) 91 | 3. 销毁：`obj.$destroy();`，将发生： 92 | - 移除事件监听器 93 | - 停止动画 94 | - 移除 `` 元素 95 | - `resize/intersection unobserve` 96 | - 移除自身属性引用 97 | 98 | ## License 99 | 100 | [MIT](https://opensource.org/licenses/MIT) 101 | -------------------------------------------------------------------------------- /doc/Janvas.jmind: -------------------------------------------------------------------------------- 1 | {"value":"Janvas","children":[{"value":"core","children":[{"value":"Utils","children":[{"value":"static","children":[{"value":"存储","children":[{"value":"LRU","children":[{"value":"new LRU(maxSize)","children":[]},{"value":"prototype","children":[{"value":"get(key)","children":[]},{"value":"set(key, value)","children":[]},{"value":"clear()","children":[]},{"value":"length","children":[]}],"collapse":true}]},{"value":"ls","children":[{"value":"get(key)","children":[]},{"value":"set(key, value)","children":[]},{"value":"remove(key)","children":[]},{"value":"clear()","children":[]}]}],"collapse":true},{"value":"动画","children":[{"value":"ease","children":[{"value":"in","children":[{"value":"linear","children":[]},{"value":"sine","children":[]},{"value":"quad","children":[]},{"value":"cubic","children":[]},{"value":"quart","children":[]},{"value":"quint","children":[]},{"value":"expo","children":[]},{"value":"circ","children":[]},{"value":"back","children":[]},{"value":"elastic","children":[]},{"value":"bounce","children":[]}],"collapse":true},{"value":"out","children":[{"value":"linear","children":[]},{"value":"sine","children":[]},{"value":"quad","children":[]},{"value":"cubic","children":[]},{"value":"quart","children":[]},{"value":"quint","children":[]},{"value":"expo","children":[]},{"value":"circ","children":[]},{"value":"back","children":[]},{"value":"elastic","children":[]},{"value":"bounce","children":[]}],"collapse":true},{"value":"inout","children":[{"value":"linear","children":[]},{"value":"sine","children":[]},{"value":"quad","children":[]},{"value":"cubic","children":[]},{"value":"quart","children":[]},{"value":"quint","children":[]},{"value":"expo","children":[]},{"value":"circ","children":[]},{"value":"back","children":[]},{"value":"elastic","children":[]},{"value":"bounce","children":[]}],"collapse":true}]}],"collapse":true},{"value":"继承","children":[{"value":"inheritPrototype(subType)","children":[]}],"collapse":true},{"value":"文本","children":[{"value":"measureTextWidth(text, font)","children":[]},{"value":"measureTextFontSize(text, width, fontFamily, min, max)","children":[]},{"value":"measureText(text, font, textAlign, textBaseline, direction)","children":[]}],"collapse":true},{"value":"图片","children":[{"value":"loadImage(src, callback, context)","children":[]},{"value":"loadImages(srcs, callback, context)","children":[]}],"collapse":true},{"value":"渐变","children":[{"value":"createLinearGradient(x0, y0, x1, y1, basicShape)","children":[]},{"value":"createRadialGradient(x0, y0, r0, x1, y1, r1, basicShape)","children":[]},{"value":"createPattern(image, repetition, matrix)","children":[]}],"collapse":true},{"value":"数学","children":[{"value":"randInt(start_or_end, end, containsEnd)","children":[]},{"value":"rad2deg(radian)","children":[]},{"value":"deg2rad(degree)","children":[]},{"value":"combination(n, m)","children":[]},{"value":"permutation(n, m)","children":[]},{"value":"factorial(n)","children":[]},{"value":"randSign()","children":[]}],"collapse":true},{"value":"防抖节流","children":[{"value":"debounce(func, delay, immediate)","children":[]},{"value":"throttle(func, delay, useTime)","children":[]},{"value":"nextTick(func)","children":[]}],"collapse":true},{"value":"其他","children":[{"value":"unique(array)","children":[]},{"value":"clone(obj)","children":[]},{"value":"noop()","children":[]}],"collapse":true}],"collapse":true}]},{"value":"Collision","children":[{"value":"static","children":[{"value":"arc(x1, y1, r1, x2, y2, r2)","children":[]},{"value":"rect(x1, y1, x2, y2, x3, y3, x4, y4)","children":[]},{"value":"arcRect(x, y, r, x1, y1, x2, y2, ox, oy, cos, sin)","children":[]},{"value":"light(x, y, vx, vy, x1, y1, x2, y2)","children":[]},{"value":"sepAxis(points1, points2)","children":[]},{"value":"sepAxisArc(points, x, y, r)","children":[]}],"collapse":true}]},{"value":"Rgb","children":[{"value":"new Rgb(red, green, blue, alpha)","children":[]},{"value":"static","children":[{"value":"mixing(back, front, ratio, result)","children":[]},{"value":"extract(back1, mix1, back2_or_alpha, mix2_or_result, result)","children":[]},{"value":"sRgbMixing(srgb1, srgb2, ratio, result)","children":[]},{"value":"sRgbGammaMixing(srgb1, srgb2, ratio, result)","children":[]}],"collapse":true},{"value":"prototype","children":[{"value":"fromRgbString(rgbString)","children":[]},{"value":"fromHexString(hexString)","children":[]},{"value":"fromHsl(hsl)","children":[]},{"value":"random(red, green, blue, alpha)","children":[]},{"value":"sRgbInverseCompanding()","children":[]},{"value":"sRgbCompanding()","children":[]},{"value":"toRgbString(containsAlpha)","children":[]},{"value":"toHexString(containsAlpha)","children":[]},{"value":"init(red, green, blue, alpha)","children":[]},{"value":"equals(rgb)","children":[]},{"value":"copy(rgb)","children":[]},{"value":"clone()","children":[]},{"value":"getter/setter","children":[{"value":"getRed()","children":[]},{"value":"setRed(red)","children":[]},{"value":"getGreen()","children":[]},{"value":"setGreen(green)","children":[]},{"value":"getBlue()","children":[]},{"value":"setBlue(blue)","children":[]},{"value":"getAlpha()","children":[]},{"value":"setAlpha(alpha)","children":[]}],"collapse":true}],"collapse":true}]},{"value":"Hsl","children":[{"value":"new Hsl(hue, saturation, lightness, alpha)","children":[]},{"value":"prototype","children":[{"value":"fromHslString(hslString)","children":[]},{"value":"fromRgb(rgb)","children":[]},{"value":"random(hue, saturation, lightness, alpha)","children":[]},{"value":"toHslString(containsAlpha)","children":[]},{"value":"init(hue, saturation, lightness, alpha)","children":[]},{"value":"equals(hsl)","children":[]},{"value":"copy(hsl)","children":[]},{"value":"clone()","children":[]},{"value":"getter/setter","children":[{"value":"getHue()","children":[]},{"value":"setHue(hue)","children":[]},{"value":"getSaturation()","children":[]},{"value":"setSaturation(saturation)","children":[]},{"value":"getLightness()","children":[]},{"value":"setLightness(lightness)","children":[]},{"value":"getAlpha()","children":[]},{"value":"setAlpha(alpha)","children":[]}],"collapse":true}],"collapse":true}]},{"value":"Point","children":[{"value":"new Point(x, y)","children":[]},{"value":"static","children":[{"value":"basisX = new Point(1, 0);","children":[]},{"value":"basisY = new Point(0, 1);","children":[]},{"value":"vertical2point(point1, point2, result)","children":[]},{"value":"vertical2line(point1, point2, point3, result)","children":[]},{"value":"line2line(point1, point2, point3, point4, result)","children":[]},{"value":"line2arc(point1, point2, point, radius, result1, result2)","children":[]},{"value":"arc2arc(point1, radius1, point2, radius2, result1, result2)","children":[]},{"value":"arc(point1, point2, point3, result)","children":[]},{"value":"arcin(point1, point2, point3, result)","children":[]}],"collapse":true},{"value":"prototype","children":[{"value":"init(x, y)","children":[]},{"value":"equals(point)","children":[]},{"value":"ratio2point(point)","children":[]},{"value":"ratio2line(point1, point2)","children":[]},{"value":"anti2point(point)","children":[]},{"value":"anti2line(point1, point2)","children":[]},{"value":"modulus()","children":[]},{"value":"slope()","children":[]},{"value":"radian()","children":[]},{"value":"manhattan(point)","children":[]},{"value":"dotProduct(point)","children":[]},{"value":"crossProduct(point)","children":[]},{"value":"theta(point)","children":[]},{"value":"offsetX(point)","children":[]},{"value":"offsetY(point)","children":[]},{"value":"copy(point)","children":[]},{"value":"clone()","children":[]},{"value":"unit()","children":[]},{"value":"abs()","children":[]},{"value":"inverse()","children":[]},{"value":"inverseX()","children":[]},{"value":"inverseY()","children":[]},{"value":"vertical()","children":[]},{"value":"verticalAnti()","children":[]},{"value":"add(point)","children":[]},{"value":"subtract(point)","children":[]},{"value":"multiply(point)","children":[]},{"value":"divide(point)","children":[]},{"value":"inline(point, ratio)","children":[]},{"value":"skewX(skewX)","children":[]},{"value":"skewY(skewY)","children":[]},{"value":"skew(skewX, skewY)","children":[]},{"value":"scaleX(scaleX)","children":[]},{"value":"scaleY(scaleY)","children":[]},{"value":"scale(scaleX, scaleY)","children":[]},{"value":"rotate(angle)","children":[]},{"value":"translateX(offsetX)","children":[]},{"value":"translateY(offsetY)","children":[]},{"value":"translate(offsetX, offsetY)","children":[]},{"value":"transform(mat)","children":[]},{"value":"resetTransform(mat)","children":[]},{"value":"getter/setter","children":[{"value":"getX()","children":[]},{"value":"setX(x)","children":[]},{"value":"getY()","children":[]},{"value":"setY(y)","children":[]}],"collapse":true}],"collapse":true}]},{"value":"Matrix","children":[{"value":"prototype","children":[{"value":"equals(matrix)","children":[]},{"value":"getM11()","children":[]},{"value":"getM11i()","children":[]},{"value":"getM12()","children":[]},{"value":"getM12i()","children":[]},{"value":"getM21()","children":[]},{"value":"getM21i()","children":[]},{"value":"getM22()","children":[]},{"value":"getM22i()","children":[]},{"value":"getM41()","children":[]},{"value":"getM41i()","children":[]},{"value":"getM42()","children":[]},{"value":"getM42i()","children":[]},{"value":"getter/setter","children":[{"value":"getSkewX()","children":[]},{"value":"setSkewX(skewX)","children":[]},{"value":"getSkewY()","children":[]},{"value":"setSkewY(skewY)","children":[]},{"value":"setSkew(skewX, skewY)","children":[]},{"value":"getScaleX()","children":[]},{"value":"setScaleX(scaleX)","children":[]},{"value":"getScaleY()","children":[]},{"value":"setScaleY(scaleY)","children":[]},{"value":"setScale(scaleX, scaleY)","children":[]},{"value":"getAngle()","children":[]},{"value":"setAngle(angle)","children":[]},{"value":"getOffsetX()","children":[]},{"value":"setOffsetX(offsetX)","children":[]},{"value":"getOffsetY()","children":[]},{"value":"setOffsetY(offsetY)","children":[]},{"value":"setOffset(offsetX, offsetY)","children":[]}],"collapse":true}],"collapse":true}]},{"value":"Style","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getAlpha()","children":[]},{"value":"setAlpha(alpha)","children":[]},{"value":"getCompositeOperation()","children":[]},{"value":"setCompositeOperation (compositeOperation)","children":[]},{"value":"getFilter()","children":[]},{"value":"setFilter(filter)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"ShadowStyle","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getShadowBlur()","children":[]},{"value":"setShadowBlur(shadowBlur)","children":[]},{"value":"getShadowColor()","children":[]},{"value":"setShadowColor(shadowColor)","children":[]},{"value":"getShadowOffsetX()","children":[]},{"value":"setShadowOffsetX(shadowOffsetX)","children":[]},{"value":"getShadowOffsetY()","children":[]},{"value":"setShadowOffsetY(shadowOffsetY)","children":[]},{"value":"setShadowOffset(shadowOffsetX, shadowOffsetY)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"FillStrokeStyle","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getFillStyle()","children":[]},{"value":"setFillStyle(fillStyle)","children":[]},{"value":"getStrokeStyle()","children":[]},{"value":"setStrokeStyle(strokeStyle)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"ShapeStyle","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getLineDash()","children":[]},{"value":"setLineDash(lineDash)","children":[]},{"value":"getLineDashOffset()","children":[]},{"value":"setLineDashOffset(lineDashOffset)","children":[]},{"value":"getLineWidth()","children":[]},{"value":"setLineWidth(lineWidth)","children":[]},{"value":"getLineCap()","children":[]},{"value":"setLineCap(lineCap)","children":[]},{"value":"getLineJoin()","children":[]},{"value":"setLineJoin(lineJoin)","children":[]},{"value":"getMiterLimit()","children":[]},{"value":"setMiterLimit(miterLimit)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"TextStyle","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getFont()","children":[]},{"value":"setFont(font)","children":[]},{"value":"getTextAlign()","children":[]},{"value":"setTextAlign(textAlign)","children":[]},{"value":"getTextBaseline()","children":[]},{"value":"setTextBaseline(textBaseline)","children":[]},{"value":"getDirection()","children":[]},{"value":"setDirection(direction)","children":[]}],"collapse":true}]}]},{"value":"ImageStyle","children":[{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getSmoothingEnabled()","children":[]},{"value":"setSmoothingEnabled(smoothingEnabled)","children":[]},{"value":"getSmoothingQuality()","children":[]},{"value":"setSmoothingQuality(smoothingQuality)","children":[]}],"collapse":true}]}]}]}]}]}]}]}]}]}]},{"value":"Animate","children":[{"value":"prototype","children":[{"value":"start()","children":[]},{"value":"pause()","children":[]},{"value":"resume()","children":[]},{"value":"stop()","children":[]},{"value":"isRunning()","children":[]},{"value":"isStopped()","children":[]},{"value":"isPaused()","children":[]},{"value":"inProgress()","children":[]}],"collapse":true},{"value":"subclass","children":[{"value":"AnimateITV","children":[{"value":"new AnimateITV(func, duration, interval)","children":[]}]},{"value":"AnimateRAF","children":[{"value":"new AnimateRAF(func, duration, interval)","children":[]}]}]}]},{"value":"Animation","children":[{"value":"new Animation(animate, duration, interval, beforeUpdate, onUpdate, afterUpdate)","children":[]},{"value":"prototype","children":[{"value":"start()","children":[]},{"value":"reverse()","children":[]},{"value":"pause()","children":[]},{"value":"resume()","children":[]},{"value":"stop(toEnd)","children":[]},{"value":"inProgress()","children":[]},{"value":"isRunning()","children":[]},{"value":"isStopped()","children":[]},{"value":"isPaused()","children":[]},{"value":"isForward()","children":[]},{"value":"beforeUpdate()","children":[]},{"value":"update(interval)","children":[]},{"value":"afterUpdate(forward)","children":[]}],"collapse":true}]},{"value":"Canvas","children":[{"value":"new Canvas(options)","children":[{"value":"options","children":[{"value":"container","children":[]},{"value":"duration","children":[]},{"value":"interval","children":[]},{"value":"dpr","children":[]},{"value":"props","children":[]},{"value":"components","children":[]},{"value":"methods","children":[{"value":"init()","children":[]},{"value":"resize()","children":[]},{"value":"update(timestamp, interval)","children":[]},{"value":"draw()","children":[]}],"collapse":true},{"value":"events","children":[{"value":"mousedown(ev)","children":[]},{"value":"mousemove(ev)","children":[]},{"value":"mouseup(ev)","children":[]},{"value":"mouseover(ev)","children":[]},{"value":"mouseout(ev)","children":[]},{"value":"click(ev)","children":[]},{"value":"dblclick(ev)","children":[]},{"value":"contextmenu(ev)","children":[]},{"value":"wheel(ev)","children":[]},{"value":"keydown(ev)","children":[]},{"value":"keyup(ev)","children":[]},{"value":"keypress(ev)","children":[]},{"value":"touchstart(ev)","children":[]},{"value":"touchmove(ev)","children":[]},{"value":"touchend(ev)","children":[]},{"value":"touchcancel(ev)","children":[]},{"value":"focus(ev)","children":[]},{"value":"blur(ev)","children":[]},{"value":"focusin(ev)","children":[]},{"value":"focusout(ev)","children":[]},{"value":"visibilitychange(visible)","children":[]}],"collapse":true},{"value":"functions","children":[]},{"value":"callbacks","children":[]}],"collapse":true},{"value":"this","children":[{"value":"$container","children":[]},{"value":"$wrapper","children":[]},{"value":"$canvas","children":[]},{"value":"$ctx","children":[]},{"value":"$dpr","children":[]},{"value":"$raf","children":[]},{"value":"$duration","children":[]},{"value":"$interval","children":[]}],"collapse":true},{"value":"event","children":[{"value":"$x","children":[]},{"value":"$y","children":[]},{"value":"$moveX","children":[]},{"value":"$moveY","children":[]},{"value":"$scale","children":[]},{"value":"$lastScale","children":[]},{"value":"$scaling","children":[]},{"value":"$scalingRatio","children":[]},{"value":"$preventDefault()","children":[]}],"collapse":true}]},{"value":"prototype","children":[{"value":"$isVisible()","children":[]},{"value":"$getCursor()","children":[]},{"value":"$setCursor(cursor)","children":[]},{"value":"$resizeAll(width, height)","children":[]},{"value":"$resize(width, height)","children":[]},{"value":"$toDataURL(type, quality)","children":[]},{"value":"$toBlob(callback, type, quality)","children":[]},{"value":"$saveAsImage(filename, type, quality)","children":[]},{"value":"$clear()","children":[]},{"value":"$destroy()","children":[]}],"collapse":true}]}]},{"value":"view","children":[{"value":"Shape","children":[{"value":"prototype","children":[{"value":"init(sx, sy, ox, oy)","children":[]},{"value":"fill(fillRule)","children":[]},{"value":"stroke()","children":[]},{"value":"fillStroke(fillRule)","children":[]},{"value":"strokeFill(fillRule)","children":[]},{"value":"clip(fillRule)","children":[]},{"value":"restore(count)","children":[]},{"value":"clear(sx, sy, width, height, fillRule)","children":[]},{"value":"isPointInPath(x, y)","children":[]},{"value":"isPointInStroke(x, y)","children":[]},{"value":"isQuickInPath(x, y)","children":[]},{"value":"isQuickInStroke(x, y)","children":[]},{"value":"process()","children":[]},{"value":"getter/setter","children":[{"value":"getStartX()","children":[]},{"value":"setStartX(sx)","children":[]},{"value":"getStartY()","children":[]},{"value":"setStartY(sy)","children":[]},{"value":"setStart(sx, sy)","children":[]},{"value":"getOriginX()","children":[]},{"value":"setOriginX(ox)","children":[]},{"value":"getOriginY()","children":[]},{"value":"setOriginY(oy)","children":[]},{"value":"setOrigin(ox, oy)","children":[]},{"value":"getVectorX()","children":[]},{"value":"getVectorY()","children":[]},{"value":"getMatrix()","children":[]},{"value":"setMatrix(mat)","children":[]},{"value":"getStyle()","children":[]},{"value":"setStyle(sty)","children":[]}],"collapse":true}],"collapse":true},{"value":"subclass","children":[{"value":"Rect","children":[{"value":"new Rect(ctx, sx, sy, width, height, ox, oy)","children":[]},{"value":"prorotype","children":[{"value":"getter/setter","children":[{"value":"getWidth()","children":[]},{"value":"setWidth(width)","children":[]},{"value":"getHeight()","children":[]},{"value":"setHeight(height)","children":[]},{"value":"getLeft()","children":[]},{"value":"getTop()","children":[]},{"value":"getRight()","children":[]},{"value":"getBottom()","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"Grid","children":[{"value":"new Grid(ctx, sx, sy, width, height, spacing, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getSpacing()","children":[]},{"value":"setSpacing(spacing)","children":[]}],"collapse":true}]}]},{"value":"RoundRect","children":[{"value":"new RoundRect(ctx, sx, sy, width, height, radius, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"inherit Arc","children":[{"value":"getRadius()","children":[]},{"value":"setRadius(radius)","children":[]}]}],"collapse":true}]}]},{"value":"Image","children":[{"value":"new Image(ctx, sx, sy, src, ox, oy, width, height, cropX, cropY, cropWidth, cropHeight)","children":[]},{"value":"prototype","children":[{"value":"toImageData()","children":[]},{"value":"isComplete()","children":[]},{"value":"resetDraw()","children":[]},{"value":"draw()","children":[]},{"value":"getter/setter","children":[{"value":"getSrc()","children":[]},{"value":"setSrc(src)","children":[]},{"value":"getImage()","children":[]},{"value":"setImage(image)","children":[]},{"value":"getAdjustSize()","children":[]},{"value":"setAdjustSize(adjustSize)","children":[]},{"value":"getCropX()","children":[]},{"value":"setCropX(cropX)","children":[]},{"value":"getCropY()","children":[]},{"value":"setCropY(cropY)","children":[]},{"value":"setCrop(cropX, cropY)","children":[]},{"value":"getCropWidth()","children":[]},{"value":"setCropWidth(cropWidth)","children":[]},{"value":"getCropHeight()","children":[]},{"value":"setCropHeight(cropHeight)","children":[]}],"collapse":true}],"collapse":true}]}]}]},{"value":"Arc","children":[{"value":"new Arc(ctx, sx, sy, radius, startAngle, endAngle, anticlockwise, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getRadius()","children":[]},{"value":"setRadius(radius)","children":[]},{"value":"getStartAngle()","children":[]},{"value":"setStartAngle(startAngle)","children":[]},{"value":"getEndAngle()","children":[]},{"value":"setEndAngle(endAngle)","children":[]},{"value":"getAnticlockwise()","children":[]},{"value":"setAnticlockwise(anticlockwise)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"Sector","children":[{"value":"new Sector(ctx, sx, sy, radius, startAngle, endAngle, anticlockwise, ox, oy)","children":[]}]},{"value":"Ring","children":[{"value":"new Ring(ctx, sx, sy, outerRadius, innerRadius, startAngle, endAngle, anticlockwise, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getOuterRadius()","children":[]},{"value":"setOuterRadius(outerRadius)","children":[]},{"value":"getInnerRadius()","children":[]},{"value":"setInnerRadius(innerRadius)","children":[]}],"collapse":true}]}]},{"value":"Ellipse","children":[{"value":"new Ellipse(ctx, sx, sy, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getRadiusX()","children":[]},{"value":"setRadiusX(radiusX)","children":[]},{"value":"getRadiusY()","children":[]},{"value":"setRadiusY(radiusY)","children":[]},{"value":"setRadius(radiusX, radiusY)","children":[]},{"value":"getRotation()","children":[]},{"value":"setRotation(rotation)","children":[]}],"collapse":true}]}]},{"value":"RegularPolygon","children":[{"value":"new RegularPolygon(ctx, sx, sy, radius, sides, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getSides()","children":[]},{"value":"setSides(sides)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"RegularStar","children":[{"value":"new RegularStar(ctx, sx, sy, radius, sides, ox, oy)","children":[]}]}]}]}]}]},{"value":"Line","children":[{"value":"new Line(ctx, sx, sy, ex, ey, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getEndX()","children":[]},{"value":"setEndX(ex)","children":[]},{"value":"getEndY()","children":[]},{"value":"setEndY(ey)","children":[]},{"value":"setEnd(ex, ey)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"BezierLine","children":[{"value":"new BezierLine(ctx, sx, sy, ex, ey, cp1x, cp1y, cp2x, cp2y, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getControlPoint1X()","children":[]},{"value":"setControlPoint1X(cp1x)","children":[]},{"value":"getControlPoint1Y()","children":[]},{"value":"setControlPoint1Y(cp1y)","children":[]},{"value":"setControlPoint1(cp1x, cp1y)","children":[]},{"value":"getControlPoint2X()","children":[]},{"value":"setControlPoint2X(cp2x)","children":[]},{"value":"getControlPoint2Y()","children":[]},{"value":"setControlPoint2Y(cp2y)","children":[]},{"value":"setControlPoint2(cp2x, cp2y)","children":[]}],"collapse":true}]}]},{"value":"Edge","children":[{"value":"new Edge(ctx, sx, sy, ex, ey, ax, ay, el, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getAnchorX()","children":[]},{"value":"setAnchorX(ax)","children":[]},{"value":"getAnchorY()","children":[]},{"value":"setAnchorY(ay)","children":[]},{"value":"setAnchor(ax, ay)","children":[]},{"value":"getEmptyLength()","children":[]},{"value":"setEmptyLength(el)","children":[]},{"value":"getTargetX()","children":[]},{"value":"getTargetY()","children":[]},{"value":"getAnchorAngle()","children":[]},{"value":"getAngle()","children":[]},{"value":"ratioInRange()","children":[]}],"collapse":true}]}]}]}]},{"value":"Triangle","children":[{"value":"new Triangle(ctx, sx, sy, length, angle, rotation, closed, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getLength()","children":[]},{"value":"setLenght(length)","children":[]},{"value":"getAngle()","children":[]},{"value":"setAngle(angle)","children":[]},{"value":"inherit Ellipse","children":[{"value":"getRotation()","children":[]},{"value":"setRotation(rotation)","children":[]}]},{"value":"getClosed()","children":[]},{"value":"setClosed(closed)","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"Pin","children":[{"value":"new Pin(ctx, sx, sy, length, angle, rotation, closed, ox, oy)","children":[]}]}]}]},{"value":"Text","children":[{"value":"new Text(ctx, sx, sy, text, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getText()","children":[]},{"value":"setText(text)","children":[]},{"value":"getMetrics()","children":[]},{"value":"getWidth()","children":[]},{"value":"getActualBoundingBoxWidth()","children":[]},{"value":"getActualBoundingBoxHeight()","children":[]},{"value":"getLeft()","children":[]},{"value":"getRight()","children":[]},{"value":"getTop()","children":[]},{"value":"getBottom()","children":[]}],"collapse":true}]}]},{"value":"Poly","children":[{"value":"new Poly(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"append(x, y)","children":[]},{"value":"insert(index, x, y)","children":[]},{"value":"delete(index)","children":[]},{"value":"update(index, x, y)","children":[]},{"value":"peek(index, offset)","children":[]},{"value":"getter/setter","children":[{"value":"getPoints()","children":[]},{"value":"setPoints(points)","children":[]},{"value":"inherit Triangle","children":[{"value":"getLength()","children":[]},{"value":"setLength(length)","children":[]}]}],"collapse":true}],"collapse":true},{"value":"subclass","children":[{"value":"PolyShape","children":[{"value":"new PolyShape(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getTransformedPoints()","children":[]}]}]},{"value":"subclass","children":[{"value":"Polyline","children":[{"value":"new Polyline(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"subclass","children":[{"value":"Polygon","children":[{"value":"new Polygon(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"subclass","children":[{"value":"PolyRect","children":[{"value":"new PolyRect(ctx, sx, sy, points, length, ox, oy)","children":[]}]},{"value":"PolyArc","children":[{"value":"new PolyArc(ctx, sx, sy, points, length, ox, oy)","children":[]}]},{"value":"SuperEllipse","children":[{"value":"new SuperEllipse(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getExponent()","children":[]},{"value":"setExponent(exponent)","children":[]}],"collapse":true}]}]}]}]},{"value":"Bezier","children":[{"value":"new Bezier(ctx, sx, sy, points, length, ox, oy)","children":[]}]}]}]},{"value":"SmoothLine","children":[{"value":"new SmoothLine(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"getTension()","children":[]},{"value":"setTension(tension)","children":[]}],"collapse":true}]}]},{"value":"Dots","children":[{"value":"new Dots(ctx, sx, sy, points, length, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"inherit Arc","children":[{"value":"getRadius()","children":[]},{"value":"setRadius(radius)","children":[]}]}],"collapse":true}]}]}]}]}]}]},{"value":"FixedShape","children":[{"value":"new FixedShape(ctx, sx, sy, path, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"addPath(path)","children":[]},{"value":"addFixedShape(fixedShape)","children":[]},{"value":"getter/setter","children":[{"value":"getPath()","children":[]},{"value":"setPath(path)","children":[]},{"value":"getOffsetPath()","children":[]}],"collapse":true}]},{"value":"subclass","children":[{"value":"FixedRect","children":[{"value":"new FixedRect(ctx, sx, sy, width, height, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"inherit Rect","children":[{"value":"getWidth()","children":[]},{"value":"getHeight()","children":[]},{"value":"getLeft()","children":[]},{"value":"getTop()","children":[]},{"value":"getRight()","children":[]},{"value":"getBottom()","children":[]}]}],"collapse":true}]}]},{"value":"FixedArc","children":[{"value":"new FixedArc(ctx, sx, sy, radius, startAngle, endAngle, anticlockwise, ox, oy)","children":[]},{"value":"prototype","children":[{"value":"getter/setter","children":[{"value":"inherit Arc","children":[{"value":"getRadius()","children":[]},{"value":"getStartAngle()","children":[]},{"value":"getEndAngle()","children":[]},{"value":"getAnticlockwise()","children":[]}]}],"collapse":true}]}]}]}]}]}]},{"value":"ImageData","children":[{"value":"new ImageData(ctx, sx, sy, sw_or_imageData, sh_or_sw, dx, dy, dw, dh)","children":[]},{"value":"prototype","children":[{"value":"toDataURL(type, quality)","children":[]},{"value":"toBlob(callback, type, quality)","children":[]},{"value":"saveAsImage(filename, type, quality)","children":[]},{"value":"resetPut()","children":[]},{"value":"put()","children":[]},{"value":"isPointInPath(x, y)","children":[]},{"value":"isPointInStroke(x, y)","children":[]},{"value":"forEach(callback, context, x, y, w, h)","children":[]},{"value":"mosaic(t, x, y, w, h)","children":[]},{"value":"transparencyDisposal(ratio, x, y, w, h)","children":[]},{"value":"reverseColor(x, y, w, h)","children":[]},{"value":"greyProcessing(x, y, w, h)","children":[]},{"value":"blackWhite(ratio, x, y, w, h)","children":[]},{"value":"relief()","children":[]},{"value":"sunGlass()","children":[]},{"value":"frostedGlass(t)","children":[]},{"value":"getter/setter","children":[{"value":"getImageData()","children":[]},{"value":"setImageData(sx, sy, sw_or_imageData, sh_or_sw)","children":[]},{"value":"getData()","children":[]},{"value":"inherit Rect","children":[{"value":"getWidth()","children":[]},{"value":"getHeight()","children":[]},{"value":"getStartX()","children":[]},{"value":"getStartY()","children":[]},{"value":"setStart(sx, sy)","children":[]},{"value":"getLeft()","children":[]},{"value":"getTop()","children":[]},{"value":"getRight()","children":[]},{"value":"getBottom()","children":[]}]},{"value":"setStartX(sx)","children":[]},{"value":"setStartY(sy)","children":[]},{"value":"init(sx, sy)","children":[]},{"value":"getPixelIndex(x, y)","children":[]},{"value":"getDirtyX()","children":[]},{"value":"setDirtyX(dx)","children":[]},{"value":"getDirtyY()","children":[]},{"value":"setDirtyY(dy)","children":[]},{"value":"setDirty(dx, dy)","children":[]},{"value":"getDirtyWidth()","children":[]},{"value":"setDirtyWidth(dw)","children":[]},{"value":"getDirtyHeight()","children":[]},{"value":"setDirtyHeight(dh)","children":[]}],"collapse":true}],"collapse":true}]}]}]} -------------------------------------------------------------------------------- /dist/janvas.min.js: -------------------------------------------------------------------------------- 1 | // https://github.com/JarenChow/Janvas Created by JarenChow in 2020 janvas.js v2.9.9 2 | !function(global,factory){"object"==typeof exports&&"undefined"!=typeof module?module.exports=factory():"function"==typeof define&&define.amd?define(factory):(global=global||self).janvas=factory()}(this,function(){"use strict";function Utils(){}function Entry(value){this.value=value}function LinkedList(){this.clear()}function LRU(maxSize){this._list=new LinkedList,this._map=new Map,this._maxSize=isNaN(maxSize)?10:maxSize}function Rgb(red,green,blue,alpha){this.init(red,green,blue,alpha)}function Hsl(hue,saturation,lightness,alpha){this.init(hue,saturation,lightness,alpha)}function Matrix(){this.offsetX=Matrix.DEFAULT_OFFSET_X,this.offsetY=Matrix.DEFAULT_OFFSET_Y,this.angle=Matrix.DEFAULT_ANGLE,this._cos=Matrix.DEFAULT_COS,this._sin=Matrix.DEFAULT_SIN,this.scaleX=Matrix.DEFAULT_SCALE_X,this.scaleY=Matrix.DEFAULT_SCALE_Y,this.skewX=Matrix.DEFAULT_SKEW_X,this._tanX=Matrix.DEFAULT_TAN_X,this.skewY=Matrix.DEFAULT_SKEW_Y,this._tanY=Matrix.DEFAULT_TAN_Y,this._tanV=Matrix.DEFAULT_TAN_V}function Style(){this.alpha=Style.DEFAULT_ALPHA,this.compositeOperation=Style.DEFAULT_COMPOSITE_OPERATION,this.filter=Style.DEFAULT_FILTER}function ShadowStyle(){Style.call(this),this.shadowBlur=ShadowStyle.DEFAULT_SHADOW_BLUR,this.shadowColor=ShadowStyle.DEFAULT_SHADOW_COLOR,this.shadowOffsetX=ShadowStyle.DEFAULT_SHADOW_OFFSET_X,this.shadowOffsetY=ShadowStyle.DEFAULT_SHADOW_OFFSET_Y}function FillStrokeStyle(){ShadowStyle.call(this),this.fillStyle=FillStrokeStyle.DEFAULT_FILL_STYLE,this.strokeStyle=FillStrokeStyle.DEFAULT_STROKE_STYLE}function ShapeStyle(){FillStrokeStyle.call(this),this.lineDash=ShapeStyle.DEFAULT_LINE_DASH,this.lineDashOffset=ShapeStyle.DEFAULT_LINE_DASH_OFFSET,this.lineWidth=ShapeStyle.DEFAULT_LINE_WIDTH,this.lineCap=ShapeStyle.DEFAULT_LINE_CAP,this.lineJoin=ShapeStyle.DEFAULT_LINE_JOIN,this.miterLimit=ShapeStyle.DEFAULT_MITER_LIMIT}function TextStyle(){ShapeStyle.call(this),this.font=TextStyle.DEFAULT_FONT,this.textAlign=TextStyle.DEFAULT_TEXT_ALIGN,this.textBaseline=TextStyle.DEFAULT_TEXT_BASELINE,this.direction=TextStyle.DEFAULT_DIRECTION}function ImageStyle(){ShapeStyle.call(this),this.smoothingEnabled=ImageStyle.DEFAULT_SMOOTHING_ENABLED,this.smoothingQuality=ImageStyle.DEFAULT_SMOOTHING_QUALITY}function Point(x,y){this.init(x,y)}function Collision(){}function Animate(func,duration,interval){this.func=func,this.duration=isNaN(duration)?0:duration,this.interval=interval,this._requestId=void 0,this._loopBind=this._loop.bind(this),this._init()}function AnimateITV(func,duration,interval){Animate.call(this,func,duration,interval||16)}function AnimateRAF(func,duration,interval){Animate.call(this,func,duration,interval)}function $Animation(animate,duration,interval,beforeUpdate,onUpdate,afterUpdate){this.animate=animate,this.duration=isNaN(duration)?0:duration,this.interval=interval,this._overflow=0,beforeUpdate&&(this.beforeUpdate=beforeUpdate),onUpdate&&(this.onUpdate=onUpdate),afterUpdate&&(this.afterUpdate=afterUpdate)}function Shape(ctx,sx,sy,ox,oy){this.ctx=ctx,this.init(sx,sy,isNaN(ox)?0:ox,isNaN(oy)?0:oy),this.setMatrix(new Matrix),this._initStyle()}function Arc(ctx,sx,sy,radius,startAngle,endAngle,anticlockwise,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setRadius(radius).setStartAngle(isNaN(startAngle)?0:startAngle).setEndAngle(isNaN(endAngle)?2*Math.PI:endAngle).setAnticlockwise(!!anticlockwise)}function Sector(ctx,sx,sy,radius,startAngle,endAngle,anticlockwise,ox,oy){Arc.call(this,ctx,sx,sy,radius,startAngle,endAngle,anticlockwise,ox,oy)}function Ring(ctx,sx,sy,outerRadius,innerRadius,startAngle,endAngle,anticlockwise,ox,oy){Arc.call(this,ctx,sx,sy,outerRadius,startAngle,endAngle,anticlockwise,ox,oy),this.setInnerRadius(innerRadius)}function Ellipse(ctx,sx,sy,radiusX,radiusY,rotation,startAngle,endAngle,anticlockwise,ox,oy){Arc.call(this,ctx,sx,sy,radiusX,startAngle,endAngle,anticlockwise,ox,oy),this.setRadiusY(radiusY).setRotation(isNaN(rotation)?0:rotation)}function RegularPolygon(ctx,sx,sy,radius,sides,ox,oy){Arc.call(this,ctx,sx,sy,radius,0,2*Math.PI,!1,ox,oy),this.setSides(sides)}function RegularStar(ctx,sx,sy,radius,sides,ox,oy){RegularPolygon.call(this,ctx,sx,sy,radius,sides,ox,oy)}function Rect(ctx,sx,sy,width,height,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setWidth(width).setHeight(height)}function Grid(ctx,sx,sy,width,height,spacing,ox,oy){Rect.call(this,ctx,sx,sy,width,height,ox,oy),this.setSpacing(spacing)}function RoundRect(ctx,sx,sy,width,height,radius,ox,oy){Rect.call(this,ctx,sx,sy,width,height,ox,oy),this.setRadius(radius)}function $Image(ctx,sx,sy,src,ox,oy,width,height,cropX,cropY,cropWidth,cropHeight){Rect.call(this,ctx,sx,sy,width,height,ox,oy),this.setAdjustSize(isNaN(width)||isNaN(height)).setCropX(cropX).setCropY(cropY).setCropWidth(cropWidth).setCropHeight(cropHeight),"[object String]"===Utils._toString.call(src)?this.setSrc(src):this.setImage(src)}function $ImageData(ctx,sx,sy,sw_or_imageData,sh_or_sw,dx,dy,dw,dh){this.ctx=ctx,this.setDirtyX(dx).setDirtyY(dy).setDirtyWidth(dw).setDirtyHeight(dh).setImageData(sx,sy,sw_or_imageData,sh_or_sw)}function Text(ctx,sx,sy,text,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setText(text)}function Line(ctx,sx,sy,ex,ey,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setEndX(ex).setEndY(ey)}function BezierLine(ctx,sx,sy,ex,ey,cp1x,cp1y,cp2x,cp2y,ox,oy){Line.call(this,ctx,sx,sy,ex,ey,ox,oy),this.setControlPoint1X(cp1x).setControlPoint1Y(cp1y).setControlPoint2X(cp2x).setControlPoint2Y(cp2y)}function Edge(ctx,sx,sy,ex,ey,ax,ay,el,ox,oy){Line.call(this,ctx,sx,sy,ex,ey,ox,oy),this.setAnchorX(ax).setAnchorY(ay).setEmptyLength(isNaN(el)?0:el)}function Triangle(ctx,sx,sy,length,angle,rotation,closed,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setLength(isNaN(length)?10:length).setAngle(isNaN(angle)?Math.PI/3:angle).setRotation(isNaN(rotation)?0:rotation).setClosed(void 0===closed||closed)}function Pin(ctx,sx,sy,length,angle,rotation,closed,ox,oy){Triangle.call(this,ctx,sx,sy,isNaN(length)?20:length,isNaN(angle)?Math.PI/4:angle,rotation,closed,ox,oy)}function Poly(ctx,sx,sy,points,length,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setPoints(points).setLength(isNaN(length)?points.length:length)}function PolyShape(ctx,sx,sy,points,length,ox,oy){Poly.call(this,ctx,sx,sy,points,length,ox,oy),this._initPoints()._initCache()}function Polyline(ctx,sx,sy,points,length,ox,oy){PolyShape.call(this,ctx,sx,sy,points,length,ox,oy)}function Bezier(ctx,sx,sy,points,length,ox,oy){Polyline.call(this,ctx,sx,sy,points,isNaN(length)?200:length,ox,oy)}function Polygon(ctx,sx,sy,points,length,ox,oy){Polyline.call(this,ctx,sx,sy,points,length,ox,oy)}function PolyRect(ctx,sx,sy,points,length,ox,oy){Polygon.call(this,ctx,sx,sy,points,isNaN(length)?8:length,ox,oy)}function PolyArc(ctx,sx,sy,points,length,ox,oy){Polygon.call(this,ctx,sx,sy,points,isNaN(length)?200:length,ox,oy)}function SuperEllipse(ctx,sx,sy,points,length,ox,oy){Polygon.call(this,ctx,sx,sy,points,isNaN(length)?200:length,ox,oy),this.setExponent(3)}function SmoothLine(ctx,sx,sy,points,length,ox,oy){PolyShape.call(this,ctx,sx,sy,points,points.length?3*points.length-4:0,ox,oy),this.setTension(1)}function Dots(ctx,sx,sy,points,length,ox,oy){PolyShape.call(this,ctx,sx,sy,points,length,ox,oy),this.setRadius(3)}function FixedShape(ctx,sx,sy,path,ox,oy){Shape.call(this,ctx,sx,sy,ox,oy),this.setPath(path)}function FixedRect(ctx,sx,sy,width,height,ox,oy){FixedShape.call(this,ctx,sx,sy,void 0,ox,oy),this.width=width,this.height=height,this.process()}function FixedArc(ctx,sx,sy,radius,startAngle,endAngle,anticlockwise,ox,oy){FixedShape.call(this,ctx,sx,sy,void 0,ox,oy),this.radius=radius,this.startAngle=isNaN(startAngle)?0:startAngle,this.endAngle=isNaN(endAngle)?2*Math.PI:endAngle,this.anticlockwise=!!anticlockwise,this.process()}function Canvas(options){var sty,$=this;$.$container=options?"[object String]"===Utils._toString.call(options.container)?document.querySelector(options.container):options.container:void 0,$.$container&&(void 0===($.$wrapper=$.$container.children[0])&&$.$container.appendChild($.$wrapper=document.createElement("div")),void 0===$.$wrapper._count&&($.$wrapper._count=$.$wrapper.tabIndex=0,Object.assign($.$wrapper,Utils._eventMixin),(sty=$.$wrapper.style).position="relative",sty.overflow="hidden",sty.outline="none"),this.$resizeAll(options.width,options.height),$.$canvas=document.createElement("canvas"),$.$canvas.style.position="absolute",($.$wrapper.appendChild($.$canvas).$=$).$ctx=$.$canvas.getContext("2d",{alpha:!0,desynchronized:!1}),Object.defineProperties($.$ctx,{_dpr:{writable:!0,enumerable:!1},_stack:{value:[],enumberable:!1}}),$._$dpr=options.dpr,$.$raf=new AnimateRAF(function(timestamp,interval){this.update(timestamp,interval),this.draw()}.bind($),$.$duration=options.duration,$.$interval=options.interval),Object.assign($,options.props,options.components,options.methods,options.events,options.functions,options.callbacks),$._$visible=!1,$._$resize().init(),$.resize(),$.draw(),0==$.$wrapper._count++?(Utils._resizeObserver.observe($.$wrapper),Utils._intersectionObserver.observe($.$wrapper)):($._$visible=$.$canvas.previousSibling.$._$visible,$._$visible&&!document.hidden&&$.visibilitychange(!0)),$._$initListeners(),$._$addListeners())}return Utils.LRU=(LinkedList.prototype.push=function(entry){null===this.head?this.head=this.tail=entry:((this.tail.next=entry).previous=this.tail,entry.next=null,this.tail=entry),this._length++},LinkedList.prototype.remove=function(entry){var previous=entry.previous,next=entry.next;previous?previous.next=next:this.head=next,next?next.previous=previous:this.tail=previous,entry.previous=entry.next=null,this._length--},LinkedList.prototype.clear=function(){this.head=this.tail=null,this._length=0},Object.defineProperty(LinkedList.prototype,"length",{get:function(){return this._length}}),LRU.prototype.get=function(list){var entry=this._map.get(list);if(void 0!==entry){list=this._list;return entry!==list.tail&&(list.remove(entry),list.push(entry)),entry.value}},LRU.prototype.set=function(key,value){var list,entry,head,map=this._map;void 0===map.get(key)&&(head=(list=this._list).length,entry=this._last,head>=this._maxSize&&0width?min:max}var sep=Math.floor((min+max)/2),textWidth=Utils.measureTextWidth(text,sep+"px "+fontFamily);return width=this._nextstamp&&(this._callback(this._nextstamp),this._nextstamp+=this.interval):this._callback(this._nextstamp=timestamp):(this._callback(this._nextstamp=this.duration),this._stop())},AnimateRAF.prototype._resume=function(){this._requestId=requestAnimationFrame(this._loopBind)},AnimateRAF.prototype._stop=function(){this._requestId=cancelAnimationFrame(this._requestId)},$Animation.prototype.start=function(){return this.beforeUpdate(),this._timestamp=this._nextstamp=0,this._update=this._updateForward,this.resume()},$Animation.prototype.reverse=function(){return this.isStopped()?this:(this._update=this.isForward()?this._updateBackward:this._updateForward,this.interval&&(this._nextstamp+=this.isForward()?this.interval:-this.interval),this.resume())},$Animation.prototype.pause=function(){return this.update=Utils.noop,this},$Animation.prototype.resume=function(){var duration;return this.isStopped()||(this._timestamp+=this._overflow*(this.isForward()?1:-1),this._overflow=0,duration=this.isForward()?this.duration-this._timestamp:this._timestamp,this.update=this._update,this.animate._timestamp+duration>=this.animate.duration&&(this.animate.duration=duration,this.animate.start())),this},$Animation.prototype.stop=function(toEnd){return this.isRunning()&&(this.update=(this._timestamp=toEnd^this.isForward()?0:this.duration)?this._updateForward:this._updateBackward,this._update=Utils.noop),this},$Animation.prototype.inProgress=function(){return!this.isStopped()&&(this.isForward()?this._timestamp=this._nextstamp&&(this._callback(this._nextstamp),this._nextstamp+=this.interval):this._callback(this._nextstamp=this._timestamp):(this._overflow=this._timestamp-this.duration,this._callback(this._nextstamp=this._timestamp=this.duration),this.pause().afterUpdate(!0)),this},$Animation.prototype._updateBackward=function(interval){return 0<(this._timestamp-=interval)?this.interval?this._timestamp<=this._nextstamp&&(this._callback(this._nextstamp),this._nextstamp-=this.interval):this._callback(this._nextstamp=this._timestamp):(this._overflow=-this._timestamp,this._callback(this._nextstamp=this._timestamp=0),this.pause().afterUpdate(!1)),this},$Animation.prototype._callback=function(timestamp){this.onUpdate(timestamp/this.duration)},["update","_update","beforeUpdate","onUpdate","afterUpdate"].forEach(function(method){$Animation.prototype[method]=Utils.noop}),Shape.prototype._initStyle=function(){this.setStyle(new ShapeStyle)},Shape.prototype.init=function(sx,sy,ox,oy){return this.sx=sx,this.sy=sy,this.ox=ox,this.oy=oy,this._sx=sx-ox,this._sy=sy-oy,this},Shape.prototype.fill=function(fillRule){return this._setFillStyles()._preprocess()._fill(fillRule)},Shape.prototype._setFillStyles=function(){return this._setStyle()._setShadowStyle()._setFillStyle()},Shape.prototype._fill=function(fillRule){return this.ctx.fill(fillRule),this},Shape.prototype.stroke=function(){return this._setStrokeStyles()._preprocess()._stroke()},Shape.prototype._setStrokeStyles=function(){return this._setStyle()._setShadowStyle()._setStrokeStyle()},Shape.prototype._stroke=function(){return this.ctx.stroke(),this},Shape.prototype.fillStroke=function(fillRule){return this._setFillStrokeStyles()._preprocess()._fill(fillRule)._stroke()},Shape.prototype.strokeFill=function(fillRule){return this._setFillStrokeStyles()._preprocess()._stroke()._fill(fillRule)},Shape.prototype._setFillStrokeStyles=function(){return this._setStyle()._setShadowStyle()._setFillStyle()._setStrokeStyle()},Shape.prototype._setStyle=function(){var ctx=this.ctx,sty=this.sty;return ctx._alpha!==sty.alpha&&(ctx.globalAlpha=ctx._alpha=sty.alpha),ctx._compositeOperation!==sty.compositeOperation&&(ctx.globalCompositeOperation=ctx._compositeOperation=sty.compositeOperation),ctx._filter!==sty.filter&&(ctx.filter=ctx._filter=sty.filter),this},Shape.prototype._setShadowStyle=function(){var ctx=this.ctx,sty=this.sty,dpr=ctx._dpr;return ctx._shadowBlur!==sty.shadowBlur&&(ctx.shadowBlur=(ctx._shadowBlur=sty.shadowBlur)*dpr),ctx._shadowColor!==sty.shadowColor&&(ctx.shadowColor=ctx._shadowColor=sty.shadowColor),ctx._shadowOffsetX!==sty.shadowOffsetX&&(ctx.shadowOffsetX=(ctx._shadowOffsetX=sty.shadowOffsetX)*dpr),ctx._shadowOffsetY!==sty.shadowOffsetY&&(ctx.shadowOffsetY=(ctx._shadowOffsetY=sty.shadowOffsetY)*dpr),this},Shape.prototype._setFillStyle=function(){var ctx=this.ctx,sty=this.sty;return ctx._fillStyle!==sty.fillStyle&&(ctx.fillStyle=ctx._fillStyle=sty.fillStyle),this},Shape.prototype._setStrokeStyle=function(){var ctx=this.ctx,sty=this.sty;return ctx._strokeStyle!==sty.strokeStyle&&(ctx.strokeStyle=ctx._strokeStyle=sty.strokeStyle),ctx._lineDash!==sty.lineDash&&ctx.setLineDash(ctx._lineDash=sty.lineDash),ctx._lineDashOffset!==sty.lineDashOffset&&(ctx.lineDashOffset=ctx._lineDashOffset=sty.lineDashOffset),ctx._lineWidth!==sty.lineWidth&&(ctx.lineWidth=ctx._lineWidth=sty.lineWidth),ctx._lineCap!==sty.lineCap&&(ctx.lineCap=ctx._lineCap=sty.lineCap),ctx._lineJoin!==sty.lineJoin&&(ctx.lineJoin=ctx._lineJoin=sty.lineJoin),ctx._miterLimit!==sty.miterLimit&&(ctx.miterLimit=ctx._miterLimit=sty.miterLimit),this},Shape.prototype.clip=function(fillRule){return this._preprocess()._save()._clip(fillRule)},Shape.prototype._clip=function(fillRule){return this.ctx.clip(fillRule),this},Shape.prototype._save=function(){var ctx=this.ctx;return ctx._stack.push({_m11:ctx._m11,_m12:ctx._m12,_m21:ctx._m21,_m22:ctx._m22,_m41:ctx._m41,_m42:ctx._m42,_m11i:ctx._m11i,_m12i:ctx._m12i,_m21i:ctx._m21i,_m22i:ctx._m22i,_m41i:ctx._m41i,_m42i:ctx._m42i,_alpha:ctx._alpha,_compositeOperation:ctx._compositeOperation,_filter:ctx._filter,_shadowBlur:ctx._shadowBlur,_shadowColor:ctx._shadowColor,_shadowOffsetX:ctx._shadowOffsetX,_shadowOffsetY:ctx._shadowOffsetY,_fillStyle:ctx._fillStyle,_strokeStyle:ctx._strokeStyle,_lineDash:ctx._lineDash,_lineDashOffset:ctx._lineDashOffset,_lineWidth:ctx._lineWidth,_lineCap:ctx._lineCap,_lineJoin:ctx._lineJoin,_miterLimit:ctx._miterLimit,_font:ctx._font,_textAlign:ctx._textAlign,_textBaseline:ctx._textBaseline,_direction:ctx._direction,_smoothingEnabled:ctx._smoothingEnabled,_smoothingQuality:ctx._smoothingQuality}),ctx.save(),this},Shape.prototype.restore=function(count){for(var pop,ctx=this.ctx,stack=ctx._stack;stack.length&&(pop=stack.pop(),ctx._m11=pop._m11,ctx._m12=pop._m12,ctx._m21=pop._m21,ctx._m22=pop._m22,ctx._m41=pop._m41,ctx._m42=pop._m42,ctx._m11i=pop._m11i,ctx._m12i=pop._m12i,ctx._m21i=pop._m21i,ctx._m22i=pop._m22i,ctx._m41i=pop._m41i,ctx._m42i=pop._m42i,ctx._alpha=pop._alpha,ctx._compositeOperation=pop._compositeOperation,ctx._filter=pop._filter,ctx._shadowBlur=pop._shadowBlur,ctx._shadowColor=pop._shadowColor,ctx._shadowOffsetX=pop._shadowOffsetX,ctx._shadowOffsetY=pop._shadowOffsetY,ctx._fillStyle=pop._fillStyle,ctx._strokeStyle=pop._strokeStyle,ctx._lineDash=pop._lineDash,ctx._lineDashOffset=pop._lineDashOffset,ctx._lineWidth=pop._lineWidth,ctx._lineCap=pop._lineCap,ctx._lineJoin=pop._lineJoin,ctx._miterLimit=pop._miterLimit,ctx._font=pop._font,ctx._textAlign=pop._textAlign,ctx._textBaseline=pop._textBaseline,ctx._direction=pop._direction,ctx._smoothingEnabled=pop._smoothingEnabled,ctx._smoothingQuality=pop._smoothingQuality,ctx.restore(),--count););return this},Shape.prototype.clear=function(sx,sy,width,height,fillRule){return this.clip(fillRule).ctx.clearRect(this._sx+sx,this._sy+sy,width,height),this.restore()},Shape.prototype._setTransform=function(){var ctx=this.ctx,mat=this.mat,m11=mat.getM11(),m22=mat.getM22(),m12=mat.getM12(),m21=mat.getM21(),m41=mat.offsetX+this.ox,m42=mat.offsetY+this.oy;return m11!==ctx._m11||m22!==ctx._m22||m12!==ctx._m12||m21!==ctx._m21?(ctx.transform(m11*ctx._m11i+m12*ctx._m21i,m11*ctx._m12i+m12*ctx._m22i,m21*ctx._m11i+m22*ctx._m21i,m21*ctx._m12i+m22*ctx._m22i,m41*ctx._m11i+m42*ctx._m21i+ctx._m41i,m41*ctx._m12i+m42*ctx._m22i+ctx._m42i),ctx._m11=m11,ctx._m12=m12,ctx._m21=m21,ctx._m22=m22,ctx._m41=m41,ctx._m42=m42,ctx._m11i=mat.getM11i(),ctx._m12i=mat.getM12i(),ctx._m21i=mat.getM21i(),ctx._m22i=mat.getM22i(),ctx._m41i=-m41*ctx._m11i-m42*ctx._m21i,ctx._m42i=-m41*ctx._m12i-m42*ctx._m22i):m41===ctx._m41&&m42===ctx._m42||(ctx.translate(m41*ctx._m11i+m42*ctx._m21i+ctx._m41i,m41*ctx._m12i+m42*ctx._m22i+ctx._m42i),ctx._m41=m41,ctx._m42=m42,ctx._m41i=-m41*ctx._m11i-m42*ctx._m21i,ctx._m42i=-m41*ctx._m12i-m42*ctx._m22i),this},Shape.prototype._resetTransform=function(){var ctx=this.ctx;return 1!==ctx._m11i||1!==ctx._m22i||0!==ctx._m12i||0!==ctx._m21i?(ctx.transform(ctx._m11i,ctx._m12i,ctx._m21i,ctx._m22i,ctx._m41i,ctx._m42i),ctx._m11=ctx._m11i=ctx._m22=ctx._m22i=1,ctx._m12=ctx._m12i=ctx._m21=ctx._m21i=ctx._m41=ctx._m41i=ctx._m42=ctx._m42i=0):0===ctx._m41i&&0===ctx._m42i||(ctx.translate(ctx._m41i,ctx._m42i),ctx._m41=ctx._m41i=ctx._m42=ctx._m42i=0),this},Shape.prototype._preprocess=function(){return this._setTransform()._process()},Shape.prototype._process=function(){return this.process(),this},Shape.prototype.process=Utils.noop,Shape.prototype._isPointIn=function(type,x,y){var ctx=this.ctx,m22=this.mat,m11i=m22.getM11i(),m12i=m22.getM12i(),m21i=m22.getM21i(),m22i=m22.getM22i(),m41i=-(m22.offsetX+this.ox)*m11i-(m22.offsetY+this.oy)*m21i,m42i=-(m22.offsetX+this.ox)*m12i-(m22.offsetY+this.oy)*m22i,m11=ctx._m11,m12=ctx._m12,m21=ctx._m21,m22=ctx._m22;return this["_isPointIn"+type]((m11i*m11+m12i*m21)*x+(m21i*m11+m22i*m21)*y+m41i*m11+m42i*m21+ctx._m41,(m11i*m12+m12i*m22)*x+(m21i*m12+m22i*m22)*y+m41i*m12+m42i*m22+ctx._m42)},Shape.prototype.isPointInPath=function(x,y){return this._isPointIn("Path",x,y)},Shape.prototype._isPointInPath=function(x,y){var ctx=this._process().ctx,dpr=ctx._dpr;return ctx.isPointInPath(x*dpr,y*dpr)},Shape.prototype.isPointInStroke=function(x,y){return this._isPointIn("Stroke",x,y)},Shape.prototype._isPointInStroke=function(x,y){var ctx=this._process().ctx,dpr=ctx._dpr;return ctx.isPointInStroke(x*dpr,y*dpr)},Shape.prototype._isQuickIn=function(type,x,y){var m42i=this.mat,m11i=m42i.getM11i(),m12i=m42i.getM12i(),m21i=m42i.getM21i(),m22i=m42i.getM22i(),m41i=-(m42i.offsetX+this.ox)*m11i-(m42i.offsetY+this.oy)*m21i,m42i=-(m42i.offsetX+this.ox)*m12i-(m42i.offsetY+this.oy)*m22i;return this["_isQuickIn"+type](m11i*x+m21i*y+m41i,m12i*x+m22i*y+m42i)},Shape.prototype.isQuickInPath=function(x,y){return this._isQuickIn("Path",x,y)},Shape.prototype._isQuickInPath=function(x,y){return this._resetTransform()._isPointInPath(x,y)},Shape.prototype.isQuickInStroke=function(x,y){return this._isQuickIn("Stroke",x,y)},Shape.prototype._isQuickInStroke=function(x,y){return this._resetTransform()._isPointInStroke(x,y)},Shape.prototype.getStartX=function(){return this.sx},Shape.prototype.setStartX=function(sx){return this.sx=sx,this._sx=sx-this.ox,this},Shape.prototype.getStartY=function(){return this.sy},Shape.prototype.setStartY=function(sy){return this.sy=sy,this._sy=sy-this.oy,this},Shape.prototype.setStart=function(sx,sy){return this.setStartX(sx).setStartY(sy)},Shape.prototype.getOriginX=function(){return this.ox},Shape.prototype.setOriginX=function(ox){return this.ox=ox,this._sx=this.sx-ox,this},Shape.prototype.getOriginY=function(){return this.oy},Shape.prototype.setOriginY=function(oy){return this.oy=oy,this._sy=this.sy-oy,this},Shape.prototype.setOrigin=function(ox,oy){return this.setOriginX(ox).setOriginY(oy)},Shape.prototype.getVectorX=function(){return this._sx},Shape.prototype.getVectorY=function(){return this._sy},Shape.prototype.getMatrix=function(){return this.mat},Shape.prototype.setMatrix=function(mat){return this.mat=mat,this},Shape.prototype.getStyle=function(){return this.sty},Shape.prototype.setStyle=function(sty){return this.sty=sty,this},Utils.inheritPrototype(Arc,Shape),Arc.prototype.process=function(){this.ctx.beginPath(),this.ctx.arc(this._sx,this._sy,this.radius,this.startAngle,this.endAngle,this.anticlockwise)},Arc.prototype._isQuickInPath=function(x,y){return Math.sqrt(Math.pow(this._sx-x,2)+Math.pow(this._sy-y,2))<=this.radius},Arc.prototype._isQuickInStroke=function(x,y){return 0===Math.round((Math.sqrt(Math.pow(this._sx-x,2)+Math.pow(this._sy-y,2))-this.radius)/this.sty.lineWidth)},Arc.prototype.getRadius=function(){return this.radius},Arc.prototype.setRadius=function(radius){return this.radius=radius,this},Arc.prototype.getStartAngle=function(){return this.startAngle},Arc.prototype.setStartAngle=function(startAngle){return this.startAngle=startAngle,this},Arc.prototype.getEndAngle=function(){return this.endAngle},Arc.prototype.setEndAngle=function(endAngle){return this.endAngle=endAngle,this},Arc.prototype.getAnticlockwise=function(){return this.anticlockwise},Arc.prototype.setAnticlockwise=function(anticlockwise){return this.anticlockwise=anticlockwise,this},Utils.inheritPrototype(Sector,Arc),Sector.prototype.process=function(){var ctx=this.ctx,sx=this._sx,sy=this._sy;ctx.beginPath(),ctx.moveTo(sx,sy),ctx.arc(sx,sy,this.radius,this.startAngle,this.endAngle,this.anticlockwise),ctx.closePath()},Utils.inheritPrototype(Ring,Arc),Ring.prototype.process=function(){Arc.prototype.process.call(this),this.ctx.arc(this._sx,this._sy,this.innerRadius,this.endAngle,this.startAngle,!this.anticlockwise),this.ctx.closePath()},Ring.prototype.getOuterRadius=function(){return this.radius},Ring.prototype.setOuterRadius=function(outerRadius){return this.radius=outerRadius,this},Ring.prototype.getInnerRadius=function(){return this.innerRadius},Ring.prototype.setInnerRadius=function(innerRadius){return this.innerRadius=innerRadius,this},Utils.inheritPrototype(Ellipse,Arc),Ellipse.prototype.process=function(){this.ctx.beginPath(),this.ctx.ellipse(this._sx,this._sy,this.radius,this.radiusY,this.rotation,this.startAngle,this.endAngle,this.anticlockwise)},Ellipse.prototype._isQuickInPath=function(x,y){return x-=this._sx,y-=this._sy,Math.sqrt(Math.pow(this._cos*x+this._sin*y,2)*this._ryx+Math.pow(-this._sin*x+this._cos*y,2)*this._rxy)<=this._sqrtRxRy},Ellipse.prototype._isQuickInStroke=function(x,y){return x-=this._sx,y-=this._sy,0===Math.round((Math.sqrt(Math.pow(this._cos*x+this._sin*y,2)*this._ryx+Math.pow(-this._sin*x+this._cos*y,2)*this._rxy)-this._sqrtRxRy)/this.sty.lineWidth)},Ellipse.prototype.getRadiusX=function(){return this.radius},Ellipse.prototype.setRadiusX=function(radiusX){return this._setRadius(this.radius=radiusX,this.radiusY)},Ellipse.prototype.getRadiusY=function(){return this.radiusY},Ellipse.prototype.setRadiusY=function(radiusY){return this._setRadius(this.radius,this.radiusY=radiusY)},Ellipse.prototype.setRadius=function(radiusX,radiusY){return this.radius=radiusX,radiusY&&this.setRadiusY(this.radiusY=radiusY),this},Ellipse.prototype._setRadius=function(radiusX,radiusY){return this._sqrtRxRy=Math.sqrt(radiusX*radiusY),this._rxy=radiusX/radiusY,this._ryx=radiusY/radiusX,this},Ellipse.prototype.getRotation=function(){return this.rotation},Ellipse.prototype.setRotation=function(rotation){return this.rotation!==rotation&&(this.rotation=rotation,this._cos=Math.cos(rotation),this._sin=Math.sin(rotation)),this},Utils.inheritPrototype(RegularPolygon,Arc),RegularPolygon.prototype.process=function(){var tempY,ctx=this.ctx,sx=this._sx,sy=this._sy,cos=this._cos,sin=this._sin,vx=0,vy=-this.radius;ctx.beginPath(),ctx.moveTo(sx+vx,sy+vy);for(var i=0;i=this.getLeft()&&y>=this.getTop()&&x<=this.getRight()&&y<=this.getBottom()},Rect.prototype._isQuickInStroke=function(x,y){var left=this.getLeft(),top=this.getTop(),right=this.getRight(),bottom=this.getBottom(),lineWidth=this.sty.lineWidth;return(0===Math.round((x-left)/lineWidth)||0===Math.round((x-right)/lineWidth))&&top<=y&&y<=bottom||(0===Math.round((y-top)/lineWidth)||0===Math.round((y-bottom)/lineWidth))&&left<=x&&x<=right},Rect.prototype.setStartX=function(sx){return Shape.prototype.setStartX.call(this,sx)._horizontal()},Rect.prototype.setStartY=function(sy){return Shape.prototype.setStartY.call(this,sy)._vertical()},Rect.prototype.setOriginX=function(ox){return Shape.prototype.setOriginX.call(this,ox)._horizontal()},Rect.prototype.setOriginY=function(oy){return Shape.prototype.setOriginY.call(this,oy)._vertical()},Rect.prototype.getWidth=function(){return this.width},Rect.prototype.setWidth=function(width){return this.width=width,this._horizontal()},Rect.prototype._horizontal=function(){return 0=this._left&&y>=this._top&&x<=this._right&&y<=this._bottom},$ImageData.prototype.isPointInStroke=function(x,y){return(0===Math.round(x-this._left)||0===Math.round(x-this._right))&&y>=this._top&&y<=this._bottom||(0===Math.round(y-this._top)||0===Math.round(y-this._bottom))&&x>=this._left&&x<=this._right},$ImageData.prototype.setStartX=function(sx){return this.sx=this._sx=sx,this._horizontal()},$ImageData.prototype.setStartY=function(sy){return this.sy=this._sy=sy,this._vertical()},$ImageData.prototype.getDirtyX=function(){return this.dx},$ImageData.prototype.setDirtyX=function(dx){return this.dx=dx,this},$ImageData.prototype.getDirtyY=function(){return this.dy},$ImageData.prototype.setDirtyY=function(dy){return this.dy=dy,this},$ImageData.prototype.setDirty=function(dx,dy){return this.setDirtyX(dx).setDirtyY(dy)},$ImageData.prototype.getDirtyWidth=function(){return this.dw},$ImageData.prototype.setDirtyWidth=function(dw){return this.dw=dw,this},$ImageData.prototype.getDirtyHeight=function(){return this.dh},$ImageData.prototype.setDirtyHeight=function(dh){return this.dh=dh,this},$ImageData.prototype.getPixelIndex=function(x,y){return 4*(x-this.sx+(y-this.sy)*this.width)},$ImageData.prototype.forEach=function(callback,context,x,y,w,h){x=isNaN(x)||xthis._right?this._right-x:w,h=isNaN(h)||y+h>this._bottom?this._bottom-y:h;for(var j,data=this.data,index=this.getPixelIndex(x,y),offset=4*(this.width-w),i=y;ithis._right?this._right-x:w,h=isNaN(h)||y+h>this._bottom?this._bottom-y:h;for(var j,data=this.data,index=this.getPixelIndex(x,y),width=this.width,th=Math.floor(h/t),tw=Math.floor(w/t),xm=w%t,ym=h%t,i=0;i=ratio&&data[index+1]>=ratio&&data[index+2]>=ratio&&(data[index+3]=0)},this,x,y,w,h)},$ImageData.prototype.reverseColor=function(x,y,w,h){return this.forEach(function(data,index){data[index]=255-data[index],data[index+1]=255-data[index+1],data[index+2]=255-data[index+2]},this,x,y,w,h)},$ImageData.prototype.greyProcessing=function(x,y,w,h){return this.forEach(function(data,index){data[index]=data[index+1]=data[index+2]=.299*data[index]+.587*data[index+1]+.114*data[index+2]},this,x,y,w,h)},$ImageData.prototype.blackWhite=function(ratio,x,y,w,h){return ratio=isNaN(ratio)?127:254*ratio,this.forEach(function(data,index){data[index]=data[index+1]=data[index+2]=(data[index]+data[index+1]+data[index+2])/3>ratio?255:0},this,x,y,w,h)},$ImageData.prototype.relief=function(){for(var j,data=this.data,width=this.width,w=width-1,h=this.height-1,w4=4*width,index=0,i=0;i=this._right||y+rand>=this._bottom||(rand=index+4*(randX+rand*this.width),data[index]=data[rand],data[index+1]=data[rand+1],data[index+2]=data[rand+2],data[index+3]=data[rand+3])},this)},Utils.inheritPrototype(Text,Shape),Text.prototype._initStyle=function(){this.setStyle(new TextStyle)},Text.prototype._preprocess=Text.prototype._setTransform,Text.prototype._isPointIn=Text.prototype._isQuickIn,Utils._assign(Text,Rect,"_isQuickInPath","_isQuickInStroke"),Text.prototype._fill=function(){return this.ctx.fillText(this.text,this._sx,this._sy),this},Text.prototype._stroke=function(){return this.ctx.strokeText(this.text,this._sx,this._sy),this},Text.prototype._clip=function(){var ctx=this.ctx;return ctx.beginPath(),ctx.rect(this.getLeft(),this.getTop(),this.getActualBoundingBoxWidth(),this.getActualBoundingBoxHeight()),ctx.clip(),this},Text.prototype._setFillStyles=function(){return Shape.prototype._setFillStyles.call(this)._setTextStyle()},Text.prototype._setStrokeStyles=function(){return Shape.prototype._setStrokeStyles.call(this)._setTextStyle()},Text.prototype._setFillStrokeStyles=function(){return Shape.prototype._setFillStrokeStyles.call(this)._setTextStyle()},Text.prototype._setTextStyle=function(){var ctx=this.ctx,sty=this.sty;return ctx._font!==sty.font&&(ctx.font=ctx._font=sty.font),ctx._textAlign!==sty.textAlign&&(ctx.textAlign=ctx._textAlign=sty.textAlign),ctx._textBaseline!==sty.textBaseline&&(ctx.textBaseline=ctx._textBaseline=sty.textBaseline),ctx._direction!==sty.direction&&(ctx.direction=ctx._direction=sty.direction),this},Text.prototype.getText=function(){return this.text},Text.prototype.setText=function(text){return this.text=text,this},Text.prototype.getMetrics=function(){var sty=this.sty;return Utils.measureText(this.text,sty.font,sty.textAlign,sty.textBaseline,sty.direction)},Text.prototype.getWidth=function(){return this.getMetrics().width},Text.prototype.getActualBoundingBoxWidth=function(){return this.getMetrics().actualBoundingBoxWidth},Text.prototype.getActualBoundingBoxHeight=function(){return this.getMetrics().actualBoundingBoxHeight},Text.prototype.getLeft=function(){return this._sx-this.getMetrics().actualBoundingBoxLeft},Text.prototype.getRight=function(){return this._sx+this.getMetrics().actualBoundingBoxRight},Text.prototype.getTop=function(){return this._sy-this.getMetrics().actualBoundingBoxAscent},Text.prototype.getBottom=function(){return this._sy+this.getMetrics().actualBoundingBoxDescent},Utils.inheritPrototype(Line,Shape),Line.prototype.process=function(){var ctx=this.ctx;ctx.beginPath(),ctx.moveTo(this._sx,this._sy),ctx.lineTo(this._ex,this._ey)},Line.prototype.setOriginX=function(ox){return Shape.prototype.setOriginX.call(this,ox),this._ex=this.ex-ox,this},Line.prototype.setOriginY=function(oy){return Shape.prototype.setOriginY.call(this,oy),this._ey=this.ey-oy,this},Line.prototype.getEndX=function(){return this.ex},Line.prototype.setEndX=function(ex){return this.ex=ex,this._ex=ex-this.ox,this},Line.prototype.getEndY=function(){return this.ey},Line.prototype.setEndY=function(ey){return this.ey=ey,this._ey=ey-this.oy,this},Line.prototype.setEnd=function(ex,ey){return this.setEndX(ex).setEndY(ey)},Utils.inheritPrototype(BezierLine,Line),BezierLine.prototype.process=function(){var ctx=this.ctx;ctx.beginPath(),ctx.moveTo(this._sx,this._sy),void 0===this.cp1x?ctx.lineTo(this._ex,this._ey):void 0===this.cp2x?ctx.quadraticCurveTo(this._cp1x,this._cp1y,this._ex,this._ey):ctx.bezierCurveTo(this._cp1x,this._cp1y,this._cp2x,this._cp2y,this._ex,this._ey)},BezierLine.prototype.setOriginX=function(ox){return Line.prototype.setOriginX.call(this,ox),this._cp1x=this.cp1x-ox,this._cp2x=this.cp2x-ox,this},BezierLine.prototype.setOriginY=function(oy){return Line.prototype.setOriginY.call(this,oy),this._cp1y=this.cp1y-oy,this._cp2y=this.cp2y-oy,this},BezierLine.prototype.getControlPoint1X=function(){return this.cp1x},BezierLine.prototype.setControlPoint1X=function(cp1x){return this.cp1x=cp1x,this._cp1x=cp1x-this.ox,this},BezierLine.prototype.getControlPoint1Y=function(){return this.cp1y},BezierLine.prototype.setControlPoint1Y=function(cp1y){return this.cp1y=cp1y,this._cp1y=cp1y-this.oy,this},BezierLine.prototype.setControlPoint1=function(cp1x,cp1y){return this.setControlPoint1X(cp1x).setControlPoint1Y(cp1y)},BezierLine.prototype.getControlPoint2X=function(){return this.cp2x},BezierLine.prototype.setControlPoint2X=function(cp2x){return this.cp2x=cp2x,this._cp2x=cp2x-this.ox,this},BezierLine.prototype.getControlPoint2Y=function(){return this.cp2y},BezierLine.prototype.setControlPoint2Y=function(cp2y){return this.cp2y=cp2y,this._cp2y=cp2y-this.oy,this},BezierLine.prototype.setControlPoint2=function(cp2x,cp2y){return this.setControlPoint2X(cp2x).setControlPoint2Y(cp2y)},Utils.inheritPrototype(Edge,Line),Edge.prototype.process=function(){var oy,r,endAngle,ctx=this.ctx,ox=this._sx,sy=this._sy,ex=this._ex,ey=this._ey,cx=(ox+ex)/2,cy=(sy+ey)/2,startAngle=ex-ox,ty=ey-sy,anti=(isNaN(this._ax)?ex+startAngle:this._ax)-ex,angle=(isNaN(this._ay)?ey+ty:this._ay)-ey,centerAngleDouble=Math.sqrt(startAngle*startAngle+ty*ty),ratio=this._ratio=this.el/centerAngleDouble/2,pclx=startAngle*ratio,pcly=ty*ratio;this._angle=Math.atan2(ty,startAngle),ctx.beginPath(),ctx.moveTo(ox,sy),startAngle*angle-ty*anti>>0&&ratio<.5?(this._anchorAngle=Math.atan2(angle,anti),angle=ox-(ox=((r=-anti*ex-angle*ey)*ty-(oy=-startAngle*cx-ty*cy)*angle)/(endAngle=startAngle*angle-anti*ty)),anti=sy-(oy=(oy*anti-r*startAngle)/endAngle),endAngle=ty/centerAngleDouble*(r=Math.sqrt(angle*angle+anti*anti)),ty=-startAngle/centerAngleDouble*r,startAngle=Math.atan2(anti,angle),centerAngleDouble=2*this._angle-Math.PI,anti=!1,((angle=this._anchorAngle-this._angle)>Math.PI||angle<0&&angle>-Math.PI)&&(endAngle*=-1,ty*=-1,centerAngleDouble+=2*Math.PI,anti=!0),this._tx=endAngle+ox,this._ty=ty+oy,0==ratio?ctx.arc(ox,oy,r,startAngle,centerAngleDouble-startAngle,anti):(endAngle=Math.atan2(ty-pcly,endAngle-pclx),ctx.arc(ox,oy,r,startAngle,endAngle,anti),ctx.moveTo(ex,ey),ctx.arc(ox,oy,r,centerAngleDouble-startAngle,centerAngleDouble-endAngle,!anti))):(this._anchorAngle=this._angle,this._tx=cx,this._ty=cy,0==ratio||.5<=ratio||(ctx.lineTo(cx-pclx,cy-pcly),ctx.moveTo(cx+pclx,cy+pcly)),ctx.lineTo(ex,ey))},Edge.prototype.setOriginX=function(ox){return Line.prototype.setOriginX.call(this,ox),this._ax=this.ax-ox,this},Edge.prototype.setOriginY=function(oy){return Line.prototype.setOriginY.call(this,oy),this._ay=this.ay-oy,this},Edge.prototype.getAnchorX=function(){return this.ax},Edge.prototype.setAnchorX=function(ax){return this.ax=ax,this._ax=ax-this.ox,this},Edge.prototype.getAnchorY=function(){return this.ay},Edge.prototype.setAnchorY=function(ay){return this.ay=ay,this._ay=ay-this.oy,this},Edge.prototype.setAnchor=function(ax,ay){return this.setAnchorX(ax).setAnchorY(ay)},Edge.prototype.getEmptyLength=function(){return this.el},Edge.prototype.setEmptyLength=function(el){return this.el=el,this},Edge.prototype.getTargetX=function(){return this._tx},Edge.prototype.getTargetY=function(){return this._ty},Edge.prototype.getAnchorAngle=function(){return this._anchorAngle},Edge.prototype.getAngle=function(){return this._angle},Edge.prototype.ratioInRange=function(){return this._ratio<.5},Utils.inheritPrototype(Triangle,Shape),Triangle.prototype.process=function(){var ctx=this.ctx,pacy=this.length,cx=this._sx-pacy*this._cos,cy=this._sy-pacy*this._sin,pacx=pacy*this._tan*this._sin,pacy=-pacy*this._tan*this._cos;ctx.beginPath(),ctx.moveTo(cx+pacx,cy+pacy),ctx.lineTo(this._sx,this._sy),ctx.lineTo(cx-pacx,cy-pacy),this.closed&&ctx.closePath()},Triangle.prototype.getLength=function(){return this.length},Triangle.prototype.setLength=function(length){return this.length=length,this},Triangle.prototype.getAngle=function(){return this.angle},Triangle.prototype.setAngle=function(angle){return angle=Math.abs(angle)%Math.PI,this.angle!==angle&&(this.angle=angle,this._tan=Math.tan(angle/2)),this},Utils._assign(Triangle,Ellipse,"getRotation","setRotation"),Triangle.prototype.getClosed=function(){return this.closed},Triangle.prototype.setClosed=function(closed){return this.closed=closed,this},Utils.inheritPrototype(Pin,Triangle),Pin.prototype.process=function(){var ctx=this.ctx,pacy=this.length,cx=this._sx-pacy*this._cos,cy=this._sy-pacy*this._sin,mac=pacy*this._tan,moc=mac*this._tan,pacx=mac*this._sin,pacy=-mac*this._cos;ctx.beginPath(),ctx.moveTo(cx+pacx,cy+pacy),ctx.lineTo(this._sx,this._sy),ctx.lineTo(cx-pacx,cy-pacy),this.closed&&ctx.arc(cx-moc*this._cos,cy-moc*this._sin,Math.sqrt(mac*mac+moc*moc),(Math.PI-this.angle)/2+this.rotation,(this.angle-Math.PI)/2+this.rotation,!1)},Utils.inheritPrototype(Poly,Shape),Poly.prototype.process=function(){var i,ctx=this.ctx,sx=this._sx,sy=this._sy,points=this.points;for(ctx.beginPath(),ctx.moveTo(sx+points[0],sy+points[1]),i=2;ipoints.length&&(cpoints.length=points.length,pointsChanged=!0),cache.get("length")!==length&&(cache.set("length",length),this._processedPoints.length=length,this._transformedPoints.length=length,lengthChanged=!0),cache.get("_sx")===this._sx&&cache.get("_sy")===this._sy||(cache.set("_sx",this._sx),cache.set("_sy",this._sy),sxyChanged=!0),(paramsChanged=pointsChanged||lengthChanged||sxyChanged||paramsChanged)&&this._processPoints(),cache.get("ox")===this.ox&&cache.get("oy")===this.oy||(cache.set("ox",this.ox),cache.set("oy",this.oy),cxyChanged=!0),!matrixChanged&&!paramsChanged&&!cxyChanged},PolyShape.prototype._paramsChanged=function(){return!1},PolyShape.prototype._setTransform=function(){if(this._resetTransform()._useCache())return this;var i,x,y,mat=this.mat,processedPoints=this._processedPoints,transformedPoints=this._transformedPoints,m11=mat.getM11(),m12=mat.getM12(),m21=mat.getM21(),m22=mat.getM22(),m41=mat.offsetX+this.ox,m42=mat.offsetY+this.oy;if(1!==m11||1!==m22||0!==m12||0!==m21)for(i=0;i