@labelbee/lb-annotation 1.14.0-alpha.2 → 1.14.0-alpha.3

package/dist/core/toolOperation/LineToolOperation.js

@@ -1 +1,1434 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _=require("lodash"),tool=require("../../constant/tool.js"),ActionsHistory=require("../../utils/ActionsHistory.js"),uuid=require("../../utils/uuid.js"),keyCode=require("../../constant/keyCode.js"),MathUtils=require("../../utils/MathUtils.js"),basicToolOperation=require("./basicToolOperation.js"),LineToolUtils=require("../../utils/tool/LineToolUtils.js"),polygonTool=require("../../utils/tool/polygonTool.js"),CommonToolUtils=require("../../utils/tool/CommonToolUtils.js"),CanvasUtils=require("../../utils/tool/CanvasUtils.js"),DrawUtils=require("../../utils/tool/DrawUtils.js"),StyleUtils=require("../../utils/tool/StyleUtils.js"),AttributeUtils=require("../../utils/tool/AttributeUtils.js"),textAttributeClass=require("./textAttributeClass.js");function _interopDefaultLegacy(d){return d&&typeof d=="object"&&"default"in d?d:{default:d}}var ___default=_interopDefaultLegacy(_),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(d,t,e)=>t in d?__defProp(d,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):d[t]=e,__spreadValues=(d,t)=>{for(var e in t||(t={}))__hasOwnProp.call(t,e)&&__defNormalProp(d,e,t[e]);if(__getOwnPropSymbols)for(var e of __getOwnPropSymbols(t))__propIsEnum.call(t,e)&&__defNormalProp(d,e,t[e]);return d},__spreadProps=(d,t)=>__defProps(d,__getOwnPropDescs(t)),EStatus;(function(d){d[d.Create=0]="Create",d[d.Active=1]="Active",d[d.None=2]="None"})(EStatus||(EStatus={}));const SEGMENT_NUMBER=16,LINE_ORDER_OFFSET={x:0,y:20},POINT_RADIUS=3,POINT_ACTIVE_RADIUS=5,INNER_POINT_RADIUS=2;class LineToolOperation extends basicToolOperation.BasicToolOperation{constructor(t){super(t);this.drawActivatedLine=(e,i,s)=>{const n=___default.default.cloneDeep(this.activeLine);if(!n||n.length===0)return;const r=this.isActiveLineValid();let o;const h=this.selectedID?this.lineList.find(l=>l.id===this.selectedID):void 0;h?o=h.order:o=this.nextOrder();const a=this.getLineColorByAttribute({attribute:this.defaultAttribute,valid:!!r});n.map(l=>Object.assign(l,{actual:{x:l.x,y:l.y}},this.coordUtils.getRenderCoord(l))),this.isActive&&this.drawLineLength(n,a),this.updateActiveArea(),this.drawLine(n,e,a,!0,!0),this.drawLineNumber(n[0],o,a,"",this.defaultAttribute,r),e&&this.isCreate&&this.arc(e,POINT_RADIUS,a),this.cursor&&!this.selectedPoint&&!s&&!this.isShift&&this.arc(this.cursor,POINT_ACTIVE_RADIUS,a)},this.drawHoverPoint=e=>{if(!this.isMousedown&&e&&this.isLineSelected){const i=this.getPointList(this.activeLine),s=this.activeLine.find(r=>LineToolUtils.default.calcDistance(this.coordUtils.getRenderCoord(r),e)<=POINT_ACTIVE_RADIUS);let n;!s&&this.activeLine&&(n=this.findNearestPoint(i,e)),this.hoverPointID=s?s.id:void 0,this.cursor=s||n==null?void 0:n.point}},this.updatedLine={id:"",valid:!1,order:0},this.toolName="lineTool",this.lineList=[],this.activeLine=[],this.coordsInsideActiveArea=!1,this.hoverLineSegmentIndex=-1,this.isShift=!1,this.isReference=!1,this.selectedIDs=[],this.drawCurveLine=(e,i,s,n=!0,r=!1,o)=>{const h=polygonTool.createSmoothCurvePointsFromPointList(i,SEGMENT_NUMBER);e.save(),e.lineCap="round",e.lineJoin="round",e.strokeStyle=s.color,n&&(e.lineWidth=s.lineWidth),r&&LineToolUtils.default.setReferenceCtx(e),i.forEach(({specialEdge:a},l)=>{const u=h.splice(0,SEGMENT_NUMBER+1);e.save(),e.beginPath(),o===l&&(e.lineWidth=4),u.forEach(({x:c,y:f},g)=>{const L=g>0?"lineTo":"moveTo";a&&LineToolUtils.default.setSpecialEdgeStyle(e),e[L](c,f)}),e.stroke(),e.restore()}),e.restore()},this.drawLine=(e,i,s,n=!1,r=!1)=>{const o=i?e.concat(i):e,h={color:s,lineWidth:r?1:this.lineStyle.lineWidth};this.isCurve?LineToolUtils.default.drawCurveLine(this.ctx,o,h,!n,this.isReference,r?this.hoverLineSegmentIndex:-1):this.drawStraightLine(o,h,r),n&&e.forEach(a=>{var l,u;const c=a.id,f=c&&[this.hoverPointID,(l=this.selectedPoint)==null?void 0:l.id].includes(c)?POINT_ACTIVE_RADIUS:POINT_RADIUS;this.arc(a,f,s),[this.hoverPointID,(u=this.selectedPoint)==null?void 0:u.id].includes(c)||this.arc(a,INNER_POINT_RADIUS,"white")})},this.drawStraightLine=(e,i,s=!1)=>{const{ctx:n}=this;n&&(n.save(),n.lineCap="round",n.lineJoin="round",n.strokeStyle=i.color,n.lineWidth=i.lineWidth,this.isReference&&LineToolUtils.default.setReferenceCtx(n),e.forEach((r,o)=>{if(n.beginPath(),o>0){const h=e[o-1];n.save(),(h==null?void 0:h.specialEdge)&&LineToolUtils.default.setSpecialEdgeStyle(n),s&&this.hoverLineSegmentIndex+1===o&&(n.lineWidth=4),n.moveTo(h.x,h.y),n.lineTo(r.x,r.y),n.stroke(),n.restore()}}),n.restore())},this.drawLines=()=>{try{const e=___default.default.cloneDeep(this.attributeFilteredLines);if(this.isHidden)return;e.forEach(i=>{if(i.id!==this.selectedID&&i.pointList){i.pointList.map(h=>Object.assign(h,{actual:{x:h.x,y:h.y}},this.coordUtils.getRenderCoord(h)));const{order:s,label:n}=i,r=s,o=i&&this.getLineColorByAttribute(i);this.drawLine(i.pointList,void 0,o,!1),this.drawLineNumber(i.pointList[0],r,o,n,i.attribute,i.valid),i.id!==this.textEditingID&&(this.drawLineTextAttribute(i.pointList[1],o,i==null?void 0:i.textAttribute),this.drawLineLength(i.pointList,o))}})}catch(e){console.error(e,"\u7EBF\u6761\u5DE5\u5177\u6570\u636E\u89E3\u6790\u9519\u8BEF"),this.lineList=[],this.clearCanvas()}},this.render=e=>{super.render(),this.drawLines(),this.drawActivatedLine(e,void 0,!0),this.renderTextAttribute(),this.renderCursorLine(this.getLineColor(this.defaultAttribute))},this.moveLineInPolygon=(e,i)=>{var s;if(!Array.isArray(this.activeLine))return!1;((s=this.activeLine)==null?void 0:s.every(r=>this.isInBasicPolygon({x:r.x+e,y:r.y+i})))&&(this.lineDragging=!0,this.moveActiveArea(e,i))},this.moveLineInRectRange=(e,i,s,n)=>{if(this.activeArea===void 0)return;const{top:r,left:o,right:h,bottom:a}=this.activeArea,l=[o,h].map(v=>___default.default.isNumber(v)?v+e:0),u=[r,a].map(v=>___default.default.isNumber(v)?v+i:0),c=o>=0&&h&&MathUtils.default.isInRange(l,s),f=r>=0&&a&&MathUtils.default.isInRange(u,n),g=c?e:0,L=f?i:0;this.lineDragging=!0,this.moveActiveArea(g,L)},this.onRightClick=e=>{if(this.cursor=void 0,this.isCreate){if(this.isLinePointsNotEnough())return;this.stopLineCreating(!0);return}this.setActiveArea(this.getCoordinate(e),!0),this.emit("contextmenu")},this.updateSelectedAttributeAfterHistoryChanged=()=>{if(this.selectedID){const e=this.lineList.find(s=>s.id===this.selectedID),i=e==null?void 0:e.attribute;typeof i=="string"&&(this.defaultAttribute=i,this.updateAttribute(i),this.render())}},this.onLeftClick=e=>{const i=this.getCoordinate(e),{lineDragging:s}=this;if(this.lineDragging=!1,this.isSpaceKey)return;if(this.isNone&&e.ctrlKey){const r=this.findHoverLine(i);r&&this.setInvalidLine(r.id);return}if(this.isLinePointsExceed())return;const n=this.getNextPoint(e,i);if(this.isCreate||this.isNone){this.setCreatStatusAndAddPoint(n);return}if(this.isActive){if(s)return;if(this.isMouseCoordOutsideActiveArea()){this.setNoneStatus(!1),this.setCreatStatusAndAddPoint(n);return}if(e.shiftKey){this.updateLineSegmentSpecial(i);return}if(this.coordsInsideActiveArea&&e.ctrlKey){this.setInvalidLine(this.selectedID);return}this.addLinePointToActiveLine()}},this.onDblclick=()=>{},this.onKeyUp=e=>{if(super.onKeyUp(e),this.isShift=!1,this.hoverLineSegmentIndex=-1,e.keyCode===keyCode.Esc){this.stopLineCreating(!1);return}if(this.isActive){if(e.keyCode===keyCode.Delete){this.deleteLine();return}if(e.keyCode===keyCode.F){this.setInvalidLine(this.selectedID);return}if(e.keyCode===keyCode.Space){this.continueToEdit();return}}this.keyboardEventWhileLineCreating(e)},this.onRightDblClick=e=>{super.onRightDblClick(e);const i=this.getCoordinate(e);if(this.isActive){const s=this.findHoveredPoint(i);if(s){this.deleteSelectedLinePoint(s.id);return}this.deleteSelectedLine(i)}},this.setReference=e=>{this.isReference=e},this.pointsWithinRange=e=>!(this.lowerLimitPointNum&&e<this.lowerLimitPointNum||this.upperLimitPointNum&&e>this.upperLimitPointNum),this.setLineList=e=>{const i=e.length!==this.lineListLen;this.lineList=e,i&&this.emit("updatePageNumber")},this.textChange=e=>{this.config.textConfigurable===!1||!this.selectedID||(this.updateSelectedTextAttribute(e),this.emit("selectedChange"))},this.status=2,this.isMousedown=!1,this.lineDragging=!1,this.isLineValid=!0,this.setConfig(t.config),this.prevAxis={x:0,y:0},this.textEditingID="",this.updateSelectedTextAttribute=this.updateSelectedTextAttribute.bind(this),this.getCurrentSelectedData=this.getCurrentSelectedData.bind(this),this.actionsHistory=new ActionsHistory,this.dependToolConfig={lineType:tool.ELineTypes.Line}}get isLineSelected(){return this.selectedID&&this.activeLine}get selectedLinePoints(){return this.activeLine?this.getPointList(this.activeLine):[]}get isCreate(){return this.status===0}get isActive(){return this.status===1}get isNone(){return this.status===2}get isCurve(){return this.config.lineType===tool.ELineTypes.Curve}get isMultipleColor(){return this.config.lineColor===tool.ELineColor.MultiColor}get imageSize(){return this.rotate%180==0?this.basicImgInfo:{width:this.basicImgInfo.height,height:this.basicImgInfo.width}}get lineListLen(){return this.lineList.length}get edgeAdsorptionEnabled(){return this.edgeAdsorption&&!this.isCurve&&this.lineListLen>0}get attributeConfigurable(){return this.config.attributeConfigurable}get isTextConfigurable(){return this.config.textConfigurable}get isDependPolygon(){return this.dependToolName===tool.EToolName.Polygon}get isDependRect(){return this.dependToolName===tool.EToolName.Rect}get isCurrentAttributeLocked(){return this.attributeLockList.includes(this.defaultAttribute)}get attributeFilteredLines(){return this.attributeLockList.length>0?this.lineList.filter(t=>this.attributeLockList.includes((t==null?void 0:t.attribute)||"")):this.lineList}get enableOutOfTarget(){return this.config.enableOutOfTarget||this.config.outOfTarget||this.config.drawOutsideTarget}get showOrder(){var t;return(t=this.config.showOrder)!=null?t:this.config.isShowOrder}get edgeAdsorption(){return this.config.edgeAdsorption}get attributeList(){return this.config.attributeList}get lowerLimitPointNum(){return this.config.lowerLimitPointNum}get upperLimitPointNum(){return this.config.upperLimitPointNum}get textCheckType(){return this.config.textCheckType}get customFormat(){return this.config.customFormat}get dataList(){return this.lineList}get hasActiveLine(){return this.activeLine&&this.activeLine.length>0}get viewPortLines(){const t=CanvasUtils.getViewPort(this.canvas,this.currentPos,this.zoom);return this.isHidden?[]:this.attributeFilteredLines.filter(e=>{var i;return(i=e==null?void 0:e.pointList)==null?void 0:i.some(s=>CanvasUtils.inViewPort(s,t))})}get lineStyle(){return{lineWidth:this.style.width,color:this.getLineColor(this.defaultAttribute),opacity:this.style.opacity}}get selectedText(){var t,e;return(e=(t=this.lineList.find(i=>i.id===this.selectedID))==null?void 0:t.textAttribute)!=null?e:""}get currentPageResult(){return this.lineList}updateStatus(t,e=!1){if(t!==this.status){if(e){let i="";this.textCheckType===tool.ETextType.Order&&this.isTextConfigurable&&(i=AttributeUtils.default.getTextAttribute(this.lineList,this.textCheckType)),this.emit("updateText",i)}this.status=t,this.lineStatusChanged()}}isInBasicPolygon(t){var e,i;return polygonTool.isInPolygon(t,((e=this.basicResult)==null?void 0:e.pointList)||[],(i=this.dependToolConfig)==null?void 0:i.lineType)}getPolygonPointList(){if(!this.basicResult)return[];const{pointList:t}=this.basicResult,{lineType:e}=this.dependToolConfig;return e===tool.ELineTypes.Curve?polygonTool.createSmoothCurvePoints(t.reduce((i,s)=>[...i,s.x,s.y],[]),.5,!0,20):t}getNextCoordByRenderCoord(t){return this.getNextCoordByAbsCoord(this.coordUtils.getAbsCoord(t))}getNextCoordByAbsCoord(t){var e;const i=(e=this.activeLine)==null?void 0:e.slice(-1)[0];return i?this.coordUtils.getNextCoordByDependTool(t,i):t}pointInLine(t,e,i){return t.filter(s=>s).length<2?!1:t.some((s,n)=>{if(n===0)return!1;const r=this.coordUtils.getRenderCoord(t[n-1]),o=this.coordUtils.getRenderCoord(s);return LineToolUtils.default.isInLine(e,r,o,i)})}arc(t,e=POINT_RADIUS,i){var s,n,r,o,h,a;if(this.ctx){const{x:l,y:u}=t;(s=this.ctx)==null||s.save(),(n=this.ctx)==null||n.beginPath(),this.ctx.fillStyle=i||this.lineStyle.color,(r=this.ctx)==null||r.arc(l,u,e,0,360),(o=this.ctx)==null||o.closePath(),(h=this.ctx)==null||h.fill(),(a=this.ctx)==null||a.restore()}}renderActiveArea(){if(this.isActive&&this.activeArea&&this.ctx){const{top:t,left:e,right:i,bottom:s}=this.activeArea,{x:n,y:r}=this.coordUtils.getRenderCoord({x:e,y:t});this.ctx.save(),this.ctx.beginPath(),this.ctx.strokeStyle="#B3B8FF",this.ctx.rect(n,r,(i-e)*this.zoom,(s-t)*this.zoom),this.ctx.stroke(),this.ctx.restore()}}setSelectedIDs(t){this.selectedIDs=t,this.selectedIDs.length<2&&this.setSelectedID(this.selectedIDs.length===1?this.selectedIDs[0]:""),this.render()}setSelectedID(t){var e,i;const s=this.selectedID;t!==s&&s&&((e=this._textAttributInstance)==null||e.changeSelected()),t||(i=this._textAttributInstance)==null||i.clearTextAttribute(),this.selectedID=t,this.render(),this.emit("selectedChange")}addLinePoint(t){var e,i,s,n;this.arc(t),(e=this.activeLine)==null||e.push(__spreadProps(__spreadValues({},t),{id:uuid()})),((i=this.activeLine)==null?void 0:i.length)===1?(s=this.actionsHistory)==null||s.initRecord(this.activeLine):(n=this.actionsHistory)==null||n.pushHistory(this.activeLine),this.render()}setCreatStatusAndAddPoint(t,e=!1){this.updateStatus(0,e),this.addLinePoint(t)}isActiveLineValid(){var t;return this.selectedID?(t=this.lineList.find(e=>e.id===this.selectedID))==null?void 0:t.valid:this.isLineValid}nextOrder(){return this.lineListLen===0?1:this.lineList.slice(-1)[0].order+1}getLineColorByAttribute(t,e=!1){return StyleUtils.getStrokeAndFill(this.getColor(t.attribute),t.valid,{isSelected:e}).stroke}updateActiveArea(){this.activeArea=this.getActiveArea(),this.renderActiveArea()}getActiveArea(){return this.hasActiveLine?MathUtils.default.calcViewportBoundaries(this.activeLine,this.isCurve,SEGMENT_NUMBER,this.zoom):void 0}drawLineNumber(t,e=1,i,s="",n,r=!0){var o,h,a;if((this.showOrder||this.attributeConfigurable)&&this.ctx){let l=this.showOrder?e.toString():`${s}`;if(this.attributeConfigurable){const u=n?(a=(h=(o=this.attributeList)==null?void 0:o.find(c=>c.value===n))==null?void 0:h.key)!=null?a:n:"";l=[l,`${!r&&u?"\u65E0\u6548":""}${u}`].filter(c=>c).join("_")}this.drawText(t,l,i)}}drawLineTextAttribute(t,e,i){if(t&&i)return this.drawText(t,i,e,200)}drawLineLength(t,e){var i;if(((i=this.config)==null?void 0:i.showLineLength)&&t){const s=t.reduce((r,o,h)=>h<=0||!t[h-1].actual||!o.actual?r:r+LineToolUtils.default.calcDistance(t[h-1].actual,o.actual),0),n=t[t.length-1];this.drawText(n,`l = ${s.toFixed(2)}`,e)}}drawText(t,e,i,s){var n,r;this.ctx&&((n=this.ctx)==null||n.save(),this.ctx.font="italic bold 14px SourceHanSansCN-Regular",this.ctx.fillStyle=i,this.ctx.strokeStyle=i,this.ctx.shadowColor="rgba(0, 0, 0, 0.6)",this.ctx.shadowOffsetY=2,this.ctx.shadowBlur=4,s?DrawUtils.wrapText(this.canvas,e,t.x-LINE_ORDER_OFFSET.x,t.y-LINE_ORDER_OFFSET.y,s):this.ctx.fillText(e,t.x-LINE_ORDER_OFFSET.x,t.y-LINE_ORDER_OFFSET.y),(r=this.ctx)==null||r.restore())}moveActiveArea(t,e){this.activeArea&&(this.activeArea=Object.assign(this.activeArea,{top:this.activeArea.top+e,bottom:this.activeArea.bottom+e,right:this.activeArea.right+t,left:this.activeArea.left+t})),this.activeLine&&(this.activeLine.map(i=>Object.assign(i,{x:i.x+t,y:i.y+e})),this.updateLines()),this.emit("updateLineByDrag",this.updatedLine)}findHoveredPoint(t){if(!!this.activeLine)return this.activeLine.find(e=>{const i=this.coordUtils.getRenderCoord(e);return LineToolUtils.default.calcDistance(i,t)<=POINT_ACTIVE_RADIUS})}findHoverLine(t){return ___default.default.cloneDeep(this.lineList).reverse().find(({pointList:i})=>{const s=i?this.getPointList(i):[],n=this.getLineWidthScope();return s.some((r,o)=>{if(o===0)return!1;const h=this.coordUtils.getRenderCoord(r),a=this.coordUtils.getRenderCoord(s[o-1]);return LineToolUtils.default.isInLine(t,h,a,n)})})}getAdsorptionPoint(t){let e,i,s;return ___default.default.cloneDeep(this.lineList).reverse().forEach(({pointList:n,id:r})=>{if(r===this.selectedID||!n||(n==null?void 0:n.length)<2)return;const o=this.findNearestPoint(n,t);if(o){if(o.minDistance===0){e=o.point;return}(i===void 0||o.minDistance<i)&&(e=o.point,i=o.minDistance)}}),s||e}findNearestPoint(t,e,i=7){let s;const n=i;for(let r=1;r<=t.length-1;r++){const o=this.coordUtils.getRenderCoord(t[r]),h=this.coordUtils.getRenderCoord(t[r-1]),{length:a,footPoint:l}=MathUtils.default.getFootOfPerpendicular(e,o,h),u=LineToolUtils.default.calcTwoPointDistance(o,e),c=LineToolUtils.default.calcTwoPointDistance(h,e);if(u<=i*2){s=o,i=0;break}if(c<=i*2){s=h,i=0;break}a<i&&(s=l,i=a)}return s?{point:s,minDistance:n}:void 0}getPointList(t){return this.isCurve?polygonTool.createSmoothCurvePointsFromPointList(t,SEGMENT_NUMBER):t}moveSelectedLine(t){const e=(t.x-this.prevAxis.x)/this.zoom,i=(t.y-this.prevAxis.y)/this.zoom;if(this.enableOutOfTarget){this.lineDragging=!0,this.moveActiveArea(e,i);return}if(this.isDependPolygon){this.moveLineInPolygon(e,i);return}let s=[0,this.imageSize.width],n=[0,this.imageSize.height];if(this.isDependRect){const{x:r,y:o,width:h,height:a}=this.basicResult;s=[r,r+h],n=[o,o+a]}this.moveLineInRectRange(e,i,s,n)}moveSelectPoint(t){if(!this.selectedPoint)return;const e=t.x-this.prevAxis.x,i=t.y-this.prevAxis.y,s=(this.selectedPoint?this.selectedPoint.x:0)+e/this.zoom,n=(this.selectedPoint?this.selectedPoint.y:0)+i/this.zoom,r={x:s,y:n};Object.assign(this.selectedPoint,this.getNextCoordByAbsCoord(r)),this.updateLines(),this.render()}getCoordByConfig(t,e){var i;const s=!!t.shiftKey,n=t.altKey;if(((i=this.activeLine)==null?void 0:i.length)>0&&s){const r=this.activeLine.slice(-1)[0];return LineToolUtils.default.getVHPoint(r,e,this.coordUtils.getAbsCoord(e),this.coordUtils.getRenderCoord(r))}return this.edgeAdsorptionEnabled&&!n?this.getAdsorptionPoint(e):e}getNextPoint(t,e){const i=this.getCoordByConfig(t,e)||e;return this.enableOutOfTarget?this.coordUtils.getAbsCoord(i):this.getNextCoordByRenderCoord(i)}lineHover(){this.render()}mouseMoveHandler(t){const e=this.getCoordinate(t),i=t.which===1;if(this.isCreate){this.hasActiveLine&&this.renderNextPoint(t,e);return}if(this.isNone&&(this.lineHover(),this.edgeAdsorptionEnabled&&!t.altKey)){const s=this.getAdsorptionPoint(e);s&&this.arc(s)}if(this.isActive){if(this.isMousedown&&i){if(this.selectedPoint){this.moveSelectPoint(e);return}if(this.coordsInsideActiveArea){this.moveSelectedLine(e),this.drawActivatedLine(void 0,void 0,!0);return}}this.drawHoverPoint(e),this.render()}}onMouseMove(t){if(super.onMouseMove(t)||this.forbidMouseOperation||!this.imgInfo)return;const e=this.getCoordinate(t);this.mouseMoveHandler(t),this.prevAxis=e}setActiveArea(t,e=!1){const i=this.findHoverLine(t);if(i){const s=this.lineList.findIndex(o=>o.id===(i==null?void 0:i.id)),n=MathUtils.default.calcViewportBoundaries((i==null?void 0:i.pointList)||[],this.isCurve,SEGMENT_NUMBER,this.zoom),r=this.lineList[s];this.updateStatus(1),this.setActiveLine(r.pointList),this.setSelectedLineID(r.id),this.activeArea=n,this.updateLineAttributes(r)}else e&&this.setNoneStatus();this.render()}setActiveLineByID(t){const e=this.lineList.find(i=>i.id===t);if(e){const i=MathUtils.default.calcViewportBoundaries((e==null?void 0:e.pointList)||[],this.isCurve,SEGMENT_NUMBER,this.zoom);this.updateStatus(1),this.setActiveLine(e.pointList),this.setSelectedLineID(e.id),this.activeArea=i,this.updateLineAttributes(e)}this.render()}setActiveLine(t){this.activeLine=t?___default.default.cloneDeep(t):void 0}historyChanged(t){const e=`${t}Enabled`;if(this.isCreate){if(this.actionsHistory&&this.actionsHistory[e]){const i=this.actionsHistory&&this.actionsHistory[t]();this.setActiveLine(i),this.render()}return}if(this.history&&this.history[e]){const i=this.history[t](),s=i==null?void 0:i.find(n=>n.id===this.selectedID);this.lineList=i,this.selectedID&&s?this.setActiveLine(s==null?void 0:s.pointList):this.setNoneStatus(),this.render()}this.emit("dataUpdated",this.lineList)}undo(){this.historyChanged("undo"),this.updateSelectedAttributeAfterHistoryChanged()}redo(){this.historyChanged("redo"),this.updateSelectedAttributeAfterHistoryChanged()}isCoordInsideTarget(t){if(this.isDependPolygon)return this.isInBasicPolygon(t);if(this.isDependRect){const{x:e,y:i,width:s,height:n}=this.basicResult,r=[e,e+s],o=[i,i+n];return MathUtils.default.isInRange(t.x,r)&&MathUtils.default.isInRange(t.y,o)}return MathUtils.default.isInRange(t.x,[0,this.imageSize.width])&&MathUtils.default.isInRange(t.y,[0,this.imageSize.height])}getPointInsertIndex(t,e){if(t&&this.activeLine){const i=this.getPointList(this.activeLine);return this.activeLine.length===2?1:this.activeLine.findIndex((s,n)=>{if(n>0){const r=this.activeLine?this.activeLine[n-1]:void 0,o=this.isCurve?i.slice((n-1)*(SEGMENT_NUMBER+1),n*(SEGMENT_NUMBER+1)):[r,s];return this.pointInLine(o,t,e||this.getLineWidthScope())}return!1})}return-1}getLineWidthScope(){return this.lineStyle.lineWidth}isMouseCoordOutsideActiveArea(){return!this.coordsInsideActiveArea&&!this.selectedPoint}isLinePointsExceed(){return this.isCreate&&this.activeLine&&this.upperLimitPointNum&&~~this.upperLimitPointNum<=this.activeLine.length}isLinePointsNotEnough(){var t;return this.activeLine&&((t=this.activeLine)==null?void 0:t.length)<this.lowerLimitPointNum}updateLineSegmentSpecial(t){const e=this.getPointInsertIndex(t,2)-1;if(e>-1){const i=this.activeLine[e];i.specialEdge=!i.specialEdge,this.hoverLineSegmentIndex=-1,this.render()}}addLinePointToActiveLine(){var t;const e=this.getPointInsertIndex(this.cursor),i=this.pointsWithinRange(this.activeLine.length+1);this.cursor&&e>-1&&i&&(this.activeLine.splice(e,0,__spreadProps(__spreadValues({},this.coordUtils.getAbsCoord(this.cursor)),{id:uuid()})),this.updateLines(),(t=this.history)==null||t.pushHistory(this.lineList),this.render(),this.cursor=void 0)}onMouseDown(t){if(super.onMouseDown(t)||this.forbidMouseOperation||!this.imgInfo)return;const e=this.getCoordinate(t);if(this.isMousedown=!0,this.prevAxis=e,t.which===3){this.cursor=void 0;return}this.selectedPoint=this.findHoveredPoint(e),this.coordsInsideActiveArea=this.isActive&&this.activeArea?LineToolUtils.default.inArea(this.activeArea,this.coordUtils.getAbsCoord(e)):!1,this.lineDragging=!1}lineHasChanged(){const t=this.lineList.find(e=>e.id===this.selectedID);return t?JSON.stringify(t.pointList)!==JSON.stringify(this.activeLine):!1}updateLines(){const t=this.lineList.find(e=>e.id===this.selectedID);t&&(t.pointList=___default.default.cloneDeep(this.activeLine),this.updatedLine=t,this.emit("dataUpdated",this.lineList))}onMouseUp(t){const e=()=>{this.isMousedown=!1,this.hoverPointID=void 0,this.cursor=void 0,this.selectedPoint=void 0};if(this.hoverPointID=void 0,super.onMouseUp(t)||this.forbidMouseOperation||!this.imgInfo){e();return}t.which===1&&this.onLeftClick(t),t.which===3&&this.onRightClick(t),e()}isTextValid(t){return AttributeUtils.default.textAttributeValidate(this.textCheckType,this.customFormat,t)}createLineData(){const t=uuid(),e={pointList:___default.default.cloneDeep(this.activeLine),id:t,valid:this.isLineValid,order:this.nextOrder()};return e.attribute=this.defaultAttribute,e}stopLineCreating(t=!0){var e,i,s,n;const r=this.selectedID?!0:!!this.isTextConfigurable;let o;if(t){if(this.selectedID){const h=this.lineList.find(a=>a.id===this.selectedID);o=this.selectedID,h&&(h.pointList=___default.default.cloneWith(this.activeLine),___default.default.isEqual(h.pointList,(e=this.history)==null?void 0:e.pushHistory(this.lineList))||(i=this.history)==null||i.pushHistory(this.lineList))}else if(this.isCreate&&this.activeLine&&this.activeLine.length>1){const h=this.createLineData();o=h.id,this.setLineList([...this.lineList,h]),this.emit("lineCreated",h,this.zoom,this.currentPos),(s=this.history)==null||s.pushHistory(this.lineList)}}r?this.setActiveStatus(o):this.setNoneStatus(),(n=this.actionsHistory)==null||n.empty(),this.emit("dataUpdated",this.lineList),this.render()}setActiveStatus(t){const e=t?this.lineList.find(i=>i.id===t):void 0;if(e){const i=e==null?void 0:e.pointList;this.updateStatus(1),this.setActiveLine(i),this.setSelectedLineID(t)}else this.setNoneStatus()}setNoneStatus(t=!0){t&&this.updateStatus(2),this.activeLine=[],this.setSelectedLineID(void 0),this.activeArea=void 0,this.isLineValid=!0,this.cursor=void 0}setKeyDownStatus(t,e){this.isShift=e!=null?e:t.keyCode===keyCode.Shift}continueToEdit(){var t;this.updateStatus(0),this.cursor=void 0,(t=this.actionsHistory)==null||t.pushHistory(this.activeLine),this.render()}setInvalidLineOnCreating(t){if(this.selectedID&&t.keyCode!==keyCode.Ctrl||!this.isCreate)return;const e=!t.ctrlKey;this.selectedID?this.setInvalidLine(this.selectedID,e,!1):this.isLineValid=e}onKeyDown(t){if(super.onKeyDown(t),this.setKeyDownStatus(t),t.keyCode===keyCode.Z&&!t.ctrlKey&&this.toggleIsHide(),t.keyCode===keyCode.Shift&&this.render(),t.keyCode===keyCode.Tab){t.preventDefault(),this.selectToNextLine(t);return}if(this.isCreate&&this.keyboardEventWhileLineCreating(t),this.config.attributeConfigurable){const e=AttributeUtils.default.getAttributeByKeycode(t.keyCode,this.config.attributeList);e!==void 0&&this.setDefaultAttribute(e)}}selectToNextLine(t){const e=CommonToolUtils.getNextSelectedRectIDByEvent(this.viewPortLines.map(i=>{var s,n,r,o;return __spreadProps(__spreadValues({},i),{x:(n=(s=i.pointList[0])==null?void 0:s.x)!=null?n:0,y:(o=(r=i.pointList[0])==null?void 0:r.y)!=null?o:0})}),t,this.selectedID);e&&this.setActiveLineByID(e.id)}keyboardEventWhileLineCreating(t){!this.isCreate||(t.keyCode===keyCode.Ctrl&&this.setInvalidLineOnCreating(t),[keyCode.Shift,keyCode.Alt].includes(t.keyCode)&&this.renderNextPoint(t,this.prevAxis))}renderNextPoint(t,e){const i=this.coordUtils.getRenderCoord(this.getNextPoint(t,e));this.render(i)}deleteSelectedLine(t){const e=MathUtils.default.calcViewportBoundaries(this.activeLine,this.isCurve,SEGMENT_NUMBER,this.zoom);LineToolUtils.default.inArea(e,this.coordUtils.getAbsCoord(t))&&this.deleteLine()}deleteSelectedLinePoint(t){var e;this.pointsWithinRange(this.activeLine.length-1)&&t&&(this.setActiveLine(this.activeLine.filter(s=>s.id!==t)),this.updateLines(),(e=this.history)==null||e.pushHistory(this.lineList)),this.cursor=void 0,this.render()}deleteLine(){var t;this.lineList=this.lineList.filter(e=>e.id!==this.selectedID),(t=this.history)==null||t.pushHistory(this.lineList),this.setNoneStatus(),this.emit("dataUpdated",this.lineList),this.emit("lineDeleted",this.selectedID),this.render()}setInvalidLine(t,e,i=!0){var s;const n=this.lineList.find(r=>r.id===t);n&&(n.valid=e!==void 0?e:!n.valid,(s=this.history)==null||s.pushHistory(this.lineList),i&&this.render())}empty(){var t,e;this.lineList=[],this.setNoneStatus(),this.selectedPoint=void 0,(t=this.actionsHistory)==null||t.empty(),(e=this.history)==null||e.init(),this.emit("dataUpdated",this.lineList),this.render()}setAttribute(t){var e;this.attributeConfigurable&&(this.defaultAttribute=t,this.setLineAttribute("attribute",t),this.selectedID&&((e=this.history)==null||e.pushHistory(this.lineList)))}setTextAttribute(t){var e;this.isTextConfigurable&&(this.setLineAttribute("textAttribute",t),(e=this.history)==null||e.applyAttribute(this.selectedID,"textAttribute",t))}setLineAttribute(t,e,i){const s=i||this.selectedID;if(s){const n=this.lineList.find(r=>r.id===s);n&&(n[t]=e)}this.render()}updateAttribute(t){this.emit("updateAttribute",t)}updateLineAttributes(t){var e;if(this.attributeConfigurable&&t){const i=(t==null?void 0:t.attribute)||"";this.defaultAttribute=i,this.updateAttribute(i)}if(this.isTextConfigurable&&t){const i=(t==null?void 0:t.textAttribute)||"";this.updateTextAttribute(i)}(e=this.history)==null||e.updateHistory(this.lineList)}lineStatusChanged(){this.emit("lineStatusChanged",{status:this.status,selectedLineID:this.selectedID})}updateTextAttribute(t){if(this.selectedID){const e=this.lineList.find(i=>i.id===this.selectedID);e&&(e.textAttribute=t)}this.emit("updateText",t)}saveData(){this.stopLineCreating(),this.setNoneStatus(),this.render()}setTextEditingID(t){this.textEditingID=t,this.render()}setSelectedLineID(t){var e,i;if(this.selectedID===t)return;const s=this.selectedID;t!==s&&s&&((e=this._textAttributeInstance)==null||e.changeSelected()),t||(i=this._textAttributeInstance)==null||i.clearTextAttribute(),this.selectedID=t,this.emit("selectedChange")}attributeLockListChange(t){this.attributeLockList=t,this.render()}setResult(t){this.setNoneStatus(),this.setLineList(t),this.render()}setConfig(t){super.setConfig(t)}toggleIsHide(){this.setIsHidden(!this.isHidden),this.render()}clearCanvas(){super.clearCanvas()}clearResult(){this.setResult([]),this.setSelectedLineID(void 0),this.render()}exportData(){return[this.lineList,this.basicImgInfo]}setDefaultAttribute(t=""){var e;this.attributeConfigurable&&(this.defaultAttribute=t,this.changeStyle(this.defaultAttribute),this.setLineAttribute("attribute",t),this.selectedID&&((e=this.history)==null||e.pushHistory(this.lineList)),this.emit("changeAttributeSidebar"))}getCurrentSelectedData(){var t,e;const i=this.isActiveLineValid(),s=this.defaultAttribute,n=this.getColor(s),r=i?n==null?void 0:n.valid.stroke:n==null?void 0:n.invalid.stroke,o=(e=(t=this.lineList.find(h=>h.id===this.selectedID))==null?void 0:t.textAttribute)!=null?e:"";return{color:r,textAttribute:o}}renderTextAttribute(){var t,e,i,s;if(!this.ctx||!this.activeLine||((t=this.activeLine)==null?void 0:t.length)<2||this.isCreate)return;const n=this.isActiveLineValid(),r=this.defaultAttribute,{x:o,y:h}=this.activeLine[1],a=this.coordUtils.getRenderCoord({x:o,y:h}),l=this.getColor(r),u=n?l==null?void 0:l.valid.stroke:l==null?void 0:l.invalid.stroke,c=(i=(e=this.lineList.find(f=>f.id===this.selectedID))==null?void 0:e.textAttribute)!=null?i:"";this._textAttributeInstance||(this._textAttributeInstance=new textAttributeClass({container:this.container,icon:this.getTextIconSvg(r),color:u,getCurrentSelectedData:this.getCurrentSelectedData,updateSelectedTextAttribute:this.updateSelectedTextAttribute})),this._textAttributeInstance&&!((s=this._textAttributeInstance)==null?void 0:s.isExit)&&this._textAttributeInstance.appendToContainer(),this._textAttributeInstance.update(`${c}`,{left:a.x,top:a.y,color:u}),this._textAttributeInstance.updateIcon(this.getTextIconSvg(r))}getTextIconSvg(t=""){return AttributeUtils.default.getTextIconSvg(t,this.config.attributeList,this.config.attributeConfigurable,this.baseIcon)}updateSelectedTextAttribute(t){if(this._textAttributeInstance&&t&&this.selectedID){let e=t;!AttributeUtils.default.textAttributeValidate(this.config.textCheckType,"",e)&&(this.emit("messageError",AttributeUtils.default.getErrorNotice(this.config.textCheckType,this.lang)),e=""),this.setTextAttribute(e),this.emit("updateTextAttribute"),this.render()}}}exports.INNER_POINT_RADIUS=INNER_POINT_RADIUS,exports.LINE_ORDER_OFFSET=LINE_ORDER_OFFSET,exports.POINT_ACTIVE_RADIUS=POINT_ACTIVE_RADIUS,exports.POINT_RADIUS=POINT_RADIUS,exports.SEGMENT_NUMBER=SEGMENT_NUMBER,exports.default=LineToolOperation;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _ = require('lodash');
+var tool = require('../../constant/tool.js');
+var ActionsHistory = require('../../utils/ActionsHistory.js');
+var uuid = require('../../utils/uuid.js');
+var keyCode = require('../../constant/keyCode.js');
+var MathUtils = require('../../utils/MathUtils.js');
+var basicToolOperation = require('./basicToolOperation.js');
+var LineToolUtils = require('../../utils/tool/LineToolUtils.js');
+var polygonTool = require('../../utils/tool/polygonTool.js');
+var CommonToolUtils = require('../../utils/tool/CommonToolUtils.js');
+var CanvasUtils = require('../../utils/tool/CanvasUtils.js');
+var DrawUtils = require('../../utils/tool/DrawUtils.js');
+var StyleUtils = require('../../utils/tool/StyleUtils.js');
+var AttributeUtils = require('../../utils/tool/AttributeUtils.js');
+var textAttributeClass = require('./textAttributeClass.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var EStatus;
+(function(EStatus2) {
+  EStatus2[EStatus2["Create"] = 0] = "Create";
+  EStatus2[EStatus2["Active"] = 1] = "Active";
+  EStatus2[EStatus2["None"] = 2] = "None";
+})(EStatus || (EStatus = {}));
+const SEGMENT_NUMBER = 16;
+const LINE_ORDER_OFFSET = {
+  x: 0,
+  y: 20
+};
+const POINT_RADIUS = 3;
+const POINT_ACTIVE_RADIUS = 5;
+const INNER_POINT_RADIUS = 2;
+class LineToolOperation extends basicToolOperation.BasicToolOperation {
+  constructor(props) {
+    super(props);
+    this.drawActivatedLine = (coord, e, hideTempAxis) => {
+      const activeLine = ___default["default"].cloneDeep(this.activeLine);
+      if (!activeLine || activeLine.length === 0) {
+        return;
+      }
+      const isActiveLineValid = this.isActiveLineValid();
+      let order;
+      const existLine = this.selectedID ? this.lineList.find((i) => i.id === this.selectedID) : void 0;
+      if (existLine) {
+        order = existLine.order;
+      } else {
+        order = this.nextOrder();
+      }
+      const color = this.getLineColorByAttribute({attribute: this.defaultAttribute, valid: !!isActiveLineValid});
+      activeLine.map((point) => Object.assign(point, {
+        actual: {x: point.x, y: point.y}
+      }, this.coordUtils.getRenderCoord(point)));
+      if (this.isActive) {
+        this.drawLineLength(activeLine, color);
+      }
+      this.updateActiveArea();
+      this.drawLine(activeLine, coord, color, true, true);
+      this.drawLineNumber(activeLine[0], order, color, "", this.defaultAttribute, isActiveLineValid);
+      if (coord && this.isCreate) {
+        this.arc(coord, POINT_RADIUS, color);
+      }
+      if (this.cursor && !this.selectedPoint && !hideTempAxis && !this.isShift) {
+        this.arc(this.cursor, POINT_ACTIVE_RADIUS, color);
+      }
+    };
+    this.drawHoverPoint = (coord) => {
+      if (this.isMousedown) {
+        return;
+      }
+      if (coord && this.isLineSelected) {
+        const pointList = this.getPointList(this.activeLine);
+        const hoverPoint = this.activeLine.find((i) => LineToolUtils["default"].calcDistance(this.coordUtils.getRenderCoord(i), coord) <= POINT_ACTIVE_RADIUS);
+        let nearestPoint;
+        if (!hoverPoint && this.activeLine) {
+          nearestPoint = this.findNearestPoint(pointList, coord);
+        }
+        this.hoverPointID = hoverPoint ? hoverPoint.id : void 0;
+        this.cursor = hoverPoint ? void 0 : nearestPoint == null ? void 0 : nearestPoint.point;
+      }
+    };
+    this.updatedLine = {
+      id: "",
+      valid: false,
+      order: 0
+    };
+    this.toolName = "lineTool";
+    this.lineList = [];
+    this.activeLine = [];
+    this.coordsInsideActiveArea = false;
+    this.hoverLineSegmentIndex = -1;
+    this.isShift = false;
+    this.isReference = false;
+    this.selectedIDs = [];
+    this.drawCurveLine = (ctx, points, config, applyLineWidth = true, isReference = false, hoverLineSegmentIndex) => {
+      const pointList = polygonTool.createSmoothCurvePointsFromPointList(points, SEGMENT_NUMBER);
+      ctx.save();
+      ctx.lineCap = "round";
+      ctx.lineJoin = "round";
+      ctx.strokeStyle = config.color;
+      if (applyLineWidth) {
+        ctx.lineWidth = config.lineWidth;
+      }
+      if (isReference) {
+        LineToolUtils["default"].setReferenceCtx(ctx);
+      }
+      points.forEach(({specialEdge}, index) => {
+        const curveLinePoints = pointList.splice(0, SEGMENT_NUMBER + 1);
+        ctx.save();
+        ctx.beginPath();
+        if (hoverLineSegmentIndex === index) {
+          ctx.lineWidth = 4;
+        }
+        curveLinePoints.forEach(({x, y}, pointIndex) => {
+          const fn = pointIndex > 0 ? "lineTo" : "moveTo";
+          if (specialEdge) {
+            LineToolUtils["default"].setSpecialEdgeStyle(ctx);
+          }
+          ctx[fn](x, y);
+        });
+        ctx.stroke();
+        ctx.restore();
+      });
+      ctx.restore();
+    };
+    this.drawLine = (points, cursor, color, showPoint = false, isActive = false) => {
+      const pointsToDraw = cursor ? points.concat(cursor) : points;
+      const lineConfig = {color, lineWidth: isActive ? 1 : this.lineStyle.lineWidth};
+      if (this.isCurve) {
+        LineToolUtils["default"].drawCurveLine(this.ctx, pointsToDraw, lineConfig, !showPoint, this.isReference, isActive ? this.hoverLineSegmentIndex : -1);
+      } else {
+        this.drawStraightLine(pointsToDraw, lineConfig, isActive);
+      }
+      if (showPoint) {
+        points.forEach((point) => {
+          var _a, _b;
+          const pointID = point.id;
+          const pointRadius = pointID && [this.hoverPointID, (_a = this.selectedPoint) == null ? void 0 : _a.id].includes(pointID) ? POINT_ACTIVE_RADIUS : POINT_RADIUS;
+          this.arc(point, pointRadius, color);
+          if (![this.hoverPointID, (_b = this.selectedPoint) == null ? void 0 : _b.id].includes(pointID)) {
+            this.arc(point, INNER_POINT_RADIUS, "white");
+          }
+        });
+      }
+    };
+    this.drawStraightLine = (points, config, isActive = false) => {
+      const {ctx} = this;
+      if (ctx) {
+        ctx.save();
+        ctx.lineCap = "round";
+        ctx.lineJoin = "round";
+        ctx.strokeStyle = config.color;
+        ctx.lineWidth = config.lineWidth;
+        if (this.isReference) {
+          LineToolUtils["default"].setReferenceCtx(ctx);
+        }
+        points.forEach((point, index) => {
+          ctx.beginPath();
+          if (index > 0) {
+            const prePoint = points[index - 1];
+            ctx.save();
+            if (prePoint == null ? void 0 : prePoint.specialEdge) {
+              LineToolUtils["default"].setSpecialEdgeStyle(ctx);
+            }
+            if (isActive && this.hoverLineSegmentIndex + 1 === index) {
+              ctx.lineWidth = 4;
+            }
+            ctx.moveTo(prePoint.x, prePoint.y);
+            ctx.lineTo(point.x, point.y);
+            ctx.stroke();
+            ctx.restore();
+          }
+        });
+        ctx.restore();
+      }
+    };
+    this.drawLines = () => {
+      try {
+        const lineList = ___default["default"].cloneDeep(this.attributeFilteredLines);
+        if (this.isHidden) {
+          return;
+        }
+        lineList.forEach((line) => {
+          if (line.id === this.selectedID) {
+            return;
+          }
+          if (line.pointList) {
+            line.pointList.map((i) => Object.assign(i, {actual: {x: i.x, y: i.y}}, this.coordUtils.getRenderCoord(i)));
+            const {order, label} = line;
+            const displayOrder = order;
+            const color = line && this.getLineColorByAttribute(line);
+            this.drawLine(line.pointList, void 0, color, false);
+            this.drawLineNumber(line.pointList[0], displayOrder, color, label, line.attribute, line.valid);
+            if (line.id !== this.textEditingID) {
+              this.drawLineTextAttribute(line.pointList[1], color, line == null ? void 0 : line.textAttribute);
+              this.drawLineLength(line.pointList, color);
+            }
+          }
+        });
+      } catch (e) {
+        console.error(e, "\u7EBF\u6761\u5DE5\u5177\u6570\u636E\u89E3\u6790\u9519\u8BEF");
+        this.lineList = [];
+        this.clearCanvas();
+      }
+    };
+    this.render = (nextPoint) => {
+      super.render();
+      this.drawLines();
+      this.drawActivatedLine(nextPoint, void 0, true);
+      this.renderTextAttribute();
+      this.renderCursorLine(this.getLineColor(this.defaultAttribute));
+    };
+    this.moveLineInPolygon = (offsetX, offsetY) => {
+      var _a;
+      if (!Array.isArray(this.activeLine)) {
+        return false;
+      }
+      const allPointsInRange = (_a = this.activeLine) == null ? void 0 : _a.every((i) => {
+        return this.isInBasicPolygon({x: i.x + offsetX, y: i.y + offsetY});
+      });
+      if (allPointsInRange) {
+        this.lineDragging = true;
+        this.moveActiveArea(offsetX, offsetY);
+      }
+    };
+    this.moveLineInRectRange = (offsetX, offsetY, rectHorizontalRange, rectVerticalRange) => {
+      if (this.activeArea === void 0) {
+        return;
+      }
+      const {top, left, right, bottom} = this.activeArea;
+      const hBoundaries = [left, right].map((i) => ___default["default"].isNumber(i) ? i + offsetX : 0);
+      const vBoundaries = [top, bottom].map((i) => ___default["default"].isNumber(i) ? i + offsetY : 0);
+      const horizontalInRange = left >= 0 && right && MathUtils["default"].isInRange(hBoundaries, rectHorizontalRange);
+      const verticalInRange = top >= 0 && bottom && MathUtils["default"].isInRange(vBoundaries, rectVerticalRange);
+      const calcOffsetX = horizontalInRange ? offsetX : 0;
+      const calcOffsetY = verticalInRange ? offsetY : 0;
+      this.lineDragging = true;
+      this.moveActiveArea(calcOffsetX, calcOffsetY);
+    };
+    this.onRightClick = (e) => {
+      this.cursor = void 0;
+      if (this.isCreate) {
+        if (this.isLinePointsNotEnough()) {
+          return;
+        }
+        this.stopLineCreating(true);
+        return;
+      }
+      this.setActiveArea(this.getCoordinate(e), true);
+      this.emit("contextmenu");
+    };
+    this.updateSelectedAttributeAfterHistoryChanged = () => {
+      if (this.selectedID) {
+        const line = this.lineList.find((i) => i.id === this.selectedID);
+        const attribute = line == null ? void 0 : line.attribute;
+        if (typeof attribute === "string") {
+          this.defaultAttribute = attribute;
+          this.updateAttribute(attribute);
+          this.render();
+        }
+      }
+    };
+    this.onLeftClick = (e) => {
+      const coord = this.getCoordinate(e);
+      const {lineDragging} = this;
+      this.lineDragging = false;
+      if (this.isSpaceKey) {
+        return;
+      }
+      if (this.isNone && e.ctrlKey) {
+        const hoveredLine = this.findHoverLine(coord);
+        if (hoveredLine) {
+          this.setInvalidLine(hoveredLine.id);
+        }
+        return;
+      }
+      if (this.isLinePointsExceed()) {
+        return;
+      }
+      const nextAxis = this.getNextPoint(e, coord);
+      if (this.isCreate || this.isNone) {
+        this.setCreatStatusAndAddPoint(nextAxis);
+        return;
+      }
+      if (this.isActive) {
+        if (lineDragging) {
+          return;
+        }
+        const isMouseCoordOutsideActiveArea = this.isMouseCoordOutsideActiveArea();
+        if (isMouseCoordOutsideActiveArea) {
+          this.setNoneStatus(false);
+          this.setCreatStatusAndAddPoint(nextAxis);
+          return;
+        }
+        const isSetSpecialLine = e.shiftKey;
+        if (isSetSpecialLine) {
+          this.updateLineSegmentSpecial(coord);
+          return;
+        }
+        if (this.coordsInsideActiveArea && e.ctrlKey) {
+          this.setInvalidLine(this.selectedID);
+          return;
+        }
+        this.addLinePointToActiveLine();
+      }
+    };
+    this.onDblclick = () => {
+    };
+    this.onKeyUp = (e) => {
+      super.onKeyUp(e);
+      this.isShift = false;
+      this.hoverLineSegmentIndex = -1;
+      if (e.keyCode === keyCode.Esc) {
+        this.stopLineCreating(false);
+        return;
+      }
+      if (this.isActive) {
+        if (e.keyCode === keyCode.Delete) {
+          this.deleteLine();
+          return;
+        }
+        if (e.keyCode === keyCode.F) {
+          this.setInvalidLine(this.selectedID);
+          return;
+        }
+        if (e.keyCode === keyCode.Space) {
+          this.continueToEdit();
+          return;
+        }
+      }
+      this.keyboardEventWhileLineCreating(e);
+    };
+    this.onRightDblClick = (e) => {
+      super.onRightDblClick(e);
+      const coord = this.getCoordinate(e);
+      if (this.isActive) {
+        const hoverPoint = this.findHoveredPoint(coord);
+        if (hoverPoint) {
+          this.deleteSelectedLinePoint(hoverPoint.id);
+          return;
+        }
+        this.deleteSelectedLine(coord);
+      }
+    };
+    this.setReference = (isReference) => {
+      this.isReference = isReference;
+    };
+    this.pointsWithinRange = (count) => {
+      if (this.lowerLimitPointNum && count < this.lowerLimitPointNum) {
+        return false;
+      }
+      if (this.upperLimitPointNum && count > this.upperLimitPointNum) {
+        return false;
+      }
+      return true;
+    };
+    this.setLineList = (lineList) => {
+      const lengthChanged = lineList.length !== this.lineListLen;
+      this.lineList = lineList;
+      if (lengthChanged) {
+        this.emit("updatePageNumber");
+      }
+    };
+    this.textChange = (v) => {
+      if (this.config.textConfigurable === false || !this.selectedID) {
+        return;
+      }
+      this.updateSelectedTextAttribute(v);
+      this.emit("selectedChange");
+    };
+    this.status = 2;
+    this.isMousedown = false;
+    this.lineDragging = false;
+    this.isLineValid = true;
+    this.setConfig(props.config);
+    this.prevAxis = {
+      x: 0,
+      y: 0
+    };
+    this.textEditingID = "";
+    this.updateSelectedTextAttribute = this.updateSelectedTextAttribute.bind(this);
+    this.getCurrentSelectedData = this.getCurrentSelectedData.bind(this);
+    this.actionsHistory = new ActionsHistory();
+    this.dependToolConfig = {
+      lineType: tool.ELineTypes.Line
+    };
+  }
+  get isLineSelected() {
+    return this.selectedID && this.activeLine;
+  }
+  get selectedLinePoints() {
+    return this.activeLine ? this.getPointList(this.activeLine) : [];
+  }
+  get isCreate() {
+    return this.status === 0;
+  }
+  get isActive() {
+    return this.status === 1;
+  }
+  get isNone() {
+    return this.status === 2;
+  }
+  get isCurve() {
+    return this.config.lineType === tool.ELineTypes.Curve;
+  }
+  get isMultipleColor() {
+    return this.config.lineColor === tool.ELineColor.MultiColor;
+  }
+  get imageSize() {
+    if (this.rotate % 180 === 0) {
+      return this.basicImgInfo;
+    }
+    return {
+      width: this.basicImgInfo.height,
+      height: this.basicImgInfo.width
+    };
+  }
+  get lineListLen() {
+    return this.lineList.length;
+  }
+  get edgeAdsorptionEnabled() {
+    return this.edgeAdsorption && !this.isCurve && this.lineListLen > 0;
+  }
+  get attributeConfigurable() {
+    return this.config.attributeConfigurable;
+  }
+  get isTextConfigurable() {
+    return this.config.textConfigurable;
+  }
+  get isDependPolygon() {
+    return this.dependToolName === tool.EToolName.Polygon;
+  }
+  get isDependRect() {
+    return this.dependToolName === tool.EToolName.Rect;
+  }
+  get isCurrentAttributeLocked() {
+    return this.attributeLockList.includes(this.defaultAttribute);
+  }
+  get attributeFilteredLines() {
+    if (this.attributeLockList.length > 0) {
+      return this.lineList.filter((v) => this.attributeLockList.includes((v == null ? void 0 : v.attribute) || ""));
+    }
+    return this.lineList;
+  }
+  get enableOutOfTarget() {
+    return this.config.enableOutOfTarget || this.config.outOfTarget || this.config.drawOutsideTarget;
+  }
+  get showOrder() {
+    var _a;
+    return (_a = this.config.showOrder) != null ? _a : this.config.isShowOrder;
+  }
+  get edgeAdsorption() {
+    return this.config.edgeAdsorption;
+  }
+  get attributeList() {
+    return this.config.attributeList;
+  }
+  get lowerLimitPointNum() {
+    return this.config.lowerLimitPointNum;
+  }
+  get upperLimitPointNum() {
+    return this.config.upperLimitPointNum;
+  }
+  get textCheckType() {
+    return this.config.textCheckType;
+  }
+  get customFormat() {
+    return this.config.customFormat;
+  }
+  get dataList() {
+    return this.lineList;
+  }
+  get hasActiveLine() {
+    return this.activeLine && this.activeLine.length > 0;
+  }
+  get viewPortLines() {
+    const viewPort = CanvasUtils.getViewPort(this.canvas, this.currentPos, this.zoom);
+    if (this.isHidden) {
+      return [];
+    }
+    return this.attributeFilteredLines.filter((i) => {
+      var _a;
+      return (_a = i == null ? void 0 : i.pointList) == null ? void 0 : _a.some((p) => CanvasUtils.inViewPort(p, viewPort));
+    });
+  }
+  get lineStyle() {
+    return {
+      lineWidth: this.style.width,
+      color: this.getLineColor(this.defaultAttribute),
+      opacity: this.style.opacity
+    };
+  }
+  get selectedText() {
+    var _a, _b;
+    return (_b = (_a = this.lineList.find((i) => i.id === this.selectedID)) == null ? void 0 : _a.textAttribute) != null ? _b : "";
+  }
+  get currentPageResult() {
+    return this.lineList;
+  }
+  updateStatus(status, resetText = false) {
+    if (status === this.status) {
+      return;
+    }
+    if (resetText) {
+      let defaultText = "";
+      if (this.textCheckType === tool.ETextType.Order && this.isTextConfigurable) {
+        defaultText = AttributeUtils["default"].getTextAttribute(this.lineList, this.textCheckType);
+      }
+      this.emit("updateText", defaultText);
+    }
+    this.status = status;
+    this.lineStatusChanged();
+  }
+  isInBasicPolygon(coord) {
+    var _a, _b;
+    return polygonTool.isInPolygon(coord, ((_a = this.basicResult) == null ? void 0 : _a.pointList) || [], (_b = this.dependToolConfig) == null ? void 0 : _b.lineType);
+  }
+  getPolygonPointList() {
+    if (!this.basicResult) {
+      return [];
+    }
+    const {pointList} = this.basicResult;
+    const {lineType} = this.dependToolConfig;
+    return lineType === tool.ELineTypes.Curve ? polygonTool.createSmoothCurvePoints(pointList.reduce((acc, cur) => {
+      return [...acc, cur.x, cur.y];
+    }, []), 0.5, true, 20) : pointList;
+  }
+  getNextCoordByRenderCoord(renderCoord) {
+    return this.getNextCoordByAbsCoord(this.coordUtils.getAbsCoord(renderCoord));
+  }
+  getNextCoordByAbsCoord(absCoord) {
+    var _a;
+    const preAxis = (_a = this.activeLine) == null ? void 0 : _a.slice(-1)[0];
+    if (preAxis) {
+      return this.coordUtils.getNextCoordByDependTool(absCoord, preAxis);
+    }
+    return absCoord;
+  }
+  pointInLine(pointList, checkPoint, scope) {
+    if (pointList.filter((i) => i).length < 2) {
+      return false;
+    }
+    return pointList.some((point, index) => {
+      if (index === 0) {
+        return false;
+      }
+      const point1 = this.coordUtils.getRenderCoord(pointList[index - 1]);
+      const point2 = this.coordUtils.getRenderCoord(point);
+      return LineToolUtils["default"].isInLine(checkPoint, point1, point2, scope);
+    });
+  }
+  arc(coord, size = POINT_RADIUS, color) {
+    var _a, _b, _c, _d, _e, _f;
+    if (this.ctx) {
+      const {x, y} = coord;
+      (_a = this.ctx) == null ? void 0 : _a.save();
+      (_b = this.ctx) == null ? void 0 : _b.beginPath();
+      this.ctx.fillStyle = color || this.lineStyle.color;
+      (_c = this.ctx) == null ? void 0 : _c.arc(x, y, size, 0, 360);
+      (_d = this.ctx) == null ? void 0 : _d.closePath();
+      (_e = this.ctx) == null ? void 0 : _e.fill();
+      (_f = this.ctx) == null ? void 0 : _f.restore();
+    }
+  }
+  renderActiveArea() {
+    if (this.isActive && this.activeArea && this.ctx) {
+      const {top, left, right, bottom} = this.activeArea;
+      const {x, y} = this.coordUtils.getRenderCoord({x: left, y: top});
+      this.ctx.save();
+      this.ctx.beginPath();
+      this.ctx.strokeStyle = "#B3B8FF";
+      this.ctx.rect(x, y, (right - left) * this.zoom, (bottom - top) * this.zoom);
+      this.ctx.stroke();
+      this.ctx.restore();
+    }
+  }
+  setSelectedIDs(selectedIDs) {
+    this.selectedIDs = selectedIDs;
+    if (this.selectedIDs.length < 2) {
+      this.setSelectedID(this.selectedIDs.length === 1 ? this.selectedIDs[0] : "");
+    }
+    this.render();
+  }
+  setSelectedID(newID) {
+    var _a, _b;
+    const oldID = this.selectedID;
+    if (newID !== oldID && oldID) {
+      (_a = this._textAttributInstance) == null ? void 0 : _a.changeSelected();
+    }
+    if (!newID) {
+      (_b = this._textAttributInstance) == null ? void 0 : _b.clearTextAttribute();
+    }
+    this.selectedID = newID;
+    this.render();
+    this.emit("selectedChange");
+  }
+  addLinePoint(coord) {
+    var _a, _b, _c, _d;
+    this.arc(coord);
+    (_a = this.activeLine) == null ? void 0 : _a.push(__spreadProps(__spreadValues({}, coord), {id: uuid()}));
+    if (((_b = this.activeLine) == null ? void 0 : _b.length) === 1) {
+      (_c = this.actionsHistory) == null ? void 0 : _c.initRecord(this.activeLine);
+    } else {
+      (_d = this.actionsHistory) == null ? void 0 : _d.pushHistory(this.activeLine);
+    }
+    this.render();
+  }
+  setCreatStatusAndAddPoint(coord, isRestText = false) {
+    this.updateStatus(0, isRestText);
+    this.addLinePoint(coord);
+  }
+  isActiveLineValid() {
+    var _a;
+    return this.selectedID ? (_a = this.lineList.find((i) => i.id === this.selectedID)) == null ? void 0 : _a.valid : this.isLineValid;
+  }
+  nextOrder() {
+    return this.lineListLen === 0 ? 1 : this.lineList.slice(-1)[0].order + 1;
+  }
+  getLineColorByAttribute(line, isSelected = false) {
+    return StyleUtils.getStrokeAndFill(this.getColor(line.attribute), line.valid, {isSelected}).stroke;
+  }
+  updateActiveArea() {
+    this.activeArea = this.getActiveArea();
+    this.renderActiveArea();
+  }
+  getActiveArea() {
+    return this.hasActiveLine ? MathUtils["default"].calcViewportBoundaries(this.activeLine, this.isCurve, SEGMENT_NUMBER, this.zoom) : void 0;
+  }
+  drawLineNumber(coord, order = 1, color, label = "", attribute, valid = true) {
+    var _a, _b, _c;
+    if ((this.showOrder || this.attributeConfigurable) && this.ctx) {
+      let text = this.showOrder ? order.toString() : `${label}`;
+      if (this.attributeConfigurable) {
+        const keyForAttribute = attribute ? (_c = (_b = (_a = this.attributeList) == null ? void 0 : _a.find((i) => i.value === attribute)) == null ? void 0 : _b.key) != null ? _c : attribute : "";
+        text = [text, `${!valid && keyForAttribute ? "\u65E0\u6548" : ""}${keyForAttribute}`].filter((i) => i).join("_");
+      }
+      this.drawText(coord, text, color);
+    }
+  }
+  drawLineTextAttribute(coord, color, text) {
+    if (coord && text) {
+      return this.drawText(coord, text, color, 200);
+    }
+  }
+  drawLineLength(pointList, color) {
+    var _a;
+    if (((_a = this.config) == null ? void 0 : _a.showLineLength) && pointList) {
+      const length = pointList.reduce((pre, next, index) => {
+        if (index <= 0 || !pointList[index - 1].actual || !next.actual) {
+          return pre;
+        }
+        return pre + LineToolUtils["default"].calcDistance(pointList[index - 1].actual, next.actual);
+      }, 0);
+      const renderPos = pointList[pointList.length - 1];
+      this.drawText(renderPos, `l = ${length.toFixed(2)}`, color);
+    }
+  }
+  drawText(coord, text, color, lineWidth) {
+    var _a, _b;
+    if (this.ctx) {
+      (_a = this.ctx) == null ? void 0 : _a.save();
+      this.ctx.font = "italic bold 14px SourceHanSansCN-Regular";
+      this.ctx.fillStyle = color;
+      this.ctx.strokeStyle = color;
+      this.ctx.shadowColor = "rgba(0, 0, 0, 0.6)";
+      this.ctx.shadowOffsetY = 2;
+      this.ctx.shadowBlur = 4;
+      if (lineWidth) {
+        DrawUtils.wrapText(this.canvas, text, coord.x - LINE_ORDER_OFFSET.x, coord.y - LINE_ORDER_OFFSET.y, lineWidth);
+      } else {
+        this.ctx.fillText(text, coord.x - LINE_ORDER_OFFSET.x, coord.y - LINE_ORDER_OFFSET.y);
+      }
+      (_b = this.ctx) == null ? void 0 : _b.restore();
+    }
+  }
+  moveActiveArea(offsetX, offsetY) {
+    if (this.activeArea) {
+      this.activeArea = Object.assign(this.activeArea, {
+        top: this.activeArea.top + offsetY,
+        bottom: this.activeArea.bottom + offsetY,
+        right: this.activeArea.right + offsetX,
+        left: this.activeArea.left + offsetX
+      });
+    }
+    if (this.activeLine) {
+      this.activeLine.map((i) => Object.assign(i, {x: i.x + offsetX, y: i.y + offsetY}));
+      this.updateLines();
+    }
+    this.emit("updateLineByDrag", this.updatedLine);
+  }
+  findHoveredPoint(coord) {
+    if (!this.activeLine) {
+      return;
+    }
+    return this.activeLine.find((i) => {
+      const iAxis = this.coordUtils.getRenderCoord(i);
+      return LineToolUtils["default"].calcDistance(iAxis, coord) <= POINT_ACTIVE_RADIUS;
+    });
+  }
+  findHoverLine(coord) {
+    const line = ___default["default"].cloneDeep(this.lineList).reverse().find(({pointList}) => {
+      const list = pointList ? this.getPointList(pointList) : [];
+      const scope = this.getLineWidthScope();
+      return list.some((point, index) => {
+        if (index === 0) {
+          return false;
+        }
+        const point1 = this.coordUtils.getRenderCoord(point);
+        const point2 = this.coordUtils.getRenderCoord(list[index - 1]);
+        return LineToolUtils["default"].isInLine(coord, point1, point2, scope);
+      });
+    });
+    return line;
+  }
+  getAdsorptionPoint(coord) {
+    let point;
+    let minDistance;
+    let snappedPoint;
+    ___default["default"].cloneDeep(this.lineList).reverse().forEach(({pointList, id}) => {
+      if (id === this.selectedID || !pointList || (pointList == null ? void 0 : pointList.length) < 2) {
+        return;
+      }
+      const nearestPoint = this.findNearestPoint(pointList, coord);
+      if (nearestPoint) {
+        if (nearestPoint.minDistance === 0) {
+          point = nearestPoint.point;
+          return;
+        }
+        if (minDistance === void 0 || nearestPoint.minDistance < minDistance) {
+          point = nearestPoint.point;
+          minDistance = nearestPoint.minDistance;
+        }
+      }
+    });
+    return snappedPoint || point;
+  }
+  findNearestPoint(pointList, coord, minLength = 7) {
+    let point;
+    const minDistance = minLength;
+    for (let i = 1; i <= pointList.length - 1; i++) {
+      const point1 = this.coordUtils.getRenderCoord(pointList[i]);
+      const point2 = this.coordUtils.getRenderCoord(pointList[i - 1]);
+      const {length, footPoint} = MathUtils["default"].getFootOfPerpendicular(coord, point1, point2);
+      const twoPointDistance1 = LineToolUtils["default"].calcTwoPointDistance(point1, coord);
+      const twoPointDistance2 = LineToolUtils["default"].calcTwoPointDistance(point2, coord);
+      if (twoPointDistance1 <= minLength * 2) {
+        point = point1;
+        minLength = 0;
+        break;
+      }
+      if (twoPointDistance2 <= minLength * 2) {
+        point = point2;
+        minLength = 0;
+        break;
+      }
+      if (length < minLength) {
+        point = footPoint;
+        minLength = length;
+      }
+    }
+    return point ? {point, minDistance} : void 0;
+  }
+  getPointList(pointList) {
+    return this.isCurve ? polygonTool.createSmoothCurvePointsFromPointList(pointList, SEGMENT_NUMBER) : pointList;
+  }
+  moveSelectedLine(coord) {
+    const offsetX = (coord.x - this.prevAxis.x) / this.zoom;
+    const offsetY = (coord.y - this.prevAxis.y) / this.zoom;
+    if (this.enableOutOfTarget) {
+      this.lineDragging = true;
+      this.moveActiveArea(offsetX, offsetY);
+      return;
+    }
+    if (this.isDependPolygon) {
+      this.moveLineInPolygon(offsetX, offsetY);
+      return;
+    }
+    let rectHorizontalRange = [0, this.imageSize.width];
+    let rectVerticalRange = [0, this.imageSize.height];
+    if (this.isDependRect) {
+      const {x, y, width, height} = this.basicResult;
+      rectHorizontalRange = [x, x + width];
+      rectVerticalRange = [y, y + height];
+    }
+    this.moveLineInRectRange(offsetX, offsetY, rectHorizontalRange, rectVerticalRange);
+  }
+  moveSelectPoint(coord) {
+    if (!this.selectedPoint) {
+      return;
+    }
+    const offsetX = coord.x - this.prevAxis.x;
+    const offsetY = coord.y - this.prevAxis.y;
+    const newX = (this.selectedPoint ? this.selectedPoint.x : 0) + offsetX / this.zoom;
+    const newY = (this.selectedPoint ? this.selectedPoint.y : 0) + offsetY / this.zoom;
+    const pointPosition = {
+      x: newX,
+      y: newY
+    };
+    Object.assign(this.selectedPoint, this.getNextCoordByAbsCoord(pointPosition));
+    this.updateLines();
+    this.render();
+  }
+  getCoordByConfig(e, coord) {
+    var _a;
+    const isVH = !!e.shiftKey;
+    const disabledAdsorb = e.altKey;
+    if (((_a = this.activeLine) == null ? void 0 : _a.length) > 0 && isVH) {
+      const lastPoint = this.activeLine.slice(-1)[0];
+      return LineToolUtils["default"].getVHPoint(lastPoint, coord, this.coordUtils.getAbsCoord(coord), this.coordUtils.getRenderCoord(lastPoint));
+    }
+    if (this.edgeAdsorptionEnabled && !disabledAdsorb) {
+      return this.getAdsorptionPoint(coord);
+    }
+    return coord;
+  }
+  getNextPoint(e, nextPoint) {
+    const newPoint = this.getCoordByConfig(e, nextPoint) || nextPoint;
+    return this.enableOutOfTarget ? this.coordUtils.getAbsCoord(newPoint) : this.getNextCoordByRenderCoord(newPoint);
+  }
+  lineHover() {
+    this.render();
+  }
+  mouseMoveHandler(e) {
+    const coord = this.getCoordinate(e);
+    const isLeftClick = e.which === 1;
+    if (this.isCreate) {
+      if (this.hasActiveLine) {
+        this.renderNextPoint(e, coord);
+      }
+      return;
+    }
+    if (this.isNone) {
+      this.lineHover();
+      if (this.edgeAdsorptionEnabled && !e.altKey) {
+        const edgeAdsorptionPoint = this.getAdsorptionPoint(coord);
+        if (edgeAdsorptionPoint) {
+          this.arc(edgeAdsorptionPoint);
+        }
+      }
+    }
+    if (this.isActive) {
+      if (this.isMousedown && isLeftClick) {
+        if (this.selectedPoint) {
+          this.moveSelectPoint(coord);
+          return;
+        }
+        if (this.coordsInsideActiveArea) {
+          this.moveSelectedLine(coord);
+          this.drawActivatedLine(void 0, void 0, true);
+          return;
+        }
+      }
+      this.drawHoverPoint(coord);
+      this.render();
+    }
+  }
+  onMouseMove(e) {
+    if (super.onMouseMove(e) || this.forbidMouseOperation || !this.imgInfo) {
+      return;
+    }
+    const coord = this.getCoordinate(e);
+    this.mouseMoveHandler(e);
+    this.prevAxis = coord;
+  }
+  setActiveArea(coord, outsideCancel = false) {
+    const activeLine = this.findHoverLine(coord);
+    if (activeLine) {
+      const index = this.lineList.findIndex((i) => i.id === (activeLine == null ? void 0 : activeLine.id));
+      const area = MathUtils["default"].calcViewportBoundaries((activeLine == null ? void 0 : activeLine.pointList) || [], this.isCurve, SEGMENT_NUMBER, this.zoom);
+      const line = this.lineList[index];
+      this.updateStatus(1);
+      this.setActiveLine(line.pointList);
+      this.setSelectedLineID(line.id);
+      this.activeArea = area;
+      this.updateLineAttributes(line);
+    } else if (outsideCancel) {
+      this.setNoneStatus();
+    }
+    this.render();
+  }
+  setActiveLineByID(id) {
+    const line = this.lineList.find((i) => i.id === id);
+    if (line) {
+      const area = MathUtils["default"].calcViewportBoundaries((line == null ? void 0 : line.pointList) || [], this.isCurve, SEGMENT_NUMBER, this.zoom);
+      this.updateStatus(1);
+      this.setActiveLine(line.pointList);
+      this.setSelectedLineID(line.id);
+      this.activeArea = area;
+      this.updateLineAttributes(line);
+    }
+    this.render();
+  }
+  setActiveLine(pointList) {
+    this.activeLine = pointList ? ___default["default"].cloneDeep(pointList) : void 0;
+  }
+  historyChanged(funcName) {
+    const enableKeyName = `${funcName}Enabled`;
+    if (this.isCreate) {
+      if (this.actionsHistory && this.actionsHistory[enableKeyName]) {
+        const record = this.actionsHistory && this.actionsHistory[funcName]();
+        this.setActiveLine(record);
+        this.render();
+      }
+      return;
+    }
+    if (this.history && this.history[enableKeyName]) {
+      const currentHistory = this.history[funcName]();
+      const activeLine = currentHistory == null ? void 0 : currentHistory.find((i) => i.id === this.selectedID);
+      this.lineList = currentHistory;
+      if (this.selectedID && activeLine) {
+        this.setActiveLine(activeLine == null ? void 0 : activeLine.pointList);
+      } else {
+        this.setNoneStatus();
+      }
+      this.render();
+    }
+    this.emit("dataUpdated", this.lineList);
+  }
+  undo() {
+    this.historyChanged("undo");
+    this.updateSelectedAttributeAfterHistoryChanged();
+  }
+  redo() {
+    this.historyChanged("redo");
+    this.updateSelectedAttributeAfterHistoryChanged();
+  }
+  isCoordInsideTarget(coord) {
+    if (this.isDependPolygon) {
+      return this.isInBasicPolygon(coord);
+    }
+    if (this.isDependRect) {
+      const {x, y, width, height} = this.basicResult;
+      const rectHorizontalRange = [x, x + width];
+      const rectVerticalRange = [y, y + height];
+      return MathUtils["default"].isInRange(coord.x, rectHorizontalRange) && MathUtils["default"].isInRange(coord.y, rectVerticalRange);
+    }
+    return MathUtils["default"].isInRange(coord.x, [0, this.imageSize.width]) && MathUtils["default"].isInRange(coord.y, [0, this.imageSize.height]);
+  }
+  getPointInsertIndex(coord, scope) {
+    if (coord && this.activeLine) {
+      const pointList = this.getPointList(this.activeLine);
+      if (this.activeLine.length === 2) {
+        return 1;
+      }
+      return this.activeLine.findIndex((i, index) => {
+        if (index > 0) {
+          const straightLinePoints = this.activeLine ? this.activeLine[index - 1] : void 0;
+          const points = this.isCurve ? pointList.slice((index - 1) * (SEGMENT_NUMBER + 1), index * (SEGMENT_NUMBER + 1)) : [straightLinePoints, i];
+          return this.pointInLine(points, coord, scope || this.getLineWidthScope());
+        }
+        return false;
+      });
+    }
+    return -1;
+  }
+  getLineWidthScope() {
+    return this.lineStyle.lineWidth;
+  }
+  isMouseCoordOutsideActiveArea() {
+    return !this.coordsInsideActiveArea && !this.selectedPoint;
+  }
+  isLinePointsExceed() {
+    return this.isCreate && this.activeLine && this.upperLimitPointNum && ~~this.upperLimitPointNum <= this.activeLine.length;
+  }
+  isLinePointsNotEnough() {
+    var _a;
+    return this.activeLine && ((_a = this.activeLine) == null ? void 0 : _a.length) < this.lowerLimitPointNum;
+  }
+  updateLineSegmentSpecial(coord) {
+    const specialEdgeIndex = this.getPointInsertIndex(coord, 2) - 1;
+    if (specialEdgeIndex > -1) {
+      const pointData = this.activeLine[specialEdgeIndex];
+      pointData.specialEdge = !pointData.specialEdge;
+      this.hoverLineSegmentIndex = -1;
+      this.render();
+    }
+  }
+  addLinePointToActiveLine() {
+    var _a;
+    const insertIndex = this.getPointInsertIndex(this.cursor);
+    const pointsWithInRange = this.pointsWithinRange(this.activeLine.length + 1);
+    if (this.cursor && insertIndex > -1 && pointsWithInRange) {
+      this.activeLine.splice(insertIndex, 0, __spreadProps(__spreadValues({}, this.coordUtils.getAbsCoord(this.cursor)), {id: uuid()}));
+      this.updateLines();
+      (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+      this.render();
+      this.cursor = void 0;
+    }
+  }
+  onMouseDown(e) {
+    if (super.onMouseDown(e) || this.forbidMouseOperation || !this.imgInfo) {
+      return;
+    }
+    const coord = this.getCoordinate(e);
+    this.isMousedown = true;
+    this.prevAxis = coord;
+    if (e.which === 3) {
+      this.cursor = void 0;
+      return;
+    }
+    this.selectedPoint = this.findHoveredPoint(coord);
+    this.coordsInsideActiveArea = this.isActive && this.activeArea ? LineToolUtils["default"].inArea(this.activeArea, this.coordUtils.getAbsCoord(coord)) : false;
+    this.lineDragging = false;
+  }
+  lineHasChanged() {
+    const line = this.lineList.find((i) => i.id === this.selectedID);
+    return line ? JSON.stringify(line.pointList) !== JSON.stringify(this.activeLine) : false;
+  }
+  updateLines() {
+    const line = this.lineList.find((i) => i.id === this.selectedID);
+    if (line) {
+      line.pointList = ___default["default"].cloneDeep(this.activeLine);
+      this.updatedLine = line;
+      this.emit("dataUpdated", this.lineList);
+    }
+  }
+  onMouseUp(e) {
+    const reset = () => {
+      this.isMousedown = false;
+      this.hoverPointID = void 0;
+      this.cursor = void 0;
+      this.selectedPoint = void 0;
+    };
+    this.hoverPointID = void 0;
+    if (super.onMouseUp(e) || this.forbidMouseOperation || !this.imgInfo) {
+      reset();
+      return;
+    }
+    if (e.which === 1) {
+      this.onLeftClick(e);
+    }
+    if (e.which === 3) {
+      this.onRightClick(e);
+    }
+    reset();
+  }
+  isTextValid(text) {
+    return AttributeUtils["default"].textAttributeValidate(this.textCheckType, this.customFormat, text);
+  }
+  createLineData() {
+    const id = uuid();
+    const newLine = {
+      pointList: ___default["default"].cloneDeep(this.activeLine),
+      id,
+      valid: this.isLineValid,
+      order: this.nextOrder()
+    };
+    newLine.attribute = this.defaultAttribute;
+    return newLine;
+  }
+  stopLineCreating(isAppend = true) {
+    var _a, _b, _c, _d;
+    const setActiveAfterCreating = this.selectedID ? true : !!this.isTextConfigurable;
+    let selectedID;
+    if (isAppend) {
+      if (this.selectedID) {
+        const line = this.lineList.find((i) => i.id === this.selectedID);
+        selectedID = this.selectedID;
+        if (line) {
+          line.pointList = ___default["default"].cloneWith(this.activeLine);
+          if (!___default["default"].isEqual(line.pointList, (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList))) {
+            (_b = this.history) == null ? void 0 : _b.pushHistory(this.lineList);
+          }
+        }
+      } else if (this.isCreate && this.activeLine && this.activeLine.length > 1) {
+        const newLine = this.createLineData();
+        selectedID = newLine.id;
+        this.setLineList([...this.lineList, newLine]);
+        this.emit("lineCreated", newLine, this.zoom, this.currentPos);
+        (_c = this.history) == null ? void 0 : _c.pushHistory(this.lineList);
+      }
+    }
+    if (setActiveAfterCreating) {
+      this.setActiveStatus(selectedID);
+    } else {
+      this.setNoneStatus();
+    }
+    (_d = this.actionsHistory) == null ? void 0 : _d.empty();
+    this.emit("dataUpdated", this.lineList);
+    this.render();
+  }
+  setActiveStatus(id) {
+    const line = id ? this.lineList.find((i) => i.id === id) : void 0;
+    if (line) {
+      const pointList = line == null ? void 0 : line.pointList;
+      this.updateStatus(1);
+      this.setActiveLine(pointList);
+      this.setSelectedLineID(id);
+    } else {
+      this.setNoneStatus();
+    }
+  }
+  setNoneStatus(updateStatus = true) {
+    if (updateStatus) {
+      this.updateStatus(2);
+    }
+    this.activeLine = [];
+    this.setSelectedLineID(void 0);
+    this.activeArea = void 0;
+    this.isLineValid = true;
+    this.cursor = void 0;
+  }
+  setKeyDownStatus(e, value) {
+    this.isShift = value != null ? value : e.keyCode === keyCode.Shift;
+  }
+  continueToEdit() {
+    var _a;
+    this.updateStatus(0);
+    this.cursor = void 0;
+    (_a = this.actionsHistory) == null ? void 0 : _a.pushHistory(this.activeLine);
+    this.render();
+  }
+  setInvalidLineOnCreating(e) {
+    if (this.selectedID && e.keyCode !== keyCode.Ctrl || !this.isCreate) {
+      return;
+    }
+    const valid = !e.ctrlKey;
+    if (this.selectedID) {
+      this.setInvalidLine(this.selectedID, valid, false);
+    } else {
+      this.isLineValid = valid;
+    }
+  }
+  onKeyDown(e) {
+    super.onKeyDown(e);
+    this.setKeyDownStatus(e);
+    if (e.keyCode === keyCode.Z && !e.ctrlKey) {
+      this.toggleIsHide();
+    }
+    if (e.keyCode === keyCode.Shift) {
+      this.render();
+    }
+    if (e.keyCode === keyCode.Tab) {
+      e.preventDefault();
+      this.selectToNextLine(e);
+      return;
+    }
+    if (this.isCreate) {
+      this.keyboardEventWhileLineCreating(e);
+    }
+    if (this.config.attributeConfigurable) {
+      const keyCode2Attribute = AttributeUtils["default"].getAttributeByKeycode(e.keyCode, this.config.attributeList);
+      if (keyCode2Attribute !== void 0) {
+        this.setDefaultAttribute(keyCode2Attribute);
+      }
+    }
+  }
+  selectToNextLine(e) {
+    const nextSelectedLine = CommonToolUtils.getNextSelectedRectIDByEvent(this.viewPortLines.map((i) => {
+      var _a, _b, _c, _d;
+      return __spreadProps(__spreadValues({}, i), {
+        x: (_b = (_a = i.pointList[0]) == null ? void 0 : _a.x) != null ? _b : 0,
+        y: (_d = (_c = i.pointList[0]) == null ? void 0 : _c.y) != null ? _d : 0
+      });
+    }), e, this.selectedID);
+    if (nextSelectedLine) {
+      this.setActiveLineByID(nextSelectedLine.id);
+    }
+  }
+  keyboardEventWhileLineCreating(e) {
+    if (!this.isCreate) {
+      return;
+    }
+    if (e.keyCode === keyCode.Ctrl) {
+      this.setInvalidLineOnCreating(e);
+    }
+    if ([keyCode.Shift, keyCode.Alt].includes(e.keyCode)) {
+      this.renderNextPoint(e, this.prevAxis);
+    }
+  }
+  renderNextPoint(e, coord) {
+    const nextPoint = this.coordUtils.getRenderCoord(this.getNextPoint(e, coord));
+    this.render(nextPoint);
+  }
+  deleteSelectedLine(coord) {
+    const boundary = MathUtils["default"].calcViewportBoundaries(this.activeLine, this.isCurve, SEGMENT_NUMBER, this.zoom);
+    const axisOnArea = LineToolUtils["default"].inArea(boundary, this.coordUtils.getAbsCoord(coord));
+    if (axisOnArea) {
+      this.deleteLine();
+    }
+  }
+  deleteSelectedLinePoint(selectedID) {
+    var _a;
+    const pointsWithinRange = this.pointsWithinRange(this.activeLine.length - 1);
+    if (pointsWithinRange && selectedID) {
+      this.setActiveLine(this.activeLine.filter((i) => i.id !== selectedID));
+      this.updateLines();
+      (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+    }
+    this.cursor = void 0;
+    this.render();
+  }
+  deleteLine() {
+    var _a;
+    this.lineList = this.lineList.filter((i) => i.id !== this.selectedID);
+    (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+    this.setNoneStatus();
+    this.emit("dataUpdated", this.lineList);
+    this.emit("lineDeleted", this.selectedID);
+    this.render();
+  }
+  setInvalidLine(id, valid, isRender = true) {
+    var _a;
+    const line = this.lineList.find((i) => i.id === id);
+    if (line) {
+      line.valid = valid !== void 0 ? valid : !line.valid;
+      (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+      if (isRender) {
+        this.render();
+      }
+    }
+  }
+  empty() {
+    var _a, _b;
+    this.lineList = [];
+    this.setNoneStatus();
+    this.selectedPoint = void 0;
+    (_a = this.actionsHistory) == null ? void 0 : _a.empty();
+    (_b = this.history) == null ? void 0 : _b.init();
+    this.emit("dataUpdated", this.lineList);
+    this.render();
+  }
+  setAttribute(attribute) {
+    var _a;
+    if (this.attributeConfigurable) {
+      this.defaultAttribute = attribute;
+      this.setLineAttribute("attribute", attribute);
+      if (this.selectedID) {
+        (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+      }
+    }
+  }
+  setTextAttribute(text) {
+    var _a;
+    if (this.isTextConfigurable) {
+      this.setLineAttribute("textAttribute", text);
+      (_a = this.history) == null ? void 0 : _a.applyAttribute(this.selectedID, "textAttribute", text);
+    }
+  }
+  setLineAttribute(key, value, id) {
+    const targetID = id || this.selectedID;
+    if (targetID) {
+      const line = this.lineList.find((i) => i.id === targetID);
+      if (line) {
+        line[key] = value;
+      }
+    }
+    this.render();
+  }
+  updateAttribute(attribute) {
+    this.emit("updateAttribute", attribute);
+  }
+  updateLineAttributes(line) {
+    var _a;
+    if (this.attributeConfigurable && line) {
+      const attribute = (line == null ? void 0 : line.attribute) || "";
+      this.defaultAttribute = attribute;
+      this.updateAttribute(attribute);
+    }
+    if (this.isTextConfigurable && line) {
+      const text = (line == null ? void 0 : line.textAttribute) || "";
+      this.updateTextAttribute(text);
+    }
+    (_a = this.history) == null ? void 0 : _a.updateHistory(this.lineList);
+  }
+  lineStatusChanged() {
+    this.emit("lineStatusChanged", {
+      status: this.status,
+      selectedLineID: this.selectedID
+    });
+  }
+  updateTextAttribute(text) {
+    if (this.selectedID) {
+      const line = this.lineList.find((i) => i.id === this.selectedID);
+      if (line) {
+        line.textAttribute = text;
+      }
+    }
+    this.emit("updateText", text);
+  }
+  saveData() {
+    this.stopLineCreating();
+    this.setNoneStatus();
+    this.render();
+  }
+  setTextEditingID(id) {
+    this.textEditingID = id;
+    this.render();
+  }
+  setSelectedLineID(id) {
+    var _a, _b;
+    if (this.selectedID === id) {
+      return;
+    }
+    const oldID = this.selectedID;
+    if (id !== oldID && oldID) {
+      (_a = this._textAttributeInstance) == null ? void 0 : _a.changeSelected();
+    }
+    if (!id) {
+      (_b = this._textAttributeInstance) == null ? void 0 : _b.clearTextAttribute();
+    }
+    this.selectedID = id;
+    this.emit("selectedChange");
+  }
+  attributeLockListChange(attributeLockList) {
+    this.attributeLockList = attributeLockList;
+    this.render();
+  }
+  setResult(lineList) {
+    this.setNoneStatus();
+    this.setLineList(lineList);
+    this.render();
+  }
+  setConfig(config) {
+    super.setConfig(config);
+  }
+  toggleIsHide() {
+    this.setIsHidden(!this.isHidden);
+    this.render();
+  }
+  clearCanvas() {
+    super.clearCanvas();
+  }
+  clearResult() {
+    this.setResult([]);
+    this.setSelectedLineID(void 0);
+    this.render();
+  }
+  exportData() {
+    return [this.lineList, this.basicImgInfo];
+  }
+  setDefaultAttribute(attribute = "") {
+    var _a;
+    if (this.attributeConfigurable) {
+      this.defaultAttribute = attribute;
+      this.changeStyle(this.defaultAttribute);
+      this.setLineAttribute("attribute", attribute);
+      if (this.selectedID) {
+        (_a = this.history) == null ? void 0 : _a.pushHistory(this.lineList);
+      }
+      this.emit("changeAttributeSidebar");
+    }
+  }
+  getCurrentSelectedData() {
+    var _a, _b;
+    const valid = this.isActiveLineValid();
+    const attribute = this.defaultAttribute;
+    const toolColor = this.getColor(attribute);
+    const color = valid ? toolColor == null ? void 0 : toolColor.valid.stroke : toolColor == null ? void 0 : toolColor.invalid.stroke;
+    const textAttribute = (_b = (_a = this.lineList.find((i) => i.id === this.selectedID)) == null ? void 0 : _a.textAttribute) != null ? _b : "";
+    return {
+      color,
+      textAttribute
+    };
+  }
+  renderTextAttribute() {
+    var _a, _b, _c, _d;
+    if (!this.ctx || !this.activeLine || ((_a = this.activeLine) == null ? void 0 : _a.length) < 2 || this.isCreate) {
+      return;
+    }
+    const valid = this.isActiveLineValid();
+    const attribute = this.defaultAttribute;
+    const {x, y} = this.activeLine[1];
+    const coordinate = this.coordUtils.getRenderCoord({x, y});
+    const toolColor = this.getColor(attribute);
+    const color = valid ? toolColor == null ? void 0 : toolColor.valid.stroke : toolColor == null ? void 0 : toolColor.invalid.stroke;
+    const textAttribute = (_c = (_b = this.lineList.find((i) => i.id === this.selectedID)) == null ? void 0 : _b.textAttribute) != null ? _c : "";
+    if (!this._textAttributeInstance) {
+      this._textAttributeInstance = new textAttributeClass({
+        container: this.container,
+        icon: this.getTextIconSvg(attribute),
+        color,
+        getCurrentSelectedData: this.getCurrentSelectedData,
+        updateSelectedTextAttribute: this.updateSelectedTextAttribute
+      });
+    }
+    if (this._textAttributeInstance && !((_d = this._textAttributeInstance) == null ? void 0 : _d.isExit)) {
+      this._textAttributeInstance.appendToContainer();
+    }
+    this._textAttributeInstance.update(`${textAttribute}`, {
+      left: coordinate.x,
+      top: coordinate.y,
+      color
+    });
+    this._textAttributeInstance.updateIcon(this.getTextIconSvg(attribute));
+  }
+  getTextIconSvg(attribute = "") {
+    return AttributeUtils["default"].getTextIconSvg(attribute, this.config.attributeList, this.config.attributeConfigurable, this.baseIcon);
+  }
+  updateSelectedTextAttribute(newTextAttribute) {
+    if (this._textAttributeInstance && newTextAttribute && this.selectedID) {
+      let textAttribute = newTextAttribute;
+      const textAttributeInvalid = !AttributeUtils["default"].textAttributeValidate(this.config.textCheckType, "", textAttribute);
+      if (textAttributeInvalid) {
+        this.emit("messageError", AttributeUtils["default"].getErrorNotice(this.config.textCheckType, this.lang));
+        textAttribute = "";
+      }
+      this.setTextAttribute(textAttribute);
+      this.emit("updateTextAttribute");
+      this.render();
+    }
+  }
+}
+
+exports.INNER_POINT_RADIUS = INNER_POINT_RADIUS;
+exports.LINE_ORDER_OFFSET = LINE_ORDER_OFFSET;
+exports.POINT_ACTIVE_RADIUS = POINT_ACTIVE_RADIUS;
+exports.POINT_RADIUS = POINT_RADIUS;
+exports.SEGMENT_NUMBER = SEGMENT_NUMBER;
+exports["default"] = LineToolOperation;