| | |
| | | element.fontSize = element.fontSize * sizeradio |
| | | } else if (element.type === 'qrcode') { |
| | | element.qrcodeWidth = element.qrcodeWidth * ratio |
| | | |
| | | if (element.qrcodeWidth > element.height) { |
| | | element.qrcodeWidth = element.height |
| | | } |
| | | if (element.qrcodeWidth > element.width) { |
| | | element.qrcodeWidth = element.width |
| | | } |
| | | } else if (element.type === 'image') { |
| | | element.imgWidth = element.imgWidth * ratio |
| | | element.imgHeight = element.imgHeight * ratio |
| | |
| | | let textLineSpace = 5 // 绘制时行间距,防止文字重叠 |
| | | context.save() |
| | | |
| | | if (element.rotate) { // 元素旋转时,设置画布旋转角度 |
| | | let _cx = element.left + element.width / 2 |
| | | let _cy = element.top + element.height / 2 |
| | | context.translate(_cx, _cy) // 移动原点 |
| | | context.rotate(element.rotate * Math.PI / 180) |
| | | context.translate(-_cx, -_cy) // 恢复原点 |
| | | } |
| | | // if (element.rotate) { // 元素旋转时,设置画布旋转角度 |
| | | // let _cx = element.left + element.width / 2 |
| | | // let _cy = element.top + element.height / 2 |
| | | // context.translate(_cx, _cy) // 移动原点 |
| | | // context.rotate(element.rotate * Math.PI / 180) |
| | | // context.translate(-_cx, -_cy) // 恢复原点 |
| | | // } |
| | | |
| | | if (debug || selectId === element.uuid) { // 选中元素,设置外部阴影 |
| | | if (selectId === element.uuid) { // 选中元素,设置外部阴影 |
| | | context.shadowBlur = 5 |
| | | context.shadowColor = '#1890ff' |
| | | context.fillStyle = 'white' |
| | | context.fillRect(element.left, element.top, element.width || 1, element.height || 1) |
| | | context.shadowBlur = 0 |
| | | } else if (debug) { |
| | | context.shadowBlur = 3 |
| | | context.shadowColor = 'orange' |
| | | context.fillStyle = 'white' |
| | | context.fillRect(element.left, element.top, element.width || 1, element.height || 1) |
| | | context.shadowBlur = 0 |
| | |
| | | // 绘制边框 |
| | | // context.rect(element.left + element.borderSize / 2, element.top + element.borderSize / 2, element.width - element.borderSize, element.height - element.borderSize) |
| | | if (element.borderSize >= 1) { |
| | | context.beginPath() |
| | | context.strokeStyle = element.borderColor |
| | | context.lineWidth = element.borderSize |
| | | context.rect(element.left, element.top, element.width, element.height) |
| | |
| | | context.fillRect(element.left, element.top, element.width, element.height) |
| | | } |
| | | |
| | | if ((debug || selectId === element.uuid) && element.width > 3 * ratio && element.height > 3 * ratio) { // 选中元素,设置外部阴影 |
| | | if (selectId === element.uuid && element.width > 3 * ratio && element.height > 3 * ratio) { // 选中元素,设置外部阴影 |
| | | context.strokeStyle = '#1890ff' |
| | | context.beginPath() |
| | | context.moveTo(element.left + element.width - 7, element.top + element.height - 2) |
| | |
| | | context.fillStyle = element.fontColor |
| | | |
| | | let lines = element.value.split('\n') |
| | | |
| | | if (!element.value && element.field) { |
| | | if (element.field === 'other_field') { |
| | | lines = [element.cusfield || ''] |
| | | } else { |
| | | lines = [element.field] |
| | | } |
| | | } |
| | | let _y = element.top + element.padding + element.fontSize + element.borderSize |
| | | let _left = element.left + element.borderSize + element.padding |
| | | let _right = element.left + element.width - element.padding - element.borderSize |