• Stars
    star
    176
  • Rank 215,923 (Top 5 %)
  • Language Vue
  • License
    MIT License
  • Created about 1 year ago
  • Updated about 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A canvas for easy sketching and replay, exportable in SVG format.

svg-drawing

A simple canvas to draw lines and replay rendered as SVG, can be exported as SVG.

Features

  • Share Share your drawing with a url that contains all the information to replay it, it's limited, see Problems. Some share examples here.
  • Brushwork The brushwork's implementation is based on perfect-freehand

Problems

  • Share limit

    The share link contains all points that you draw, because of the limitation of url length(may be different with browsers), the share info maybe lost, and info cannot be parsed.

  • Rendering problems at line intersections.

    When brushwork enabled, it will use mask to implement the effect ( which is inspired by AntFu's Animated SVG Logo ). So this problem is hard to resolve for now.

Roadmap

  • Basic Canvas, replay and export
  • Logo
  • README
  • Canvas size configuration
  • Realtime preview
    • Preview as thumbnail
    • Full screen / Original size preview
  • Replay configuration
    • Speed
    • Loop
    • Animation easing
  • Operation history
    • Undo
    • Redo
  • Pen configuration
    • Color
    • Stroke width
  • Export format
    • SVG
    • GIF (hold)
  • Brushwork support
  • Import & Export
  • Share url
  • Copy svg base64
  • Realistic pressure

More Repositories

1

ipad-cursor

● Mouse effect of iPad in browser that can be used in any framework
TypeScript
402
star
2

ssr-contributions-img

Server side rendering of Github contribution wall API
TypeScript
199
star
3

dockbar

A macOS-like dock component made with WebComponents
Vue
144
star
4

quantitative-investment-learning

使用Python进行量化投资的学习报告
86
star
5

quant-on-volume

基于成交量的股票数据分析系统
JavaScript
49
star
6

me

Personal profile
Vue
16
star
7

awesome-effects

online effects
SCSS
13
star
8

css-paper-curve

TypeScript
11
star
9

MACD-Analyze

Python 对 MACD 的计算以及相关投资策略的分析
Python
9
star
10

calliplat-wx-miniPrpgram

社区类微信小程序全栈
PHP
8
star
11

stock-price-num-score

根据《胡立阳股票投资100招》给股票打分的盈利率
Python
5
star
12

ui-collection

Collection of UI/UX,Practice With CSS(3) / Less, Basing On Vue.js
Vue
5
star
13

clock-clock-white

Awesome clock
Vue
5
star
14

noise-maker

Simple svg noise generator
Vue
5
star
15

electron-hero-window-demo

window expansion animation hack with electron
TypeScript
5
star
16

line-of-ma

'老太太炒股法', 一根均线打天下, 利用Python根据均线分析这一策略的可行性
Python
4
star
17

stock-cci

计算股票的cci, 判断cci指标的可行性
Python
2
star
18

CatsJuice

2
star
19

netease-stock-day-line

Python爬虫抓取网易财经日线
Python
2
star
20

eastmoney-yaowen-keyword

Python抓取东方财富要闻的热点词
Python
2
star
21

stock-volume-analyze

Python 量化投资之对分时数据中换手量的分析
Python
1
star
22

python-quantitative-investment

基于python的量化投资学习
Python
1
star
23

low-switch-hand-rate

Python对低换手率股票在脱离低换手率后股价的分析
Python
1
star
24

utils

TypeScript
1
star
25

optional-clip

A web-component to implement css overflow:hidden in specific side
TypeScript
1
star