Prototype of Draw and Guess Game

https://github.com/fanqingsong/draw_guess

based on django_channels_chat_official_tutorial_react project, create draw and guess game feature. draw page: when you are painting on this page

guess page: guesser can watch the drawing lively.

https://github.com/tbolis/react-sketch

Sketch Tool for React-based applications, backed up by FabricJS

http://tbolis.github.io/showcase/react-sketch/

https://github.com/tbolis/react-sketch/blob/master/examples/main.jsx

底層實作使用 fabric.js

https://github.com/fabricjs/fabric.js

Fabric.js is a framework that makes it easy to work with HTML5 canvas element. It is an interactive object model on top of canvas element. It is also an SVG-to-canvas parser. Using Fabric.js, you can create and populate objects on canvas; objects like simple geometrical shapes — rectangles, circles, ellipses, polygons, or more complex shapes consisting of hundreds or thousands of simple paths. You can then scale, move, and rotate these objects with the mouse; modify their properties — color, transparency, z-index, etc. You can also manipulate these objects altogether — grouping them with a simple mouse selection.

http://fabricjs.com/demos/

http://fabricjs.com/fabric-intro-part-1

https://ant.design/components/typography-cn/

出處：http://www.cnblogs.com/lightsong/

本文版權歸作者和部落格園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接配接。