• Stars
    star
    181
  • Rank 212,110 (Top 5 %)
  • Language Vue
  • License
    MIT License
  • Created over 1 year ago
  • Updated 4 months 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
425
star
2

ssr-contributions-img

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

dockbar

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

quantitative-investment-learning

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

quant-on-volume

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

masonry-flow

A React/Vue component to render masonry layout
TypeScript
28
star
7

me

Personal profile
Vue
16
star
8

awesome-effects

online effects
SCSS
13
star
9

css-paper-curve

TypeScript
11
star
10

MACD-Analyze

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

calliplat-wx-miniPrpgram

社区类微信小程序全栈
PHP
9
star
12

stock-price-num-score

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

ui-collection

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

line-of-ma

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

clock-clock-white

Awesome clock
Vue
5
star
16

noise-maker

Simple svg noise generator
Vue
5
star
17

electron-hero-window-demo

window expansion animation hack with electron
TypeScript
5
star
18

stock-cci

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

CatsJuice

2
star
20

netease-stock-day-line

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

eastmoney-yaowen-keyword

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

low-switch-hand-rate

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

stock-volume-analyze

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

python-quantitative-investment

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

utils

TypeScript
1
star
26

optional-clip

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