motivation鍦ㄥ叕鍙告煇娆″懆浼氫笂锛屾姳鎬ㄦ煇娆句骇鍝佹樉绀洪紶鏍囪建杩圭殑鏁堟灉姣旇緝鎶借薄锛氫綘鍙互鐪嬪埌鏄Е鍙憁ousemove浜嬩欢鏃跺疄鐜扮殑鍧愭爣鐢遍暱瀹戒笉涓€鐨勭煩褰㈣繛鎺ワ紝鍥犳杩炴帴澶勬湁鏄庢樉鐨勨€滄柇瑁傗€濓紝鏁翠釜杞ㄨ抗骞朵笉骞虫粦锛屽叾瀹藉害鍜岄€忔槑搴︾殑鈥滄搴︹€濅篃姣旇緝鐢熺‖锛屾柇灞傛槑鏄俱€傝€屾垜鐞嗘兂涓殑榧犳爣杞ㄨ抗搴旇鏄繖鏍风殑锛氭暣涓建杩规槸涓€鏉℃瘮杈冨钩婊戠殑鏇茬嚎锛屼腑闂翠笉搴旇鏈夌敓纭殑鈥滄柇鐐光€濓紝杞ㄨ抗鐨勫搴﹀拰閫忔槑搴﹀彉鍖栧潎鍖€銆傚綋鏃惰寰楄繖涔堢畝鍗曠殑鏁堟灉搴旇鍙互瀹屽杽锛屼笉浼氳姳澶氬皯鏃堕棿銆傜劧鑰岋紝涓€涓懆鏈殑涓崍锛屾鍦ㄦ礂纰楃殑鎴戯紝绐佺劧鐏靛厜涓€闂殑娑屼笂蹇冨ご銆傛垜鎰忚瘑鍒帮紝瑕佸湪webcanvas涓婂疄鐜颁竴涓€滃畬缇庘€濈殑榧犳爣杞ㄨ抗鏁堟灉锛屼技涔庡苟娌℃湁鎯宠薄涓偅涔堢畝鍗曘€傛墍浠ユ垜鍐冲畾鑷繁灏濊瘯涓€涓嬶紝杩欎釜椤圭洰灏辫癁鐢熶簡銆傛墍璋撯€滄病鏈夋兂璞＄殑閭ｄ箞绠€鍗曗€濓紝涓昏鏄负浜嗚В鍐宠繖浜涢棶棰橈細閫氳繃mousemove浜嬩欢寰楀埌鐨勯紶鏍囪建杩规槸绂绘暎鐨勫潗鏍囩偣锛岃€屼笉鏄湡瀹炵殑杞ㄨ抗鏇茬嚎銆傚浣曢€氳繃绂绘暎鍧愭爣缁樺埗骞虫粦鏇茬嚎锛熼紶鏍囪建杩圭殑閫忔槑搴﹀簲璇ユ槸娓愬彉鐨勩€俉eb鐢诲竷涓嶆彁渚涘湪璺緞涓婂埗浣滅嚎鎬ф笎鍙樼殑鐣岄潰銆傚浣曞疄鐜拌繖绉嶆晥鏋滐紵榧犳爣杞ㄨ抗鐨勭矖缁嗕篃搴旇鏄笎鍙樼殑锛寃ebcanvas涓婄殑鍗曚竴璺緞娌℃湁鎻愪緵鐢荤瑪绮楃粏娓愬彉鐨勬帴鍙ｃ€傚浣曞疄鐜拌繖绉嶆晥鏋滐紵鏂规濡備綍閫氳繃绂绘暎鍧愭爣缁樺埗骞虫粦鏇茬嚎锛熷鏋滀綘鐢ㄨ繃Photoshop涓殑閽㈢瑪宸ュ叿锛岀瓟妗堝叾瀹炲緢绠€鍗曪紝鐢ㄨ礉濉炲皵鏇茬嚎銆侾hotoshop涓殑閽㈢瑪宸ュ叿瀹為檯涓婃槸涓€涓礉濉炲皵鏇茬嚎缂栬緫鍣ㄣ€傞€氳繃璧风偣銆佺粓鐐瑰拰涓や釜鎺у埗鐐癸紝鍙互鍦ㄨ捣鐐瑰拰缁堢偣涔嬮棿寤虹珛涓€鏉℃洸绾裤€傝€屽鏋滀竴涓腑闂寸偣涓婄殑涓や釜鎺у埗鐐规弧瓒充竴瀹氱殑瑙勫垯锛屽氨鍙互瀹炵幇鏇茬嚎鐨勮繛缁€э紝鍗宠瑙夋晥鏋滅殑骞虫粦搴︺€傛湁鍏磋叮鐨勫彲浠ラ槄璇汇€婄敤閽㈢瑪宸ュ叿缁樺浘銆嬩腑鐨勫唴瀹广€傞偅涔堜腑鐐逛笂鐨勪袱涓帶鍒剁偣婊¤冻浠€涔堟牱鐨勮寰嬫墠鑳藉疄鐜版洸绾跨殑杩炵画鎬у憿锛熷叾瀹炰篃寰堢畝鍗曪紝灏辨槸涓棿鐐瑰拰涓や釜鎺у埗鐐瑰湪鍚屼竴鏉＄洿绾夸笂銆傚涓嬪浘锛岄紶鏍囩粡杩嘇銆丅銆丆鐐癸紝姝ゆ椂B鐐逛笌鍏朵袱涓帶鍒剁偣C1銆丆2鍦ㄥ悓涓€鏉＄洿绾夸笂锛屾暣鏉℃洸绾垮湪B鐐瑰鏄钩婊戠殑銆傛暟鐞嗛€昏緫涔熷緢绠€鍗曘€備笁鐐瑰湪鍚屼竴鏉＄洿绾夸笂鎰忓懗鐫€B鐐瑰湪C1鏂瑰悜鍜孋2鏂瑰悜鐨勬枩鐜囩浉鍚岋紝鎵€浠ユ洸绾挎槸骞虫粦鐨勩€傞偅涔堬紝鍦ㄥ凡鐭銆丅銆丆鍧愭爣鐨勬儏鍐典笅锛屽浣曡绠楀悇鐐圭殑鎺у埗鐐瑰憿锛熶竴涓畝鍗曠殑鏂规硶濡備笅锛氳绠楄p1-pt-p2鐨勮骞冲垎绾匡紝閫氳繃鐐筽t鐨勮骞冲垎绾跨殑鍨傜嚎c1-pt-c2鍙杙1鍜宲2鍦╟1-pt-c2涓婄殑鎶曞奖鐐逛腑璺濈pt杈冭繎鐨刢2鐐瑰彇c1-pt-c2涓婄殑c1鐐癸紝c1鐐逛笌c2鐐圭浉瀵逛簬pt瀵圭О銆傛鏃跺皢璁＄畻鍑虹殑鐐筩1鍜宑2浣滀负鐐筽t鐨勬帶鍒剁偣锛屽彲浠ヤ骇鐢熷緢濂界殑鏁堟灉銆傚悓鏃禼1銆乧2鍒扮偣pt鐨勮窛绂讳篃鍙互鐢ㄤ竴涓紶鍔涘弬鏁版潵璋冩暣锛屼粠鑰岃揪鍒拌皟鏁存洸绾垮钩婊戝害鐨勬晥鏋溿€傚浣曞湪鏇茬嚎涓婂疄鐜板搴︽搴︼紵棣栧厛锛孋anvasRenderingContext2D鐨凙PI闆嗗湪鎻忚竟璺緞鏃舵病鏈夋彁渚涙笎鍙樼敾绗斿搴︾殑鎺ュ彛銆備篃灏辨槸璇达紝濡傛灉鍙娇鐢╞ezierCurveTo鍜宻troke杩欎袱涓帴鍙ｏ紝鏄病鍔炴硶杈惧埌鏂囩珷寮€澶存墍璇寸殑閭ｇ鈥滃畬缇庘€濈殑銆傞紶鏍囪建杩广€傝В鍐宠繖涓棶棰樼殑涓€绉嶆柟娉曟槸灏嗚矾寰勫彉鎴愬舰鐘躲€傜畝鍗曠殑璇达紝涓€鏉℃湁瀹藉害鐨勮礉濉炲皵鏇茬嚎琚湅鍋氭槸涓ゆ潯鏇茬嚎鍜屼袱鏉＄洿绾垮洿鎴愮殑鍥惧舰锛氫腑闂寸殑榛戣壊鏇茬嚎鐢ㄧ敾绗斿埛浜嗕竴涓搴︿箣鍚庯紝鍏跺疄鍜岀孩鑹插尯鍩熸槸涓€鏍风殑濉厖鍚庣殑鏁堟灉鏄竴鏍风殑锛屽彨鍋氭妸璺緞鍙樻垚褰㈢姸銆傝繖鏍凤紝鎴戜滑灏卞彲浠ユ牴鎹渶瑕佽皟鏁寸孩鑹茬嚎妗嗙殑褰㈢姸锛屽疄鐜扮湅璧锋潵鐢荤瑪瀹藉害閫愭笎鍙樺寲鐨勬洸绾裤€傝嚦浜庤繖涓嚎妗嗘槸鎬庝箞璁＄畻鐨勶紝杩欓噷灏变笉灞曠ず浜嗐€傚浣曞湪鏇茬嚎涓婂疄鐜伴€忔槑搴︽搴︼紵鍚屾牱锛孋anvasRenderingContext2DAPI闆嗗湪鎻忚竟璺緞鎴栧～鍏呭尯鍩熸椂涓嶆彁渚涙笎鍙樼敾绗旈€忔槑搴︾殑鎺ュ彛銆傝繖鏃跺€欏氨寰楃敤鈥滃垎鍓测€濈殑鏂规硶鏉ユā鎷熶竴涓笎鍙樻晥鏋溿€備篃灏辨槸璇村鏋滄湁涓€鏉℃洸绾垮湪缁樺埗鐨勬椂鍊欓渶瑕佹妸绗斿埛鐨勯€忔槑搴︿粠1鍙樻垚0锛屾垜浠妸杩欐潯鏇茬嚎鍒嗘垚100鏉℃洸绾挎渚濇缁樺埗锛岀粯鍒惰繖浜涙鏃朵娇鐢ㄧ殑閫忔槑搴︽槸閫愭笎鍙樺寲鐨勶紝杩欐牱灏卞彲浠ュ湪瑙嗚涓婂疄鐜伴€忔槑搴︽笎鍙樼殑鏁堟灉銆傚涓婂浘鎵€绀猴紝鎴戜滑鍙互鍦ㄤ竴鏉¤礉濉炲皵鏇茬嚎涓婅绠楀嚭鑻ュ共涓偣锛屽埄鐢ㄨ繖浜涚偣灏嗘洸绾垮垎鎴愬鏉℃洸绾匡紝鐒跺悗璧嬩簣姣忔潯鏇茬嚎涓嶅悓鐨勯€忔槑搴︼紝杩欐牱灏卞彲浠ュ湪瑙嗚涓婂疄鐜扮被浼奸€忔槑鐨勬晥鏋滃潯搴︺€備絾鏄粏蹇冪殑鍚屽鑲畾浼氬彂鐜伴棶棰樸€備笂鍥句腑鍒嗗壊鐐逛箣闂寸殑璺濈涓嶅悓锛岃繖閲屾秹鍙婂埌鍙︿竴涓蹇碉細uniformBeziercurve銆備笁娆¤礉濉炲皵鏇茬嚎鐨勫叕寮忓涓嬶細閭ｄ箞濡傛灉鎴戜滑璁╄緭鍏ワ紝鍗硉鍦╗0,1]涓婂寑閫熷彉鍖栵紝寰楀埌鐨勫€兼槸涓嶅潎鍖€鐨勶紝鍗崇┖蹇冨渾涔嬮棿鐨勮窛绂讳笂鍥句腑鏄笉鍚岀殑銆備絾鏄绠楀潎鍖€鍒掑垎璐濆灏旀洸绾跨殑鐐规槸闈炲父楹荤儲鐨勶紝寰€寰€闇€瑕佽凯浠ｈ绠楁墠鑳藉緱鍒颁竴涓繎浼煎€笺€備絾鏄紝鍗充娇閲囩敤绠€鍗曠殑鍒嗗壊鏂规硶锛屽彧瑕佸垎鍓茬殑鏁伴噺瓒冲澶э紝姣斿50娈碉紝浜虹溂鍑犱箮鐪嬩笉鍑洪€忔槑搴﹀彉鍖栦笉鍧囧寑锛屾墍浠ヤ笉闇€瑕佽绠楀潎鍖€鍒嗗壊瀹為檯浣跨敤鍦烘櫙鐐广€傚彟澶栵紝鍒嗗壊鐨勬柟娉曚篃鍙互瑙ｅ喅涓婇潰瀹藉害娓愬彉鐨勯棶棰樸€傚皢鏇茬嚎鍒嗘垚鍑犳锛屽苟涓烘瘡娈垫寚瀹氫笉鍚岀殑绾垮銆傛洸绾跨殑瀹藉害浼间箮鍧囧寑鍙樺寲銆備笂杩拌绠楁洸绾胯竟鐣岀殑鏂规硶閫熷害鏇村揩銆傛€荤粨涓€涓嬬浉鍏充唬鐮侊紝鎴戝凡缁忔墦鍖呮垚涓€涓猲pm鍖咃細laser-pen锛屾杩庡紑濮嬶紝issue锛屾病浜媝r娲楃銆傝涓嶅畾浼氭湁鎰忔兂涓嶅埌鐨勬敹鑾佛煒?/p>
