/** * Created by Tony on 2017/11/2. */ let JpcCanvasOutput = { offsetX: 10, offsetY: 10, cleanCanvas: function (canvas) { let ctx = canvas.getContext("2d"); ctx.save(); ctx.fillStyle="white"; ctx.clearRect(0,0, canvas.width, canvas.height); ctx.restore(); }, drawToCanvas : function(pageObj, canvas, pageIdx) { let me = this; let ctx = canvas.getContext("2d"); function private_setupAreaH(area, type, fontAngle, dftFontHeight, outputPoint) { let lType = type; if (type !== "left" && type !== "right" && type !== "center") lType = "left"; switch (lType) { case "left": if (fontAngle === JV.VERTICAL_ANGLE_INT) { outputPoint[1] = 1 * area[JV.IDX_TOP] + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_LEFT]; } else if (fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[1] = 1 * area[JV.IDX_BOTTOM] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_LEFT]; } else outputPoint[0] = 1 * area[JV.IDX_LEFT] + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_LEFT]; ctx.textAlign="start"; break; case "right": if (fontAngle === JV.VERTICAL_ANGLE_INT) { outputPoint[1] = 1 * area[JV.IDX_BOTTOM] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_RIGHT]; } else if (fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[1] = 1 * area[JV.IDX_TOP] + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_RIGHT]; } else outputPoint[0] = 1 * area[JV.IDX_RIGHT] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_RIGHT]; ctx.textAlign="end"; break; case "center": if (fontAngle === JV.VERTICAL_ANGLE_INT || fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[1] = (1 * area[JV.IDX_TOP] + 1 * area[JV.IDX_BOTTOM]) / 2; } else outputPoint[0] = (1 * area[JV.IDX_LEFT] + 1 * area[JV.IDX_RIGHT]) / 2; ctx.textAlign="center"; break; } } function private_setupAreaV(area, type, fontAngle, fontName, dftFontHeight, outputPoint) { let lType = type; if (type !== "top" && type !== "bottom" && type !== "center") lType = "top"; switch (lType) { case "top": if (fontAngle === JV.VERTICAL_ANGLE_INT) { outputPoint[0] = 1 * area[JV.IDX_RIGHT] - dftFontHeight - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_TOP]; } else if (fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[0] = 1 * area[JV.IDX_LEFT] + dftFontHeight + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_TOP]; } else outputPoint[1] = 1 * area[JV.IDX_TOP] + dftFontHeight + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_TOP]; break; case "bottom": if (fontAngle === JV.VERTICAL_ANGLE_INT) { outputPoint[0] = 1 * area[JV.IDX_LEFT] + JV.OUTPUT_OFFSET[JV.OFFSET_IDX_BOTTOM]; } else if (fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[0] = 1 * area[JV.IDX_RIGHT] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_BOTTOM]; } else { outputPoint[1] = 1 * area[JV.IDX_BOTTOM] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_BOTTOM]; if (fontName === "宋体") outputPoint[1] = outputPoint[1] - 1; } break; case "center": if (fontAngle === JV.VERTICAL_ANGLE_INT) { outputPoint[0] = (1 * area[JV.IDX_LEFT] + 1 * area[JV.IDX_RIGHT] - dftFontHeight) / 2; } else if (fontAngle === JV.ANTI_VERTICAL_ANGLE_INT) { outputPoint[0] = (1 * area[JV.IDX_LEFT] + 1 * area[JV.IDX_RIGHT] + dftFontHeight) / 2; } else { outputPoint[1] = (1 * area[JV.IDX_TOP] + 1 * area[JV.IDX_BOTTOM] + dftFontHeight) / 2; if (fontName === "宋体") outputPoint[1] = outputPoint[1] - 1; } break; } } function private_drawText(val, area, font, control) { let dftFontHeight = 12; let output = []; if (font) { dftFontHeight = parseFloat(font[JV.FONT_PROPS[1]]); let dftOthers = ""; let dftFontBold = font[JV.FONT_PROPS[3]]; if (dftFontBold && dftFontBold === 'T') { dftOthers = "bold " + dftOthers ; } let dftFontItalic = font[JV.FONT_PROPS[4]]; if (dftFontItalic && dftFontItalic === 'T') { dftOthers = dftOthers + "italic "; } ctx.font = dftOthers + dftFontHeight + "px " + font[JV.PROP_NAME]; } if (control) { private_setupAreaH(area, control.Horizon, parseInt(font.FontAngle), dftFontHeight, output); private_setupAreaV(area, control.Vertical, parseInt(font.FontAngle), font.Name, dftFontHeight, output); } else { private_setupAreaH(area, "left", parseInt(font.FontAngle), dftFontHeight, output); private_setupAreaV(area, "bottom", parseInt(font.FontAngle), font.Name, dftFontHeight, output); } let w = area[JV.IDX_RIGHT] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_RIGHT] - area[JV.IDX_LEFT] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_RIGHT]; if ( parseInt(font.FontAngle) !== 0) { w = area[JV.IDX_BOTTOM] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_BOTTOM] - area[JV.IDX_TOP] - JV.OUTPUT_OFFSET[JV.OFFSET_IDX_TOP]; } function private_drawUnderline() { //A. 暂不支持角度; B. 坐标已经translate //1. 计算下划线的相关坐标 let width = ctx.measureText(val).width; let height = dftFontHeight; // let startX = area[JV.IDX_LEFT], startY = area[JV.IDX_TOP], endX = area[JV.IDX_RIGHT], endY = area[JV.IDX_BOTTOM]; let startX = 0, startY = 0, endX = width, endY = startY; if (control.Horizon === "left") { // 无变化; } else if (control.Horizon === "right") { startX = Math.round(startX - width); } else { startX = Math.round(startX - width / 2); } endX = Math.round(startX + width); if (control.Vertical === "top") { startY += JV.OUTPUT_OFFSET[JV.IDX_TOP] + JV.OUTPUT_OFFSET[JV.IDX_BOTTOM]; } else if (control.Vertical === "bottom") { // startY = Math.round(startY); startY += JV.OUTPUT_OFFSET[JV.IDX_TOP] + JV.OUTPUT_OFFSET[JV.IDX_BOTTOM]; } else { startY = Math.round(height / 2) - JV.OUTPUT_OFFSET[JV.IDX_TOP] - JV.OUTPUT_OFFSET[JV.IDX_BOTTOM]; // startY += JV.OUTPUT_OFFSET[JV.IDX_TOP] + JV.OUTPUT_OFFSET[JV.IDX_BOTTOM]; } endY = Math.round(startY); //2. 画线 // ctx.save(); if ( output[1] !== Math.round(output[1])) { ctx.translate(0,0.5); } ctx.beginPath(); ctx.moveTo(startX, startY); ctx.lineWidth = 1; ctx.strokeStyle = "BLACK"; ctx.lineTo(endX, endY); ctx.stroke(); // ctx.restore(); } ctx.save(); ctx.translate(output[0], output[1]); if (font[JV.FONT_PROPS[5]] === 'T' && parseInt(font.FontAngle) === 0) { private_drawUnderline(); } if (font.FontAngle === JV.VERTICAL_ANGLE) { ctx.rotate(Math.PI/2); } else if (font.FontAngle === JV.ANTI_VERTICAL_ANGLE) { ctx.rotate(-Math.PI/2); } if (w >= ctx.measureText(val).width) { ctx.fillText(val, 0, 0); } else { while (true) { dftFontHeight--; ctx.font = "" + dftFontHeight + "px " + font[JV.PROP_NAME]; if (w >= ctx.measureText(val).width || dftFontHeight < 6) { ctx.fillText(val, 0, 0); break; } } } ctx.restore(); } function private_drawCellText(cell, fonts, controls) { if (cell[JV.PROP_VALUE]) { let values = ("" + cell[JV.PROP_VALUE]).split('|'); let font = null; if (typeof cell[JV.PROP_FONT] === "string") { font = fonts[cell[JV.PROP_FONT]]; } else { font = cell[JV.PROP_FONT]; } //let control = controls[cell[JV.PROP_CONTROL]]; let control = null; if (typeof cell[JV.PROP_CONTROL] === "string") { control = controls[cell[JV.PROP_CONTROL]]; } else { control = cell[JV.PROP_CONTROL]; } if (control.ShowZero === "F") { if (parseFloat(cell[JV.PROP_VALUE]) === 0.0) { values = [""]; } } let height = cell[JV.PROP_AREA][JV.PROP_BOTTOM] - cell[JV.PROP_AREA][JV.PROP_TOP]; let area = [cell[JV.PROP_AREA][JV.PROP_LEFT] + me.offsetX, cell[JV.PROP_AREA][JV.PROP_TOP] + me.offsetY, cell[JV.PROP_AREA][JV.PROP_RIGHT] + me.offsetX, cell[JV.PROP_AREA][JV.PROP_BOTTOM] + me.offsetY]; for (let i = 0; i < values.length; i++) { area[JV.IDX_TOP] = cell[JV.PROP_AREA][JV.PROP_TOP] + i * (height / values.length) + me.offsetY; area[JV.IDX_BOTTOM] = cell[JV.PROP_AREA][JV.PROP_TOP] + (i + 1) * (height / values.length) + me.offsetY; private_drawText(values[i], area, font, control); } } } function private_drawLine(cell, ctx, style, styleBorderDest, startP, destP, mergedBand, styles, isNeedMergeBand) { ctx.beginPath(); let destStyle = style; if (mergedBand) { if (isNeedMergeBand && parseFloat(mergedBand[styleBorderDest]) === parseFloat(cell[JV.PROP_AREA][styleBorderDest])) { destStyle = styles[mergedBand[JV.PROP_STYLE][JV.PROP_ID]]; } } ctx.moveTo(cell[JV.PROP_AREA][startP[0]] + me.offsetX, cell[JV.PROP_AREA][startP[1]] + me.offsetY); if (destStyle[styleBorderDest] && parseFloat(destStyle[styleBorderDest][JV.PROP_LINE_WEIGHT]) !== 0.0) { ctx.lineWidth = 1.0 * destStyle[styleBorderDest][JV.PROP_LINE_WEIGHT]; ctx.strokeStyle = destStyle[styleBorderDest][JV.PROP_COLOR]; ctx.lineTo(cell[JV.PROP_AREA][destP[0]] + me.offsetX, cell[JV.PROP_AREA][destP[1]] + me.offsetY); } ctx.stroke(); } function private_chkIfInMergedBand(mergedBand, cell) { let rst = false; if (mergedBand && cell) { rst = mergedBand[JV.PROP_TOP] <= cell[JV.PROP_AREA][JV.PROP_TOP] && mergedBand[JV.PROP_BOTTOM] >= cell[JV.PROP_AREA][JV.PROP_BOTTOM] && mergedBand[JV.PROP_LEFT] <= cell[JV.PROP_AREA][JV.PROP_LEFT] && mergedBand[JV.PROP_RIGHT] >= cell[JV.PROP_AREA][JV.PROP_RIGHT]; } return rst; } function private_drawCell(cell, fonts, styles, controls, mergedBand) { ctx.save(); ctx.translate(0.5,0.5); let style = styles[cell[JV.PROP_STYLE]]; if (style) { let isNeedMergeBand = private_chkIfInMergedBand(mergedBand, cell); private_drawLine(cell, ctx, style, JV.PROP_TOP, [JV.PROP_LEFT, JV.PROP_TOP],[JV.PROP_RIGHT, JV.PROP_TOP], mergedBand, styles, isNeedMergeBand); private_drawLine(cell, ctx, style, JV.PROP_RIGHT, [JV.PROP_RIGHT, JV.PROP_TOP],[JV.PROP_RIGHT, JV.PROP_BOTTOM], mergedBand, styles, isNeedMergeBand); private_drawLine(cell, ctx, style, JV.PROP_BOTTOM, [JV.PROP_RIGHT, JV.PROP_BOTTOM],[JV.PROP_LEFT, JV.PROP_BOTTOM], mergedBand, styles, isNeedMergeBand); private_drawLine(cell, ctx, style, JV.PROP_LEFT, [JV.PROP_LEFT, JV.PROP_BOTTOM],[JV.PROP_LEFT, JV.PROP_TOP], mergedBand, styles, isNeedMergeBand); } private_drawCellText(cell, fonts, controls); ctx.restore(); } function getIniPageMergeBorder(mergedBand) { let rst = {}; if (mergedBand) { rst[JV.PROP_LEFT] = mergedBand[JV.PROP_LEFT]; rst[JV.PROP_RIGHT] = mergedBand[JV.PROP_RIGHT]; rst[JV.PROP_TOP] = mergedBand[JV.PROP_TOP]; rst[JV.PROP_BOTTOM] = mergedBand[JV.PROP_BOTTOM]; rst[JV.PROP_STYLE] = mergedBand[JV.PROP_STYLE]; } return rst; } if (pageObj && pageObj.items.length > 0 && canvas && pageObj.items.length >= pageIdx) { let page = pageObj.items[pageIdx - 1], fonts = pageObj[JV.NODE_FONT_COLLECTION], styles = pageObj[JV.NODE_STYLE_COLLECTION], controls = pageObj[JV.NODE_CONTROL_COLLECTION], mergedBand = pageObj[JV.BAND_PROP_MERGE_BAND]; let newPageMergeBand = getIniPageMergeBorder(mergedBand); if (page[JV.PROP_PAGE_MERGE_BORDER]) { newPageMergeBand[JV.PROP_LEFT] = page[JV.PROP_PAGE_MERGE_BORDER][JV.PROP_LEFT]; newPageMergeBand[JV.PROP_RIGHT] = page[JV.PROP_PAGE_MERGE_BORDER][JV.PROP_RIGHT]; newPageMergeBand[JV.PROP_TOP] = page[JV.PROP_PAGE_MERGE_BORDER][JV.PROP_TOP]; newPageMergeBand[JV.PROP_BOTTOM] = page[JV.PROP_PAGE_MERGE_BORDER][JV.PROP_BOTTOM]; } for (let j = 0; j < page.cells.length; j++) { let cell = page.cells[j]; // private_drawCell(cell, fonts, styles, controls, mergedBand); private_drawCell(cell, fonts, styles, controls, newPageMergeBand); } } }, highlightConflictArea: function (pageObj, pageIdx) { if (pageObj && pageObj.items.length > 0 && pageObj.items.length >= pageIdx) { let private_create_conflict_line = function () { return {"LineWeight": "1", "DashStyle": "SOLID", "Color": "RED"}; }; let page = pageObj.items[pageIdx - 1], styleConflict = {"Left": private_create_conflict_line(), "Right": private_create_conflict_line(), "Top": private_create_conflict_line(), "Bottom": private_create_conflict_line()} ; pageObj[JV.NODE_STYLE_COLLECTION]["ConflictCell"] = styleConflict; let conflictIds = []; for (let j = 0; j < page.cells.length; j++) { if (conflictIds.indexOf(j) < 0) { let cell1 = page.cells[j]; for (let k = j + 1; k < page.cells.length; k++) { let cell2 = page.cells[k]; //判断area是否有交叉 if (areaConflict(cell1[JV.PROP_AREA], cell2[JV.PROP_AREA])) { conflictIds.push(j); conflictIds.push(k); cell1[JV.PROP_STYLE] = "ConflictCell"; cell2[JV.PROP_STYLE] = "ConflictCell"; } } } } } }, drawPageBorder: function(rptTpl, canvas, resolution) { let me = this; let size = me.getReportSizeInPixel(rptTpl, resolution); let ctx = canvas.getContext("2d"); ctx.save(); ctx.beginPath(); ctx.translate(0.5,0.5); ctx.lineWidth = 1; ctx.moveTo(me.offsetX, me.offsetY); ctx.lineTo(size[0] + me.offsetX, me.offsetY); ctx.lineTo(size[0] + me.offsetX, size[1] + me.offsetY); ctx.lineTo(me.offsetX, size[1] + me.offsetY); ctx.lineTo(me.offsetX, me.offsetY); ctx.stroke(); ctx.restore(); ctx.fillStyle="black"; ctx.fillRect(size[0] + me.offsetX,10 + me.offsetY,10,size[1]); ctx.fillRect(10 + me.offsetX,size[1] + me.offsetY,size[0],10); }, getReportSizeInPixel: function(rptTpl, resolution) { let rst = rptTpl[JV.NODE_PAGE_INFO][JV.NODE_PAGE_SIZE].slice(0); rst[0] = Math.round(resolution[0] * rst[0]); rst[1] = Math.round(resolution[0] * rst[1]); return rst; } }; function areaConflict(area1,area2) { let maxX,maxY,minX,minY, w1 = area1[JV.PROP_RIGHT] - area1[JV.PROP_LEFT], w2 = area2[JV.PROP_RIGHT] - area2[JV.PROP_LEFT], h1 = area1[JV.PROP_BOTTOM] - area1[JV.PROP_TOP], h2 = area2[JV.PROP_BOTTOM] - area2[JV.PROP_TOP] ; //1. 求2个矩形的最小外包矩形 minX = (area1[JV.PROP_LEFT] <= area2[JV.PROP_LEFT]) ? area1[JV.PROP_LEFT] : area2[JV.PROP_LEFT]; minY = (area1[JV.PROP_TOP] <= area2[JV.PROP_TOP]) ? area1[JV.PROP_TOP] : area2[JV.PROP_TOP]; maxX = (area1[JV.PROP_RIGHT] >= area2[JV.PROP_RIGHT]) ? area1[JV.PROP_RIGHT] : area2[JV.PROP_RIGHT]; maxY = (area1[JV.PROP_BOTTOM] >= area2[JV.PROP_BOTTOM]) ? area1[JV.PROP_BOTTOM] : area2[JV.PROP_BOTTOM]; //2. 判断外包矩形与高与宽是否小于俩矩形的高与宽之和(这里的边界条件是小于,等于的话不算;而且是高与宽都得符合条件!) return (maxX - minX < w1 + w2 && maxY - minY < h1 + h2); }