//自定义绘制节点的方法 export const paintNodeFunction = function (ctx, onlyShape) { //默认绘制数据类型图片 if (this.properties.typeIcon) { if (this.selected || this.showSelected) { this.drawShape(ctx, onlyShape) } if (this.alpha < 1) { ctx.save() ctx.globalAlpha = this.alpha ctx.drawImage( this.properties.typeIcon, -this.width / 2, -this.height / 2, this.width, this.height ) ctx.restore() } else { ctx.drawImage( this.properties.typeIcon, -this.width / 2, -this.height / 2, this.width, this.height ) } } else { this.drawShape(ctx, onlyShape) } //按节点类型绘制节点边框 if (this.properties.type != "normal") { ctx.beginPath() ctx.arc(0, 0, this.radius + 6, 0, Math.PI * 2) ctx.lineWidth = 8 ctx.strokeStyle = `rgba(${this.fillColor},${this.alpha * 0.4})` ctx.stroke() } else { ctx.beginPath() ctx.arc(0, 0, this.radius + 8, 0, Math.PI * 2) ctx.lineWidth = 12 ctx.setLineDash([4, 4]) ctx.strokeStyle = `rgba(${this.fillColor},${this.alpha * 0.6})` ctx.stroke() } this.paintText(ctx) //调用内部方法绘制文字 } //自定义连线的方法 export const paintLineFunction = function (ctx, needHideText) { this.drawOriginalLine(ctx, needHideText) //内置默认的绘制方法 //指定路径,用于鼠标检测选中 this.path = [ { x: this.source.cx, y: this.source.cy }, { x: this.target.cx, y: this.target.cy } ] // //绘制路径 ctx.beginPath() ctx.moveTo(this.source.cx, this.source.cy) ctx.lineTo(this.target.cx, this.target.cy) this.setLineStyle(ctx) ctx.stroke() // //绘制连线上文字(内部方法) this.paintTextOnLineWithAngle(ctx, this.source, this.target) }