鍓嶈█涓婂懆鍏紝缇ゅ弸@鎴戣Gitee鐨勫弽棣堟ā鍧楁坊鍔犱簡鎴浘鍔熻兘锛屾垜鍘讳綋楠屼簡涓€涓嬶紝鍙戠幇浠栦滑鐢ㄧ殑鏄垜鐨勬彃浠娥煒侊紝杩欑瘒鏂囩珷灏卞垎浜繖涓彃浠朵笌鎮ㄤ竴璧凤紝娆㈣繋鎵€鏈夋劅鍏磋叮鐨勫紑鍙戣€呴槄璇绘湰鏂囥€傛彃浠跺湴鍧€鍙婂疄鐜板師鐞嗘湰鎻掍欢閲囩敤鍘熺敓js瀹炵幇锛屽彲浠ラ泦鎴愬湪浠讳綍web椤圭洰涓€傛彃浠秐pm鍦板潃鍜孏itHub鍦板潃璇风Щ姝ワ細js-screen-shot(npm)js-screen-shot(GitHub)鎻掍欢瀹炵幇鍘熺悊璇风Щ姝ワ細瀹炵幇web绔嚜瀹氫箟鎴睆瀹炵幇web绔嚜瀹氫箟鎴睆锛圝S鐗堬級鍦ㄧ嚎浣撻獙鏈彃浠讹紝鍙埌鎴戠殑寮€婧愰」鐩亰澶╃郴缁熶綋楠岋紝鎻掍欢杩愯鏁堟灉瑙嗛璇风Щ鑷硍eb绔嚜瀹氫箟鎴睆鍔熻兘-鏁堟灉瑙嗛銆傛湀鍒濓紝Gitee鐨勪骇鍝佺粡鐞嗗湪鎺橀噾鐪嬪埌鎴戠殑鎴浘鎻掍欢js-screen-shot锛岃寰楄繕涓嶉敊銆備粬浠渶杩戝湪鍋氳繖涓姛鑳斤紝鎵€浠ヤ粬浠墦绠楃洿鎺ラ泦鎴愭垜鐨勬彃浠躲€備笌鎴戞矡閫氱増鏉冪浉鍏充簨瀹溿€傛矡閫氬畬鎴愬悗锛屼粬闂垜瑕佷笉瑕佹妸鎻掍欢涔熸斁涓€浠藉湪Gitee涓婏紝璁╂垜鎺ㄨ崘缁欐垜銆傛垜姣笉鐘硅鲍鐨勬姳浜嗗ぇ鑵匡紝鎶婃彃浠舵惉杩囨潵锛屽緱鍒颁簡涓€娉㈤椤垫帹鑽愷煒侴itee鐨勫弽棣堟ā鍧楅渶瑕佺櫥褰曞悗锛岀偣鍑婚〉闈㈠彸渚х殑鍙戦€佸弽棣堝浘鏍囥€備竴浜涘奖鍝嶄綋楠岀殑灏忛棶棰樹笂鍛ㄤ簩锛屾湁缃戝弸浠嶨itHub杩囨潵锛屽姞浜嗘垜寰俊锛屽鎴戠殑鎻掍欢鎻愪簡涓や釜闂銆傚洜涓哄钩鏃舵病鏃堕棿澶勭悊杩欎簺闂锛屾墦绠楀懆鏈鐞嗘彃浠堕棶棰樸€傛暣鐞嗘湁鏁坕ssue鏃堕棿鍥炲埌涓婂懆鍏棭涓婏紝鎵撳紑GitHub鐪嬩簡涓€涓媔ssues锛屽ソ涔呮病鐪嬬殑issues鏈?9涓€傜粡杩囦竴鐣暣鐞嗭紝鍘婚櫎浜嗕竴浜涙棤鐢ㄧ殑鍜屼慨鏀硅繃鐨勶紝鏈€缁堢‘瀹氫簡4椤癸細璋冪敤鑰呭彲浠ュ湪妗嗛€夊尯鍩熶箣澶栫粯鍒堕棶棰樻埅鍥惧尯鍩熴€?涓彲鎿嶄綔鐐圭涓€娆＄偣鍑诲伐鍏锋爮鏃跺垹闄よ鍓銆備慨澶嶈竟妗嗛€夋嫨瀹屾垚鍚庯紝榧犳爣鐐瑰嚮鎴浘宸ュ叿鏍忓叾浠栦綅缃窡闅忕Щ鍔ㄩ棶棰樺鍔犲彲閫夊弬鏁版敮鎸佸崟鍑诲叏灞忓姛鑳借В鍐抽棶棰樸€傚竷缃畬涔嬪悗锛屾帴涓嬫潵灏辨槸瑙ｅ喅闂浜嗐€傞€夋嫨鍖哄煙澶栫殑缁樺埗闂涓€鑸儏鍐典笅锛屾埅鍥惧尯鍩熷缓绔嬪悗锛岀敤鎴蜂細鍦ㄨ鍓鍖哄煙鍐呯粯鍒讹紝鎵€浠ユ垜娌℃湁鑰冭檻杩欑杈圭晫鎯呭喌浠itee鐨勫弽棣堟ā鍧椾负渚嬶紙gitee鐩墠浣跨敤鎴戠殑鑰佺増鏈殑鎻掍欢锛岃偗瀹氭湁杩欎釜闂锛夛紝濡備笅鍥撅紝鎴戜滑鐢荤殑鍥涗釜绾㈡閮借秴鍑轰簡瑁佸壀妗嗭細瑙ｅ喅瀹炵幇鎬濊矾鐨勯棶棰樻瘮杈冪畝鍗曪紝瑁佸壀妗嗗凡缁忕敾濂戒簡锛屽叾鍧愭爣淇℃伅宸茬煡銆傜粯鍥炬椂锛屾垜浠彧闇€瑕佸垽鏂綋鍓嶉紶鏍囦綅缃槸鍚﹁秴鍑鸿鍓鐨勫潗鏍囩偣鍖哄煙鍗冲彲銆傞儴鍒嗗疄鐜颁唬鐮佸涓嬶細//鑾峰彇瑁佸壀妗嗙殑浣嶇疆淇℃伅constcutBoxPosition=this.data.getCutOutBoxPosition();//缁樺浘宸ュ叿璧峰x銆亂鍧愭爣涓嶈兘灏忎簬瑁佸壀妗嗚捣濮嬪潗鏍?/缁樺浘宸ュ叿瑁佸壀妗嗚捣濮媥銆亂鍧愭爣涓嶈兘澶т簬瑁佸壀妗嗙粨鏉熷潗鏍?/褰撳墠榧犳爣鐨剎鍧愭爣涓嶈兘灏忎簬瑁佸壀妗嗙殑璧峰x鍧愭爣锛屼笉鑳藉ぇ浜庤鍓鐨勭粨鏉熷潗鏍?/褰撳墠榧犳爣鐨剏鍧愭爣涓嶈兘灏忎簬瑁佸壀妗嗚捣鐐箉鍧愭爣涓嶈兘澶т簬瑁佸壀妗嗙粨鏉熷潗鏍噂etDrawBoundaryStatus鍑芥暟鐨勫疄鐜板涓嬶細/***鑾峰彇宸ュ叿鏍忓伐鍏稡oundary缁樺埗鐘舵€?@paramstartXx杞寸粯鍒惰捣鐐?@paramstartYy杞寸粯鍒惰捣鐐?@paramcutBoxPosition瑁佸壀妗嗕綅缃俊鎭?/瀵煎嚭鍑芥暟getDrawBoundaryStatus(startX:number,startY:number,cutBoxPosition:positionInfoType):boolean{if(startXcutBoxPosition.startX+cutBoxPosition.width||startY>cutBoxPosition.startY+cutBoxPosition.height){//鏃犳硶缁樺埗returnfalse;}//candrawreturntrue;}鍏蜂綋浠ｇ爜璇蜂竴姝ユ鎻愪氦璁板綍锛氫慨澶嶏細淇鎻掍欢璋冪敤鑰呭彲浠ュ湪妗嗛€夊尯鍩熷缁樺埗鐨勯棶棰樸€傚疄鐜板悗鏁堟灉濡備笅锛氬伐鍏锋爮闅忛紶鏍囩Щ鍔ㄧ殑闂锛屽伐鍏锋爮娌℃湁琚偣鍑伙紝褰撻紶鏍囩偣鍑诲彟涓€涓綅缃椂锛屾埅鍥惧伐鍏锋爮浼氶噸鏂拌绠楅紶鏍囩殑浣嶇疆銆備笅闈㈢户缁互Gitee涓轰緥锛屽涓嬪浘锛氬疄鐜版€濊矾褰撻紶鏍囧乏閿姮璧锋椂锛屽鏋滃伐鍏锋爮杩樻病鏈夎鐐瑰嚮锛屼細鏍规嵁褰撳墠榧犳爣鐨勪綅缃粨鍚堣鍓鐨勫ぇ灏忕‘瀹氬睆骞曟埅鍥惧伐鍏锋爮鐨勪綅缃€傜敤鎴峰彧闇€鍗曞嚮瑁佸壀妗嗗尯鍩熺殑浠绘剰浣嶇疆锛屽伐鍏锋爮灏变細鐩稿簲绉诲姩銆傝В鍐宠繖涓棶棰樹篃寰堢畝鍗曪紝鎴戜滑鍙渶瑕佸湪榧犳爣绉诲姩鐨勬椂鍊欏姞涓婁竴涓爣璇嗭紝鍦ㄩ紶鏍囨姮璧风殑鏃跺€欏垽鏂繖涓爣璇嗘槸鍚︿负鐪熴€傞儴鍒嗕唬鐮佸涓嬶細//榧犳爣鎷栧姩鐘舵€乸rivatedragFlag=false;//榧犳爣绉诲姩浜嬩欢privatemouseMoveEvent=(event:MouseEvent)=>{//褰撳伐鍏锋爮鏈閫変腑涓旈紶鏍囪鎸変笅鏃秈f(!this.data.getToolClickStatus()&&this.data.getDragging()){//淇敼鎷栧姩鐘舵€佷负true锛泃his.dragFlag=true;}}//榧犳爣寮硅捣浜嬩欢privatemouseUpEvent=()=>{//榧犳爣濡傛灉娌℃湁琚嫋鍔紝宸ュ叿鏍忔病鏈夎閫変腑锛屽垯宸ュ叿鏍忕殑浣嶇疆涓嶄細琚慨鏀筰f(!this.dragFlag&&!this.data.getToolClickStatus()){//鎭㈠瑁佸壀妗嗗潗鏍噒his.drawGraphPosition.startX=this.drawGraphPrevX;杩欍€俤rawGraphPosition.startY=this.drawGraphPrevY;//鏄剧ず鎴浘宸ュ叿鏍弔his.data.setToolStatus(true);杩斿洖;鍏蜂綋浠ｇ爜璇蜂竴姝ユ鎻愪氦璁板綍锛氫慨澶嶏細淇妗嗛€夋嫨瀹屾垚鍚庯紝榧犳爣鐐瑰嚮鍒版埅鍥惧伐鍏锋爮鍏朵粬浣嶇疆璺熼殢绉诲姩闂瀹炵幇鏁堟灉锛屼慨澶嶅悗鏁堟灉濡備笅锛氬垹闄?涓彲鎿嶄綔鐐广€傚幓骞村垰鍐欐埅鍥炬彃浠剁殑鏃跺€欏氨鍙戠幇浜嗚繖涓棶棰樸€傚崟鍑绘埅鍥惧伐鍏锋爮鏃讹紝涓嶅厑璁告洿鏀硅鍓銆傚鏋?涓や釜鍙搷浣滅殑鐐硅繕瀛樺湪锛屽氨鏄惧緱寰堝鎬簡銆傚綋鏃舵兂鍒扮殑鎯虫硶鏄洿鎺ユ妸妗嗙殑8涓偣鍒犳帀锛屼絾鏄繖8涓偣閮芥槸鐢诲嚭鏉ョ殑銆傛姌鑵句簡鍗婂ぉ锛屾病鏈夋壘鍒拌В鍐冲姙娉曪紝鎼佺疆浜嗐€傞棶棰樺涓嬪鍥撅細瀹炵幇鎯虫硶涓€骞村悗鐨勪粖澶╋紝鎴戠煡閬撳垹闄ら偅8涓偣鐨勬兂娉曡偗瀹氳涓嶉€氾紝浜庢槸涓€閬嶅張涓€閬嶇殑浣撻獙QQ鐨勬埅鍥撅紝骞惰瀵熶粬鏄浣曞仛鍒扮殑銆傞】鏃剁伒鏈轰竴鍔煒硷紝鏃㈢劧鏈変簡瑁佸壀妗嗙殑鍧愭爣鍜屽昂瀵镐俊鎭紝鎴戝氨鍙互閲嶇敾瑁佸壀妗嗕簡銆傝鍓鍛ㄥ洿鐨?涓彲鎿嶄綔鐐瑰垹闄ゅ悗锛屾垜鍙互鍦ㄧ敓鎴愬浘鍍忔椂鍒犻櫎杩?涓偣杩涜浼樺寲銆傝绠楅€昏緫锛屽鑷磋寖鍥翠笉鍑嗙‘鐨勯棶棰橈紝浠庤€岃揪鍒板畬缇庢埅鍥鹃儴鍒嗙殑瀹炵幇浠ｇ爜濡備笅锛?/宸ュ叿鏍忚繕娌℃湁琚偣鍑伙紝褰撳墠鏄涓€娆＄偣鍑伙紝閲嶆柊缁樺埗涓€涓病鏈夊儚绱犵殑瑁佸壀妗唅f(!data.getToolClickStatus()){//鑾峰彇瑁佸壀妗嗙殑浣嶇疆淇℃伅constcutBoxPosition=data.getCutOutBoxPosition();//寮€濮嬬粯鍒朵竴涓病鏈夊儚绱犵殑瑁佸壀妗唥false鍏蜂綋浠ｇ爜璇蜂竴姝ユ鎻愪氦璁板綍锛氫慨澶嶏細绗竴娆＄偣鍑绘埅灞忓尯鍩熷伐鍏锋爮鏃讹紝鍒犻櫎瑁佸壀妗?涓彲鎿嶄綔鐐瑰疄鐜版晥鏋滐紝瀹炵幇鐐瑰嚮鎴彇鍏ㄥ浘灞忓箷鍔熻兘銆傛嫋鏀剧敓鎴愯窇椹伅锛屽崟鍑婚紶鏍囧乏閿崟鑾锋暣涓睆骞曘€傝繖涓姹傛垜瑙夊緱寰堝浜轰笉闇€瑕侊紝鎵€浠ユ垜鎶婂畠鍋氭垚涓€涓彲閫夊弬鏁般€傚疄鐜版€濊矾涔熷緢绠€鍗曘€傚綋榧犳爣鎶捣鏃讹紝濡傛灉鍚敤浜嗙偣鍑绘埅灞忥紝鍒欏彲浠ヤ粠鍧愭爣(0,0)寮€濮嬬粯鍒朵竴涓笌鐢诲竷澶у皬鐩稿悓鐨勮鍓銆傞儴鍒嗕唬鐮佸涓嬶細//MouseLifteventprivatemouseUpEvent=()=>{if(cutBoxPosition.width===0&&cutBoxPosition.height===0&&cutBoxPosition.startX===0&&cutBoxPosition.startY===0&&!this.dragFlag&&this.clickCutFullScreen){//璁剧疆瑁佸壀妗嗕綅缃负鍏ㄥ睆this.tempGraphPosition=drawCutOutBox(0,0,this.screenShortImageController.width,this.screenShortImageController.height,this.screenShortCanvas,this.data.getBorderSize(),this.screenShortController,this.screenShortImageController)浣滀负drawCutOutBoxReturnType;}}璇锋彁浜ゅ叿浣撲唬鐮佷竴姝ユ璁板綍锛歠eat:娣诲姞鍙€夊弬鏁帮紝鏀寔鐐瑰嚮鎴睆鍔熻兘銆傛垜鏄瓟娉曠▼搴忓憳锛屽墠绔紑鍙戝伐绋嬪笀銆傚鏋滀綘瀵规垜鎰熷叴瓒ｏ紝璇峰埌鎴戠殑涓汉缃戠珯浜嗚В鏇村銆傛枃绔犲鏈夐敊璇紝娆㈣繋鍦ㄨ瘎璁哄尯鎸囨銆傚鏋滆繖绡囨枃绔犲浣犳湁甯姪锛岃鐐硅禐鍏虫敞馃槉
