1 line
205 KiB
JavaScript
1 line
205 KiB
JavaScript
"use strict";var TcHmiCharting;!function(TcHmiCharting){TcHmiCharting.Area=class{__canvas;__context=null;__backgroundColor=null;__drawingBorder=0;__areas=[];__areaPositionAndValue=[];__drawLineWithOnePixel=!1;constructor(canvas){this.__canvas=canvas,void 0!==this.__canvas?this.__context=this.__canvas.getContext("2d"):this.__context=null,this.__areaPositionAndValue=[]}draw(xAxis,yAxis){if(this.__areaPositionAndValue.splice(0,this.__areaPositionAndValue.length),null!==this.__context&&null!==this.__backgroundColor){let yAxisLineWidth=yAxis.getAxisWidth();if(null===yAxisLineWidth)return;let offsetTop=yAxis.getDiffEndLabelAndLine()+yAxisLineWidth/2+5+this.__drawingBorder,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let xCalc=xAxis.getLineWidth()/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]);this.__context.beginPath(),this.__context.fillStyle=this.__backgroundColor;let areas=[];for(let i=0,ii=this.__areas.length;i<ii;i++)if(xAxis.getMainTickEndValue()===xAxis.getMainTickStartValue())this.__context.rect(offsetLeft,offsetTop,xAxis.getLineWidth(),yAxis.getLineHeight()),areas.push({xBeginPosition:offsetLeft,xBeginValue:this.__areas[i].beginX,xEndPosition:offsetLeft+xAxis.getLineWidth(),xEndValue:this.__areas[i].endX});else if(this.__drawLineWithOnePixel){let endX=(this.__areas[i].endX-xStartValue)*xCalc+offsetLeft,xEndMiddle=Math.round(endX);this.__context.rect(xEndMiddle-1,offsetTop,1,yAxis.getLineHeight()),areas.push({xBeginPosition:xEndMiddle-1,xBeginValue:this.__areas[i].beginX,xEndPosition:xEndMiddle,xEndValue:this.__areas[i].endX})}else{let beginX=(this.__areas[i].beginX-xStartValue)*xCalc+offsetLeft,endX=(this.__areas[i].endX-xStartValue)*xCalc+offsetLeft,xBeginMiddle=Math.round(beginX),xEndMiddle=Math.round(endX);this.__context.rect(xBeginMiddle,offsetTop,xEndMiddle-xBeginMiddle,yAxis.getHeight()),areas.push({xBeginPosition:xBeginMiddle,xBeginValue:this.__areas[i].beginX,xEndPosition:xEndMiddle,xEndValue:this.__areas[i].endX})}this.__context.fill(),this.__areaPositionAndValue=areas.splice(0)}}setCanvas(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}getCanvas(){return this.__canvas}setDrawingBorder(drawingBorder){this.__drawingBorder=drawingBorder}getAreas(){return this.__areas}removeAllAreas(){this.__areas.splice(0,this.__areas.length),this.__areaPositionAndValue.splice(0,this.__areaPositionAndValue.length)}getAreasPositionAndValue(){return this.__areaPositionAndValue}addArea(area){this.__areas.push(area)}setBackgroundColor(backgroundColor){this.__backgroundColor=backgroundColor}getBackgroundColor(){return this.__backgroundColor}setDrawLineWithOnePixel(drawLineWithOnePixel=!1){this.__drawLineWithOnePixel=drawLineWithOnePixel}getDrawLineWithOnePixel(){return this.__drawLineWithOnePixel}}}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class IChart{__elementRoot;__canvasFrame=null;__canvasDrawing=null;__canvasLines=null;__contextFrame=null;__contextDrawing=null;__contextLines=null;__canvasGraph=null;__yAxis;__xAxis=null;__grid=null;__subgrid=null;__referenceLines;__referenceLinesPosition=IChart.Position.Background;__hasChanged;__yAxisWidth=null;__yLabelFontFamily=null;__yLabelFontSize=null;__yLabelFontSizeUnit="px";__yLabelFontWeight=null;__yShowLabels=!0;__yMainTickSteps=null;__ySubTickSteps=null;__showYSubTicks=!0;constructor(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition){this.__elementRoot=elementRoot,this.__yAxis=[],this.__referenceLines=[],this.__hasChanged=!1,this.__referenceLinesPosition=referenceLinesPosition,this.__initCanvas(canvasWidth,canvasHeight)}addXAxis(){if(this.__canvasFrame){let xAxis=new TcHmiCharting.XAxis(1,this.__canvasFrame);this.__xAxis=xAxis,this.__hasChanged=!0}}addYAxis(position){if(this.__canvasFrame){let yAxis=new TcHmiCharting.YAxis(this.__yAxis.length+1,this.__canvasFrame,position);this.__yAxis.push(yAxis),this.__hasChanged=!0}}addYAxisAtPosition(index,position){if(this.__canvasFrame){let yAxis=new TcHmiCharting.YAxis(this.__yAxis.length+1,this.__canvasFrame,position);this.__yAxis.splice(index,0,yAxis),this.__hasChanged=!0}}addGrid(){this.__canvasFrame&&(this.__grid=new TcHmiCharting.Grid(this.__canvasFrame),this.__hasChanged=!0)}deleteGrid(){this.__grid=null,this.__hasChanged=!0}addSubgrid(){this.__canvasFrame&&(this.__subgrid=new TcHmiCharting.Subgrid(this.__canvasFrame),this.__hasChanged=!0)}deleteSubgrid(){this.__subgrid=null,this.__hasChanged=!0}addReferenceLine(){if(this.__canvasLines){let referenceLine=new TcHmiCharting.ReferenceLine(this.__canvasLines);this.__referenceLines.push(referenceLine),this.__hasChanged=!0}}addReferenceLineAtPosition(index){if(this.__canvasLines){let referenceLine=new TcHmiCharting.ReferenceLine(this.__canvasLines);this.__referenceLines.splice(index,0,referenceLine),this.__hasChanged=!0}}remove(){this.__canvasFrame&&this.__canvasFrame.parentNode&&this.__canvasFrame.parentNode.removeChild(this.__canvasFrame),this.__canvasDrawing&&this.__canvasDrawing.parentNode&&this.__canvasDrawing.parentNode.removeChild(this.__canvasDrawing),this.__canvasLines&&this.__canvasLines.parentNode&&this.__canvasLines.parentNode.removeChild(this.__canvasLines)}clear(width,height){let deviceDPI=window.devicePixelRatio;width*=deviceDPI,height*=deviceDPI,!this.__canvasFrame||!this.__contextFrame||this instanceof TcHmiCharting.PieChart||(this.__contextFrame.clearRect(0,0,this.__canvasFrame.width,this.__canvasFrame.height),this.__canvasFrame.width=width,this.__canvasFrame.height=height,this.__contextFrame.scale(deviceDPI,deviceDPI)),this.__canvasDrawing&&this.__contextDrawing&&(this.__contextDrawing.clearRect(0,0,this.__canvasDrawing.width,this.__canvasDrawing.height),this.__canvasDrawing.width=width,this.__canvasDrawing.height=height,this.__contextDrawing.scale(deviceDPI,deviceDPI)),!this.__canvasLines||!this.__contextLines||this instanceof TcHmiCharting.PieChart||(this.__contextLines.clearRect(0,0,this.__canvasLines.width,this.__canvasLines.height),this.__canvasLines.width=width,this.__canvasLines.height=height,this.__contextLines.scale(deviceDPI,deviceDPI))}getYAxis(){return this.__yAxis}getYAxisAtPosition(index){return this.__yAxis[index]}getReferenceLines(){return this.__referenceLines}getReferenceLinesAtPosition(index){return this.__referenceLines[index]}getXAxis(){return this.__xAxis}getGrid(){return this.__grid}getSubgrid(){return this.__subgrid}getYAxisWidth(){return this.__yAxisWidth}getYLabelFontFamily(){return this.__yLabelFontFamily}getYLabelFontSize(){return this.__yLabelFontSize}getYLabelFontSizeUnit(){return this.__yLabelFontSizeUnit}getYLabelFontWeight(){return this.__yLabelFontWeight}getYShowLabels(){return this.__yShowLabels}getYMainTickSteps(){return this.__yMainTickSteps}getYSubTickSteps(){return this.__ySubTickSteps}getCanvasDrawing(){return this.__canvasDrawing?$(this.__canvasDrawing):null}getCanvasFrame(){return this.__canvasFrame?$(this.__canvasFrame):null}getCanvasLines(){return this.__canvasLines?$(this.__canvasLines):null}getHasChanged(){return this.__hasChanged}setYAxisWidth(yAxisWidth){this.__yAxisWidth=yAxisWidth;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setAxisWidth(this.__yAxisWidth);this.__hasChanged=!0}setYLabelFontFamily(labelFontFamily){if(labelFontFamily)this.__yLabelFontFamily=labelFontFamily;else if(this.__canvasFrame){const inheritedFontfamily=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasFrame,"font-family")["font-family"];this.__yLabelFontFamily=inheritedFontfamily||null}for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setLabelFontFamily(this.__yLabelFontFamily);this.__hasChanged=!0}setYLabelFontSize(labelFontSize){if(labelFontSize)this.__yLabelFontSize=labelFontSize;else if(this.__canvasDrawing){const inheritedFontSize=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasDrawing,"font-size")["font-size"];this.__yLabelFontSize=inheritedFontSize?parseFloat(inheritedFontSize):null}this.__yLabelFontSize=labelFontSize;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setLabelFontSize(this.__yLabelFontSize);this.__hasChanged=!0}setYLabelFontSizeUnit(labelFontSizeUnit){}setYLabelFontWeight(labelFontWeight){if(labelFontWeight&&"Auto"!==labelFontWeight)this.__yLabelFontWeight=labelFontWeight;else if(this.__canvasFrame){const inheritedFontWeight=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasFrame,"font-weight")["font-weight"];this.__yLabelFontWeight=inheritedFontWeight||null}for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setLabelFontWeight(this.__yLabelFontWeight);this.__hasChanged=!0}setYShowLabels(yShowLabels){this.__yShowLabels=yShowLabels;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setShowLabels(this.__yShowLabels);this.__hasChanged=!0}setYMainTickSteps(yMainTickSteps){this.__yMainTickSteps=yMainTickSteps;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setMainTickSteps(this.__yMainTickSteps);this.__hasChanged=!0}setYSubTickSteps(ySubTickSteps){this.__ySubTickSteps=ySubTickSteps;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setSubTickSteps(this.__ySubTickSteps);this.__hasChanged=!0}setShowYSubTicks(showYSubTicks){this.__showYSubTicks=showYSubTicks;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].setShowSubTicks(this.__showYSubTicks);this.__hasChanged=!0}__initCanvas(canvasWidth,canvasHeight){let deviceDPI=window.devicePixelRatio,canvas=document.createElement("canvas"),width=(canvasWidth*deviceDPI).toString(),height=(canvasHeight*deviceDPI).toString();if(this instanceof TcHmiCharting.PieChart||(canvas.setAttribute("height",height),canvas.setAttribute("width",width),canvas.setAttribute("class","TcHmi_Controls_Beckhoff_Controls-chart-canvas-frame"),canvas.setAttribute("style","position:absolute;width:100%;height:100%;"),canvas.style.backgroundColor="transparent",this.__elementRoot[0].appendChild(canvas),this.__canvasFrame=canvas,this.__contextFrame=this.__canvasFrame.getContext("2d"),this.__contextFrame&&this.__contextFrame.scale(deviceDPI,deviceDPI)),this.__referenceLinesPosition===IChart.Position.Background&&!(this instanceof TcHmiCharting.PieChart)){let canvasLines=document.createElement("canvas");canvasLines.setAttribute("height",height),canvasLines.setAttribute("width",width),canvasLines.setAttribute("class","TcHmi_Controls_Beckhoff_Controls-chart-canvas-lines"),canvasLines.style.backgroundColor="transparent",canvasLines.setAttribute("style","position:absolute;width:100%;height:100%;"),this.__elementRoot[0].appendChild(canvasLines),this.__canvasLines=canvasLines,this.__contextLines=this.__canvasLines.getContext("2d"),this.__contextLines&&this.__contextLines.scale(deviceDPI,deviceDPI)}let canvasDrawing=document.createElement("canvas");if(canvasDrawing.setAttribute("height",height),canvasDrawing.setAttribute("width",width),canvasDrawing.setAttribute("class","TcHmi_Controls_Beckhoff_Controls-chart-canvas-drawing"),canvasDrawing.style.backgroundColor="transparent",canvasDrawing.setAttribute("style","position:absolute;width:100%;height:100%;"),this.__elementRoot[0].appendChild(canvasDrawing),this.__canvasDrawing=canvasDrawing,this.__contextDrawing=this.__canvasDrawing.getContext("2d"),this.__contextDrawing&&this.__contextDrawing.scale(deviceDPI,deviceDPI),this.__referenceLinesPosition===IChart.Position.Foreground&&!(this instanceof TcHmiCharting.PieChart)){let canvasLines=document.createElement("canvas");canvasLines.setAttribute("height",height),canvasLines.setAttribute("width",width),canvasLines.setAttribute("class","TcHmi_Controls_Beckhoff_Controls-chart-canvas-lines tchmi-no-pointer-events"),canvasLines.style.backgroundColor="transparent",canvasLines.setAttribute("style","position:absolute;width:100%;height:100%;"),this.__elementRoot[0].appendChild(canvasLines),this.__canvasLines=canvasLines,this.__contextLines=this.__canvasLines.getContext("2d"),this.__contextLines&&this.__contextLines.scale(deviceDPI,deviceDPI)}}setHasChanged(hasChanged){this.__hasChanged=hasChanged}}TcHmiCharting.IChart=IChart,function(IChart){let Position,Orientation;!function(Position){Position[Position.Background=0]="Background",Position[Position.Foreground=1]="Foreground"}(Position=IChart.Position||(IChart.Position={})),function(Orientation){Orientation[Orientation.Horizontal=0]="Horizontal",Orientation[Orientation.Vertical=1]="Vertical"}(Orientation=IChart.Orientation||(IChart.Orientation={}))}(IChart=TcHmiCharting.IChart||(TcHmiCharting.IChart={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class LineChart extends TcHmiCharting.IChart{__lineGraph;__lineGraphs;__lineChanged;__widthLeft=null;__drawingBorder=0;constructor(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition){super(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition),this.__lineGraph=[],this.__lineGraphs=[],this.__lineChanged=!1}deleteYAxis(index){for(let i=0,ii=this.__lineGraph.length;i<ii;i++){const tempLineGraph=this.__lineGraph[i];null!==tempLineGraph.yAxis&&tempLineGraph.yAxis.getId()===this.__yAxis[index].getId()&&(tempLineGraph.yAxis=null)}this.__yAxis.splice(index,1),this.setHasChanged(!0)}deleteAllYAxis(){this.__yAxis.splice(0,this.__yAxis.length);for(let i=0,ii=this.__lineGraph.length;i<ii;i++)this.__lineGraph[i].yAxis=null;this.setHasChanged(!0)}deleteAllReferenceLines(){this.__referenceLines.splice(0,this.__referenceLines.length),this.setHasChanged(!0)}addGraph(newGraph){this.__canvasFrame&&(this.__lineGraph.push(newGraph),this.__lineGraphs.push(new TcHmiCharting.LineGraph(this.__canvasFrame)),this.__lineChanged=!0)}deleteGraph(index){this.__lineGraph.splice(index,1),this.__lineGraphs[index].removePoints(),this.__lineGraphs.splice(index,1),this.__lineChanged=!0}deleteAllGraphs(){this.__lineGraph.splice(0,this.__lineGraph.length);for(let i=0,ii=this.__lineGraphs.length;i<ii;i++)this.__lineGraphs[i].removePoints();this.__lineGraphs.splice(0,this.__lineGraphs.length),this.__lineChanged=!0}remove(){super.remove(),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllGraphs(),this.__xAxis=null}clear(width,height){super.clear(width,height),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null}getLines(){return this.__lineGraph}getLinesAtPosition(index){return this.__lineGraph[index]}getLineGraphs(){return this.__lineGraphs}getLineGraphsAtPosition(index){return this.__lineGraphs[index]}getDrawingBorder(){return this.__drawingBorder}setLineChanged(lineChanged){this.__lineChanged=lineChanged}draw(defaultDistance=5){if(null!==this.__canvasFrame&&void 0!==this.__canvasFrame){let canvasWidth=this.__canvasFrame.width/window.devicePixelRatio,canvasHeight=this.__canvasFrame.height/window.devicePixelRatio;if(null!==this.__xAxis&&void 0!==this.__xAxis){if(this.getHasChanged()){if(null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextLines&&this.__contextLines.clearRect(0,0,canvasWidth,canvasHeight),this.__drawingBorder=0,null!==this.__grid){let gridLineWidth=this.__grid.getLineWidth()||0;this.__drawingBorder=gridLineWidth/2}this.__drawingBorder<defaultDistance&&(this.__drawingBorder=defaultDistance);let xAxisHeight=0,startValueX=null,endValueX=null;if(this.__xAxis.setMainTickStartValueOverride(null),this.__xAxis.setMainTickEndValueOverride(null),this.__xAxis.getAutoScaling()){for(let j=0,jj=this.__lineGraph.length;j<jj;j++){const scaleFactor=this.__lineGraphs[j].getXScaleFactor();for(let k=0,kk=this.__lineGraph[j].points.length;k<kk;k++)(null===startValueX||startValueX>this.__lineGraph[j].points[k].x*scaleFactor)&&(startValueX=this.__lineGraph[j].points[k].x*scaleFactor),(null===endValueX||endValueX<this.__lineGraph[j].points[k].x*scaleFactor)&&(endValueX=this.__lineGraph[j].points[k].x*scaleFactor)}if(null!==startValueX&&null!==endValueX){let overrideStartX=startValueX,overrideEndX=endValueX;overrideStartX===overrideEndX&&overrideStartX>Number.MAX_SAFE_INTEGER?(overrideStartX-=.1*overrideStartX/100,overrideEndX+=.1*overrideEndX/100):startValueX===endValueX?(overrideStartX-=.5,overrideEndX+=.5):(overrideStartX=Math.floor(startValueX-1),overrideEndX=Math.ceil(endValueX+1)),this.__xAxis.setMainTickStartValueOverride(overrideStartX),this.__xAxis.setMainTickEndValueOverride(overrideEndX)}}if(this.__xAxis.drawAxis({x:0,y:canvasHeight},{x:canvasWidth,y:canvasHeight}),xAxisHeight=this.__xAxis.getHeight(),xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance,null!==this.__yAxis&&void 0!==this.__yAxis&&this.__yAxis.length>0){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight);let widthLeft=defaultDistance,widthRight=defaultDistance,showOnlyYAxis=!1,biggestFirst=0,biggestLatest=0,existsLogarithmicAxis=!1;for(let h=0,hh=this.__yAxis.length;h<hh;h++){this.__yAxis[h].setMainTickStartValueOverride(null),this.__yAxis[h].setMainTickEndValueOverride(null);let startValue=null,endValue=null;if(this.__yAxis[h].getAutoScaling())for(let j=0,jj=this.__lineGraph.length;j<jj;j++){const scaleFactor=this.__lineGraphs[j].getYScaleFactor(),tempLineGraph=this.__lineGraph[j];if(null!==tempLineGraph.yAxis&&tempLineGraph.yAxis.getId()===this.__yAxis[h].getId()){for(let k=0,kk=this.__lineGraph[j].points.length;k<kk;k++)(null===startValue||startValue>this.__lineGraph[j].points[k].y*scaleFactor)&&(startValue=this.__lineGraph[j].points[k].y*scaleFactor),(null===endValue||endValue<this.__lineGraph[j].points[k].y*scaleFactor)&&(endValue=this.__lineGraph[j].points[k].y*scaleFactor);if(null!==startValue&&null!==endValue){let overrideStart=startValue,overrideEnd=endValue;overrideStart===overrideEnd&&overrideStart>Number.MAX_SAFE_INTEGER?(overrideStart-=.1*overrideStart/100,overrideEnd+=.1*overrideEnd/100):startValue===endValue?tempLineGraph.yAxis.getLogarithmicScale()?(overrideStart-=.1,overrideEnd+=1):(overrideStart-=.5,overrideEnd+=.5):(overrideStart=Math.floor(startValue-1),overrideEnd=Math.ceil(endValue+1)),this.__yAxis[h].setMainTickStartValueOverride(overrideStart),this.__yAxis[h].setMainTickEndValueOverride(overrideEnd)}}}let yAxis=this.__yAxis[h],labelArray=yAxis.getCalculatedLabels();if(yAxis.getShowAxis()&&yAxis.getShowLabels()){let callback=yAxis.getYAxisCallback(),mainTickSteps=yAxis.getMainTickSteps();if(null!==callback){if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[0])]));first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[mainTickSteps-1])]));latest>biggestLatest&&(biggestLatest=latest)}}else{if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(labelArray[0]);first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(labelArray[mainTickSteps-1]);latest>biggestLatest&&(biggestLatest=latest)}}}this.__yAxis[h].getLogarithmicScale()&&(existsLogarithmicAxis=!0)}for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__xAxis.getShowAxis()||(showOnlyYAxis=!0),this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight-this.__drawingBorder},{x:widthLeft,y:defaultDistance+this.__drawingBorder},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthLeft=widthLeft+10+this.__yAxis[i].getWidth())):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight-this.__drawingBorder},{x:canvasWidth-widthRight,y:defaultDistance+this.__drawingBorder},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthRight=widthRight+10+this.__yAxis[i].getWidth()));canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0});let xAxisMainTickSteps=this.__xAxis.getMainTickSteps(),yAxisWidth=this.getYAxisWidth(),yAxisSubTickSteps=this.__ySubTickSteps,xAxisSubTickSteps=this.__xAxis.getSubTickSteps(),showGridHorizontal=!!this.__grid&&this.__grid.getShowHorizontalLines(),showGridVertical=!!this.__grid&&this.__grid.getShowVerticalLines(),showSubgridHorizontal=!!this.__subgrid&&this.__subgrid.getShowHorizontalLines(),showSubgridVertical=!!this.__subgrid&&this.__subgrid.getShowVerticalLines(),gridBackgroundColor=this.__grid?this.__grid.getBackgroundColor():null;if(yAxisWidth){if(this.__contextFrame&&gridBackgroundColor&&(this.__contextFrame.fillStyle=gridBackgroundColor,showOnlyYAxis?this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder):this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,canvasHeight-xAxisHeight-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder)),existsLogarithmicAxis||this.__xAxis.getLogarithmicScale()){let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let horizontalStartForGridLines=[],horizontalStartForSubgridLines=[],beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;for(let i=0,ii=this.__yAxis.length;i<ii;i++){let steps=this.__yAxis[i].getMainTickSteps()||0,yDiffMain=this.__yAxis[i].getLineHeight()/(steps-1)!=1/0?this.__yAxis[i].getLineHeight()/(steps-1):0;for(let j=0,jj=steps;j<jj;j++)if(horizontalStartForGridLines.push(beginY-j*yDiffMain),!this.__yAxis[i].getLogarithmicScale()&&j<steps-1&&yAxisSubTickSteps){let yDiffSub=yDiffMain/(yAxisSubTickSteps+1)!==1/0?yDiffMain/(yAxisSubTickSteps+1):0;for(let k=0,kk=yAxisSubTickSteps;k<kk;k++)horizontalStartForSubgridLines.push(beginY-j*yDiffMain-(k+1)*yDiffSub)}if(this.__yAxis[i].getLogarithmicScale()){let yPoints=this.__yAxis[i].getLogarithmicYPointsForSubgrid();for(let k=0,kk=yPoints.length;k<kk;k++)horizontalStartForSubgridLines.push(yPoints[k])}}let uniqueGridArray=horizontalStartForGridLines.filter(function(item,pos){return horizontalStartForGridLines.indexOf(item)===pos}),uniqueSubgridArray=horizontalStartForSubgridLines.filter(function(item,pos){return horizontalStartForSubgridLines.indexOf(item)===pos}),horizontalGridLines=[],horizontalSubgridLines=[];for(let i=0,ii=uniqueGridArray.length;i<ii;i++)this.__grid&&this.__grid.getShowHorizontalLines()&&horizontalGridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth(),y:uniqueGridArray[i]},end:{x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:uniqueGridArray[i]}});for(let i=0,ii=uniqueSubgridArray.length;i<ii;i++)this.__subgrid&&this.__subgrid.getShowHorizontalLines()&&horizontalSubgridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth(),y:uniqueSubgridArray[i]},end:{x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:uniqueSubgridArray[i]}});let verticalGridLines=[],verticalSubgridLines=[],yValue=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;if(xAxisMainTickSteps&&xAxisSubTickSteps){let xDiffMain=this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1)!=1/0?this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1):0,xDiffSub=xDiffMain/(xAxisSubTickSteps+1)!==1/0?xDiffMain/(xAxisSubTickSteps+1):0;for(let i=0,ii=xAxisMainTickSteps;i<ii;i++)if(this.__grid&&this.__grid.getShowVerticalLines()&&verticalGridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain,y:yValue},end:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain,y:yValue-this.__yAxis[0].getLineHeight()}}),!this.__xAxis.getLogarithmicScale()&&i<xAxisMainTickSteps-1)for(let k=0,kk=xAxisSubTickSteps;k<kk;k++)this.__subgrid&&this.__subgrid.getShowVerticalLines()&&verticalSubgridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain+(k+1)*xDiffSub,y:yValue},end:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain+(k+1)*xDiffSub,y:yValue-this.__yAxis[0].getLineHeight()}})}if(this.__xAxis.getLogarithmicScale()){let xPoints=this.__xAxis.getLogarithmicXPointsForSubgrid();for(let k=0,kk=xPoints.length;k<kk;k++)this.__subgrid&&this.__subgrid.getShowVerticalLines()&&verticalSubgridLines.push({start:{x:xPoints[k],y:yValue},end:{x:xPoints[k],y:yValue-this.__yAxis[0].getLineHeight()}})}(showSubgridHorizontal||showSubgridVertical)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle()&&this.__subgrid.drawLines(verticalSubgridLines,horizontalSubgridLines),(showGridHorizontal||showGridVertical)&&this.__grid&&null!==this.__grid.getLineColor()&&null!==this.__grid.getLineWidth()&&null!==this.__grid.getLineStyle()&&this.__grid.drawLines(verticalGridLines,horizontalGridLines)}else{let yAxisMainTickSteps=this.__yMainTickSteps,xAxisWidth=this.__xAxis.getAxisWidth();null!==yAxisMainTickSteps&&null!==xAxisWidth&&xAxisMainTickSteps&&xAxisSubTickSteps&&(this.__subgrid&&this.__grid&&(showOnlyYAxis?this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2-this.__drawingBorder},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,0,{width:this.__drawingBorder,height:this.__drawingBorder}):this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-yAxisWidth/2-this.__drawingBorder},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,0,{width:this.__drawingBorder,height:this.__drawingBorder})),this.__grid&&(showOnlyYAxis?this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,{width:this.__drawingBorder,height:this.__drawingBorder}):this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,y:canvasHeight-xAxisHeight-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,{width:this.__drawingBorder,height:this.__drawingBorder})))}this.drawReferenceLines(showOnlyYAxis,defaultDistance)}this.__lineChanged=!0,this.__widthLeft=this.__xAxis.getXAxisLeftWidth()}}if(this.__lineChanged)if(null!==this.__yAxis&&void 0!==this.__yAxis)if(this.__yAxis.length>0){this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);let canvasElem=this.__elementRoot.find(".TcHmi_Controls_Beckhoff_Controls-chart-canvas-drawing")[0];for(let i=0,ii=this.__lineGraph.length;i<ii;i++)if(null!==this.__lineGraph[i].yAxis&&void 0!==this.__lineGraph[i].yAxis){let lineGraph=this.__lineGraphs[i];lineGraph.setCanvas(canvasElem),lineGraph.setDrawingBorder(this.__drawingBorder),lineGraph.draw(this.__lineGraph[i],this.__xAxis)}this.__lineChanged=!1}else this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);else this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);this.setHasChanged(!1)}else this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight)}}drawReferenceLines(showOnlyYAxis,defaultDistance=5){let yAxisWidth=this.getYAxisWidth();if(this.__canvasFrame&&this.__xAxis&&yAxisWidth&&this.__referenceLines){let canvasHeight=this.__canvasFrame.height/window.devicePixelRatio,xAxisHeight=this.__xAxis.getHeight();xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance;let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;for(let i=0,ii=this.__referenceLines.length;i<ii;i++)if(this.__referenceLines[i].getShow())if(this.__referenceLines[i].getOrientation()===TcHmiCharting.ReferenceLine.Orientation.Horizontal){let yAxisId=this.__referenceLines[i].getYAxisId();const index=this.__yAxis.findIndex(elem=>elem.getId()===yAxisId);if(-1!==index){let yAxis=this.__yAxis[index];if(yAxis)if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=yAxis.getLineHeight()*valuePercent/100,startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,yMainTickSteps=yAxis.getMainTickSteps();if(yAxis.getLogarithmicScale()&&yMainTickSteps&&yMainTickSteps>=2){let yAxisLength=yAxis.getLineHeight(),y=yAxisLength+(yAxis.getDiffEndLabelAndLine()+(yAxis.getAxisWidth()||0)/2+defaultDistance+this.__drawingBorder)-(Math.log10(value)-Number(yAxis.getCalculatedNumbers()[0].toExponential().split("e")[1]))*(yAxisLength/(yMainTickSteps-1)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let startValue=yAxis.getMainTickStartValueOverride()||yAxis.getMainTickStartValue()||0,multiplier=Math.pow(10,yAxis.getDecimalPlaces()||0),min=Math.round(startValue*multiplier)/multiplier,endValue=yAxis.getMainTickEndValueOverride()||yAxis.getMainTickEndValue()||0,multiplierMax=Math.pow(10,yAxis.getDecimalPlaces()||0),max=Math.round(endValue*multiplierMax)/multiplierMax;if(value>=min&&value<=max){let diffPixel=(value-min)*(yAxis.getLineHeight()/(max-min)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}else{let offsetLeft=this.__xAxis.getXAxisLeftWidth()||0;if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__xAxis.getLineWidth()*valuePercent/100,startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,xMainTickSteps=this.__xAxis.getMainTickSteps();if(this.__xAxis.getLogarithmicScale()&&xMainTickSteps&&xMainTickSteps>=2){let xAxisLength=this.__xAxis.getLineWidth(),x=offsetLeft+(Math.log10(value)-Number(this.__xAxis.getCalculatedNumbers()[0].toExponential().split("e")[1]))*(xAxisLength/(xMainTickSteps-1)),startPoint={x,y:beginY},endPoint={x,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let min=this.__xAxis.getMainTickStartValueOverride()||this.__xAxis.getMainTickStartValue()||0,max=this.__xAxis.getMainTickEndValueOverride()||this.__xAxis.getMainTickEndValue()||0;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__xAxis.getLineWidth()/(max-min)),startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}}}TcHmiCharting.LineChart=LineChart}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class LineAreaChart extends TcHmiCharting.IChart{__lineGraph;__lineGraphs;__lineChanged;__widthLeft=null;__drawingBorder=0;constructor(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition){super(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition),this.__lineGraph=[],this.__lineGraphs=[],this.__lineChanged=!1}deleteYAxis(index){for(let i=0,ii=this.__lineGraph.length;i<ii;i++){const tempLineGraph=this.__lineGraph[i];tempLineGraph.yAxis&&tempLineGraph.yAxis.getId()===this.__yAxis[index].getId()&&(tempLineGraph.yAxis=null)}this.__yAxis.splice(index,1),this.setHasChanged(!0)}deleteAllYAxis(){this.__yAxis.splice(0,this.__yAxis.length);for(let i=0,ii=this.__lineGraph.length;i<ii;i++)this.__lineGraph[i].yAxis=null;this.setHasChanged(!0)}deleteAllReferenceLines(){this.__referenceLines.splice(0,this.__referenceLines.length),this.setHasChanged(!0)}addGraph(newGraph){this.__canvasFrame&&(this.__lineGraph.push(newGraph),this.__lineGraphs.push(new TcHmiCharting.LineAreaGraph(this.__canvasFrame)),this.__lineChanged=!0)}deleteGraph(index){this.__lineGraph.splice(index,1),this.__lineGraphs[index].removePoints(),this.__lineGraphs[index].removeAreaPoints(),this.__lineGraphs[index].deleteAllAreas(),this.__lineGraphs.splice(index,1),this.__lineChanged=!0}deleteAllGraphs(){this.__lineGraph.splice(0,this.__lineGraph.length);for(let i=0,ii=this.__lineGraphs.length;i<ii;i++)this.__lineGraphs[i].removePoints(),this.__lineGraphs[i].removeAreaPoints(),this.__lineGraphs[i].deleteAllAreas();this.__lineGraphs.splice(0,this.__lineGraphs.length),this.__lineChanged=!0}remove(){super.remove(),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null}clear(width,height){super.clear(width,height),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null}getLines(){return this.__lineGraph}getLinesAtPosition(index){return this.__lineGraph[index]}getLineGraphs(){return this.__lineGraphs}getLineGraphsAtPosition(index){return this.__lineGraphs[index]}getDrawingBorder(){return this.__drawingBorder}setLineChanged(lineChanged){this.__lineChanged=lineChanged}draw(defaultDistance=5){if(null!==this.__canvasFrame&&void 0!==this.__canvasFrame){let canvasWidth=this.__canvasFrame.width/window.devicePixelRatio,canvasHeight=this.__canvasFrame.height/window.devicePixelRatio;if(null!==this.__xAxis&&void 0!==this.__xAxis){if(this.getHasChanged()){if(null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextLines&&this.__contextLines.clearRect(0,0,canvasWidth,canvasHeight),this.__drawingBorder=0,null!==this.__grid){let gridLineWidth=this.__grid.getLineWidth()||0;this.__drawingBorder=gridLineWidth/2}this.__drawingBorder<defaultDistance&&(this.__drawingBorder=defaultDistance);let xAxisHeight=0,startValueX=null,endValueX=null;if(this.__xAxis.setMainTickStartValueOverride(null),this.__xAxis.setMainTickEndValueOverride(null),this.__xAxis.getAutoScaling()){for(let j=0,jj=this.__lineGraph.length;j<jj;j++)for(let k=0,kk=this.__lineGraph[j].points.length;k<kk;k++)(null===startValueX||startValueX>this.__lineGraph[j].points[k].x)&&(startValueX=this.__lineGraph[j].points[k].x),(null===endValueX||endValueX<this.__lineGraph[j].points[k].x)&&(endValueX=this.__lineGraph[j].points[k].x);null!==startValueX&&null!==endValueX&&(startValueX===endValueX&&startValueX>Number.MAX_SAFE_INTEGER?(startValueX-=.1*startValueX/100,endValueX+=.1*endValueX/100):startValueX===endValueX&&(startValueX-=.5,endValueX+=.5),this.__xAxis.setMainTickStartValueOverride(startValueX),this.__xAxis.setMainTickEndValueOverride(endValueX))}if(this.__xAxis.drawAxis({x:0,y:canvasHeight},{x:canvasWidth,y:canvasHeight}),xAxisHeight=this.__xAxis.getHeight(),xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance,null!==this.__yAxis&&void 0!==this.__yAxis&&this.__yAxis.length>0){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight);let widthLeft=defaultDistance,widthRight=defaultDistance,showOnlyYAxis=!1,biggestFirst=0,biggestLatest=0;for(let h=0,hh=this.__yAxis.length;h<hh;h++){this.__yAxis[h].setMainTickStartValueOverride(null),this.__yAxis[h].setMainTickEndValueOverride(null);let startValue=null,endValue=null;if(this.__yAxis[h].getAutoScaling())for(let j=0,jj=this.__lineGraph.length;j<jj;j++){const tempLineGraph=this.__lineGraph[j],scaleFactor=this.__lineGraphs[j].getScaleFactor();if(tempLineGraph.yAxis&&tempLineGraph.yAxis.getId()===this.__yAxis[h].getId()){for(let k=0,kk=this.__lineGraph[j].points.length;k<kk;k++){let yValue=this.__lineGraph[j].points[k].y;void 0!==yValue&&((null===startValue||startValue>yValue*scaleFactor)&&(startValue=yValue*scaleFactor),(null===endValue||yValue&&endValue<yValue*scaleFactor)&&(endValue=yValue*scaleFactor))}if(null!==startValue&&null!==endValue){let overrideStart=startValue,overrideEnd=endValue;startValue===endValue?overrideStart===overrideEnd&&overrideStart>Number.MAX_SAFE_INTEGER?(overrideStart-=.1*overrideStart/100,overrideEnd+=.1*overrideEnd/100):tempLineGraph.yAxis.getLogarithmicScale()?(overrideStart-=.1,overrideEnd+=1):(overrideStart-=.5,overrideEnd+=.5):(overrideStart=Math.floor(startValue-1),overrideEnd=Math.ceil(endValue+1)),this.__yAxis[h].setMainTickStartValueOverride(overrideStart),this.__yAxis[h].setMainTickEndValueOverride(overrideEnd)}}}let yAxis=this.__yAxis[h],labelArray=yAxis.getCalculatedLabels();if(yAxis.getShowAxis()&&yAxis.getShowLabels()){let callback=yAxis.getYAxisCallback(),mainTickSteps=yAxis.getMainTickSteps();if(null!==callback){if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[0])]));first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[mainTickSteps-1])]));latest>biggestLatest&&(biggestLatest=latest)}}else{if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(labelArray[0]);first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(labelArray[mainTickSteps-1]);latest>biggestLatest&&(biggestLatest=latest)}}}}let existsLogarithmicAxis=!1;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__xAxis.getShowAxis()||(showOnlyYAxis=!0),this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight-this.__drawingBorder},{x:widthLeft,y:defaultDistance+this.__drawingBorder},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthLeft=widthLeft+10+this.__yAxis[i].getWidth())):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight-this.__drawingBorder},{x:canvasWidth-widthRight,y:defaultDistance+this.__drawingBorder},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthRight=widthRight+10+this.__yAxis[i].getWidth())),this.__yAxis[i].getLogarithmicScale()&&(existsLogarithmicAxis=!0);canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0});let xAxisMainTickSteps=this.__xAxis.getMainTickSteps(),yAxisMainTickSteps=this.__yMainTickSteps,xAxisWidth=this.__xAxis.getAxisWidth(),yAxisWidth=this.getYAxisWidth();if(null!==xAxisMainTickSteps&&null!==yAxisMainTickSteps&&null!==xAxisWidth&&null!==yAxisWidth){let xAxisSubTickSteps=this.__xAxis.getSubTickSteps(),yAxisSubTickSteps=this.__ySubTickSteps,showGridHorizontal=!!this.__grid&&this.__grid.getShowHorizontalLines(),showGridVertical=!!this.__grid&&this.__grid.getShowVerticalLines(),showSubgridHorizontal=!!this.__subgrid&&this.__subgrid.getShowHorizontalLines(),showSubgridVertical=!!this.__subgrid&&this.__subgrid.getShowVerticalLines(),gridBackgroundColor=this.__grid?this.__grid.getBackgroundColor():null;if(this.__contextFrame&&gridBackgroundColor&&(this.__contextFrame.fillStyle=gridBackgroundColor,showOnlyYAxis?this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder):this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,canvasHeight-xAxisHeight-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder)),existsLogarithmicAxis||this.__xAxis.getLogarithmicScale()){let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let horizontalStartForGridLines=[],horizontalStartForSubgridLines=[],beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;for(let i=0,ii=this.__yAxis.length;i<ii;i++){let steps=this.__yAxis[i].getMainTickSteps()||0,yDiffMain=this.__yAxis[i].getLineHeight()/(steps-1)!=1/0?this.__yAxis[i].getLineHeight()/(steps-1):0;for(let j=0,jj=steps;j<jj;j++)if(horizontalStartForGridLines.push(beginY-j*yDiffMain),!this.__yAxis[i].getLogarithmicScale()&&j<steps-1&&yAxisSubTickSteps){let yDiffSub=yDiffMain/(yAxisSubTickSteps+1)!==1/0?yDiffMain/(yAxisSubTickSteps+1):0;for(let k=0,kk=yAxisSubTickSteps;k<kk;k++)horizontalStartForSubgridLines.push(beginY-j*yDiffMain-(k+1)*yDiffSub)}if(this.__yAxis[i].getLogarithmicScale()){let yPoints=this.__yAxis[i].getLogarithmicYPointsForSubgrid();for(let k=0,kk=yPoints.length;k<kk;k++)horizontalStartForSubgridLines.push(yPoints[k])}}let uniqueGridArray=horizontalStartForGridLines.filter(function(item,pos){return horizontalStartForGridLines.indexOf(item)===pos}),uniqueSubgridArray=horizontalStartForSubgridLines.filter(function(item,pos){return horizontalStartForSubgridLines.indexOf(item)===pos}),horizontalGridLines=[],horizontalSubgridLines=[];for(let i=0,ii=uniqueGridArray.length;i<ii;i++)this.__grid&&this.__grid.getShowHorizontalLines()&&horizontalGridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth(),y:uniqueGridArray[i]},end:{x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:uniqueGridArray[i]}});for(let i=0,ii=uniqueSubgridArray.length;i<ii;i++)this.__subgrid&&this.__subgrid.getShowHorizontalLines()&&horizontalSubgridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth(),y:uniqueSubgridArray[i]},end:{x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:uniqueSubgridArray[i]}});let verticalGridLines=[],verticalSubgridLines=[],yValue=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;if(xAxisMainTickSteps&&xAxisSubTickSteps){let xDiffMain=this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1)!=1/0?this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1):0,xDiffSub=xDiffMain/(xAxisSubTickSteps+1)!==1/0?xDiffMain/(xAxisSubTickSteps+1):0;for(let i=0,ii=xAxisMainTickSteps;i<ii;i++)if(this.__grid&&this.__grid.getShowVerticalLines()&&verticalGridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain,y:yValue},end:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain,y:yValue-this.__yAxis[0].getLineHeight()}}),!this.__xAxis.getLogarithmicScale()&&i<xAxisMainTickSteps-1)for(let k=0,kk=xAxisSubTickSteps;k<kk;k++)this.__subgrid&&this.__subgrid.getShowVerticalLines()&&verticalSubgridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain+(k+1)*xDiffSub,y:yValue},end:{x:this.__xAxis.getXAxisLeftWidth()+i*xDiffMain+(k+1)*xDiffSub,y:yValue-this.__yAxis[0].getLineHeight()}})}if(this.__xAxis.getLogarithmicScale()){let xPoints=this.__xAxis.getLogarithmicXPointsForSubgrid();for(let k=0,kk=xPoints.length;k<kk;k++)this.__subgrid&&this.__subgrid.getShowVerticalLines()&&verticalSubgridLines.push({start:{x:xPoints[k],y:yValue},end:{x:xPoints[k],y:yValue-this.__yAxis[0].getLineHeight()}})}(showSubgridHorizontal||showSubgridVertical)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle()&&this.__subgrid.drawLines(verticalSubgridLines,horizontalSubgridLines),(showGridHorizontal||showGridVertical)&&this.__grid&&null!==this.__grid.getLineColor()&&null!==this.__grid.getLineWidth()&&null!==this.__grid.getLineStyle()&&this.__grid.drawLines(verticalGridLines,horizontalGridLines)}else{let yAxisMainTickSteps=this.__yMainTickSteps,xAxisWidth=this.__xAxis.getAxisWidth();null!==yAxisMainTickSteps&&null!==xAxisWidth&&xAxisMainTickSteps&&xAxisSubTickSteps&&(this.__subgrid&&this.__grid&&(showOnlyYAxis?this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2-this.__drawingBorder},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,0,{width:this.__drawingBorder,height:this.__drawingBorder}):this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-yAxisWidth/2-this.__drawingBorder},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,0,{width:this.__drawingBorder,height:this.__drawingBorder})),this.__grid&&(showOnlyYAxis?this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,{width:this.__drawingBorder,height:this.__drawingBorder}):this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder,y:canvasHeight-xAxisHeight-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,{width:this.__drawingBorder,height:this.__drawingBorder})))}this.drawReferenceLines(showOnlyYAxis,defaultDistance)}this.__lineChanged=!0,this.__widthLeft=this.__xAxis.getXAxisLeftWidth()}}if(this.__lineChanged)if(null!==this.__yAxis&&void 0!==this.__yAxis)if(this.__yAxis.length>0){this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);let canvasElem=this.__elementRoot.find(".TcHmi_Controls_Beckhoff_Controls-chart-canvas-drawing")[0];for(let i=0,ii=this.__lineGraph.length;i<ii;i++)if(null!==this.__lineGraph[i].yAxis&&void 0!==this.__lineGraph[i].yAxis){let lineGraph=this.__lineGraphs[i];lineGraph.setCanvas(canvasElem),lineGraph.setDrawingBorder(this.__drawingBorder),lineGraph.drawAreas(this.__lineGraph[i],this.__xAxis)}for(let i=0,ii=this.__lineGraph.length;i<ii;i++)if(null!==this.__lineGraph[i].yAxis&&void 0!==this.__lineGraph[i].yAxis){this.__lineGraphs[i].drawPoints(this.__lineGraph[i],this.__xAxis)}this.__lineChanged=!1}else this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);else this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);this.setHasChanged(!1)}else null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight)}}drawReferenceLines(showOnlyYAxis,defaultDistance=5){let yAxisWidth=this.getYAxisWidth();if(this.__canvasFrame&&this.__xAxis&&yAxisWidth&&this.__referenceLines){let canvasHeight=this.__canvasFrame.height/window.devicePixelRatio,xAxisHeight=this.__xAxis.getHeight();xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance;let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder-yAxisWidth/2;for(let i=0,ii=this.__referenceLines.length;i<ii;i++)if(this.__referenceLines[i].getShow())if(this.__referenceLines[i].getOrientation()===TcHmiCharting.ReferenceLine.Orientation.Horizontal){let yAxisId=this.__referenceLines[i].getYAxisId();const index=this.__yAxis.findIndex(elem=>elem.getId()===yAxisId);if(-1!==index){let yAxis=this.__yAxis[index];if(yAxis){let yMainTickSteps=yAxis.getMainTickSteps();if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=yAxis.getLineHeight()*valuePercent/100,startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0;if(yAxis.getLogarithmicScale()&&yMainTickSteps&&yMainTickSteps>=2){let yAxisLength=yAxis.getLineHeight(),y=yAxisLength+(yAxis.getDiffEndLabelAndLine()+(yAxis.getAxisWidth()||0)/2+defaultDistance+this.__drawingBorder)-(Math.log10(value)-Number(yAxis.getCalculatedNumbers()[0].toExponential().split("e")[1]))*(yAxisLength/(yMainTickSteps-1)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let startValue=yAxis.getMainTickStartValueOverride()||yAxis.getMainTickStartValue()||0,multiplier=Math.pow(10,yAxis.getDecimalPlaces()||0),min=Math.round(startValue*multiplier)/multiplier,endValue=yAxis.getMainTickEndValueOverride()||yAxis.getMainTickEndValue()||0,multiplierMax=Math.pow(10,yAxis.getDecimalPlaces()||0),max=Math.round(endValue*multiplierMax)/multiplierMax;if(value>=min&&value<=max){let diffPixel=(value-min)*(yAxis.getLineHeight()/(max-min)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}}else{let offsetLeft=this.__xAxis.getXAxisLeftWidth()||0,xAxisNumbers=this.__xAxis.getCalculatedNumbers();if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__xAxis.getLineWidth()*valuePercent/100,startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,xMainTickSteps=this.__xAxis.getMainTickSteps();if(this.__xAxis.getLogarithmicScale()&&xMainTickSteps&&xMainTickSteps>=2){let xAxisLength=this.__xAxis.getLineWidth(),x=offsetLeft+(Math.log10(value)-Number(xAxisNumbers[0].toExponential().split("e")[1]))*(xAxisLength/(xMainTickSteps-1)),startPoint={x,y:beginY},endPoint={x,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let min=this.__xAxis.getMainTickStartValueOverride()||this.__xAxis.getMainTickStartValue()||0,max=this.__xAxis.getMainTickEndValueOverride()||this.__xAxis.getMainTickEndValue()||0;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__xAxis.getLineWidth()/(max-min)),startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}}}TcHmiCharting.LineAreaChart=LineAreaChart}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class BarChart extends TcHmiCharting.IChart{__barGraph;__barGraphs;__barChanged;__widthLeft=0;__calcBarWidth=0;__barWidth=null;__barGraphArrangement=null;__drawingBorder={height:0,width:0};constructor(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition){super(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition),this.__barGraph=[],this.__barGraphs=[],this.__barChanged=!1}deleteYAxis(index){for(let i=0,ii=this.__barGraph.length;i<ii;i++){const tempBarGraph=this.__barGraph[i];null!==tempBarGraph.yAxis&&tempBarGraph.yAxis.getId()===this.__yAxis[index].getId()&&(tempBarGraph.yAxis=null)}this.__yAxis.splice(index,1),this.setHasChanged(!0)}deleteAllYAxis(){this.__yAxis.splice(0,this.__yAxis.length);for(let i=0,ii=this.__barGraph.length;i<ii;i++)this.__barGraph[i].yAxis=null;this.setHasChanged(!0)}deleteAllReferenceLines(){this.__referenceLines.splice(0,this.__referenceLines.length),this.setHasChanged(!0)}addGraph(newGraph){this.__canvasFrame&&(this.__barGraph.push(newGraph),this.__barGraphs.push(new TcHmiCharting.BarGraph(this.__canvasFrame)),this.__barChanged=!0)}deleteGraph(index){this.__barGraph.splice(index,1),this.__barGraphs.splice(index,1),this.__barChanged=!0}deleteAllGraphs(){this.__barGraph.splice(0,this.__barGraph.length),this.__barGraphs.splice(0,this.__barGraphs.length),this.__barChanged=!0}remove(){super.remove(),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null,this.__barWidth=null}clear(width,height){super.clear(width,height),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null,this.__barWidth=null}getBars(){return this.__barGraph}getBarsAtPosition(index){return this.__barGraph[index]}getBarGraphs(){return this.__barGraphs}getBarGraphsAtPosition(index){return this.__barGraphs[index]}setBarWidth(barWidth){this.__barWidth=barWidth}setBarGraphArrangement(barGraphArrangement){this.__barGraphArrangement=barGraphArrangement}setBarChanged(barChanged){this.__barChanged=barChanged}draw(defaultDistance=5){if(null!==this.__canvasFrame&&void 0!==this.__canvasFrame){let canvasWidth=this.__canvasFrame.width/window.devicePixelRatio,canvasHeight=this.__canvasFrame.height/window.devicePixelRatio;if(null!==this.__xAxis&&void 0!==this.__xAxis){if(this.getHasChanged()){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextLines&&this.__contextLines.clearRect(0,0,canvasWidth,canvasHeight);let xAxisHeight=0,startValueX=null,endValueX=null;if(this.__xAxis.setMainTickStartValueOverride(null),this.__xAxis.setMainTickEndValueOverride(null),this.__xAxis.getAutoScaling()){for(let j=0,jj=this.__barGraph.length;j<jj;j++)(null===endValueX||endValueX<this.__barGraph[j].values.length-1)&&(endValueX=this.__barGraph[j].values.length-1);startValueX=0,null!==startValueX&&null!==endValueX&&(startValueX===endValueX&&startValueX>Number.MAX_SAFE_INTEGER?(startValueX-=.1*startValueX/100,endValueX+=.1*endValueX/100):startValueX===endValueX&&(startValueX-=.5,endValueX+=.5),this.__xAxis.setMainTickStartValueOverride(startValueX),this.__xAxis.setMainTickEndValueOverride(endValueX))}if(this.__xAxis.drawAxis({x:0,y:canvasHeight},{x:canvasWidth,y:canvasHeight}),xAxisHeight=this.__xAxis.getHeight(),xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance,null!==this.__yAxis&&void 0!==this.__yAxis&&this.__yAxis.length>0){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight);let widthLeft=defaultDistance,widthRight=defaultDistance,showOnlyYAxis=!1,biggestFirst=0,biggestLatest=0;for(let h=0,hh=this.__yAxis.length;h<hh;h++){this.__yAxis[h].setMainTickStartValueOverride(null),this.__yAxis[h].setMainTickEndValueOverride(null);let startValue=0,endValue=null;if(this.__yAxis[h].getAutoScaling())if(this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Stacked){let barGraphsWithYAxis=this.__barGraph.filter((elem,index,obj)=>elem.yAxis&&elem.yAxis.getId()===this.__yAxis[h].getId());if(barGraphsWithYAxis.length>=1){const resultArr=[];for(let j=0,jj=barGraphsWithYAxis.length;j<jj;j++){const scaleFactor=this.__barGraphs[j].getScaleFactor();for(const[index,value]of barGraphsWithYAxis[j].values.entries())resultArr[index]?resultArr[index]+=value*scaleFactor:resultArr[index]=value*scaleFactor}this.__yAxis[h].setMainTickStartValueOverride(Math.min(...resultArr,0)),this.__yAxis[h].setMainTickEndValueOverride(Math.max(...resultArr))}}else for(let j=0,jj=this.__barGraph.length;j<jj;j++){const tempLineGraph=this.__barGraph[j],scaleFactor=this.__barGraphs[j].getScaleFactor();if(null!==tempLineGraph.yAxis&&tempLineGraph.yAxis.getId()===this.__yAxis[h].getId()){for(let k=0,kk=this.__barGraph[j].values.length;k<kk;k++)startValue>this.__barGraph[j].values[k]*scaleFactor&&(startValue=this.__barGraph[j].values[k]*scaleFactor),(null===endValue||endValue<this.__barGraph[j].values[k]*scaleFactor)&&(endValue=this.__barGraph[j].values[k]*scaleFactor);if(null!==startValue&&null!==endValue){let overrideStart=startValue,overrideEnd=endValue;startValue===endValue?tempLineGraph.yAxis.getLogarithmicScale()?(overrideStart-=.1,overrideEnd+=1):overrideStart===overrideEnd&&overrideStart>Number.MAX_SAFE_INTEGER?(overrideStart-=.1*overrideStart/100,overrideEnd+=.1*overrideEnd/100):(overrideStart-=.5,overrideEnd+=.5):(overrideStart=startValue,overrideEnd=endValue),this.__yAxis[h].setMainTickStartValueOverride(overrideStart),this.__yAxis[h].setMainTickEndValueOverride(overrideEnd)}}}let yAxis=this.__yAxis[h],labelArray=yAxis.getCalculatedLabels();if(yAxis.getShowAxis()&&yAxis.getShowLabels()){let callback=yAxis.getYAxisCallback(),mainTickSteps=yAxis.getMainTickSteps();if(null!==callback){if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[0])]));first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[mainTickSteps-1])]));latest>biggestLatest&&(biggestLatest=latest)}}else{if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(labelArray[0]);first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(labelArray[mainTickSteps-1]);latest>biggestLatest&&(biggestLatest=latest)}}}}for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__xAxis.getShowAxis()||(showOnlyYAxis=!0),this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight},{x:widthLeft,y:defaultDistance},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthLeft=widthLeft+10+this.__yAxis[i].getWidth())):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight},{x:canvasWidth-widthRight,y:defaultDistance},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthRight=widthRight+10+this.__yAxis[i].getWidth()));canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder.width,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder.width,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0});let xAxisLabel=this.__xAxis.getCalculatedNumbers(),xAxisMainTickSteps=this.__xAxis.getMainTickSteps(),barWdithDrawingBorder=0;if(null===this.__barWidth)if(this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Stacked)if(this.__barGraph.length>0)if(null!==xAxisMainTickSteps&&xAxisMainTickSteps>1&&0!==xAxisLabel.length){let xCalc=this.__xAxis.getLineWidth()/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]);this.__calcBarWidth=Math.floor(Math.floor(xCalc)*(2/3)),this.__calcBarWidth<1&&(this.__calcBarWidth=1),barWdithDrawingBorder=this.__calcBarWidth}else this.__calcBarWidth=1,barWdithDrawingBorder=this.__calcBarWidth;else this.__calcBarWidth=0,barWdithDrawingBorder=this.__calcBarWidth;else if(this.__barGraph.length>0)if(null!==xAxisMainTickSteps&&xAxisMainTickSteps>1&&0!==xAxisLabel.length){let xCalc=this.__xAxis.getLineWidth()/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]);if(this.__barGraph.length>0){let placeForAllBars=Math.floor(Math.floor(xCalc)*(2/3));barWdithDrawingBorder=placeForAllBars,this.__calcBarWidth=(placeForAllBars-2*(this.__barGraph.length-1))/this.__barGraph.length}else this.__calcBarWidth=Math.floor(Math.floor(xCalc)*(2/3)),barWdithDrawingBorder=this.__calcBarWidth;this.__calcBarWidth<1&&(this.__calcBarWidth=1,barWdithDrawingBorder=this.__calcBarWidth)}else this.__calcBarWidth=1,barWdithDrawingBorder=this.__calcBarWidth;else this.__calcBarWidth=0,barWdithDrawingBorder=this.__calcBarWidth;else this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Stacked?barWdithDrawingBorder=this.__barWidth:(barWdithDrawingBorder=this.__barWidth,this.__barGraph.length>1&&(barWdithDrawingBorder=2*((this.__barGraph.length-1)/2*2+this.__barGraph.length/2*this.__barWidth)));let gridLineWidth=0;null!==this.__grid&&(gridLineWidth=this.__grid.getLineWidth()||0,gridLineWidth/=2),this.__drawingBorder.width=gridLineWidth>barWdithDrawingBorder/2?gridLineWidth:barWdithDrawingBorder/2,this.__drawingBorder.height=gridLineWidth>defaultDistance?gridLineWidth:defaultDistance,this.__drawingBorder.width<defaultDistance&&(this.__drawingBorder.width=defaultDistance),null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),widthLeft=defaultDistance,widthRight=defaultDistance;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight-this.__drawingBorder.height},{x:widthLeft,y:defaultDistance+this.__drawingBorder.height},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),widthLeft=widthLeft+10+this.__yAxis[i].getWidth()):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight-this.__drawingBorder.height},{x:canvasWidth-widthRight,y:defaultDistance+this.__drawingBorder.height},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),widthRight=widthRight+10+this.__yAxis[i].getWidth());if(canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder.width,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder.width,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0}),null===this.__barWidth)if(this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Stacked)if(this.__barGraph.length>0)if(null!==xAxisMainTickSteps&&xAxisMainTickSteps>1&&0!==xAxisLabel.length){let xCalc=this.__xAxis.getLineWidth()/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]);this.__calcBarWidth=Math.floor(Math.floor(xCalc)*(2/3)),this.__calcBarWidth<1&&(this.__calcBarWidth=1)}else this.__calcBarWidth=1;else this.__calcBarWidth=0;else if(this.__barGraph.length>0)if(null!==xAxisMainTickSteps&&xAxisMainTickSteps>1&&0!==xAxisLabel.length){let xCalc=this.__xAxis.getLineWidth()/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]);if(this.__barGraph.length>0){let placeForAllBars=Math.floor(Math.floor(xCalc)*(2/3));this.__calcBarWidth=(placeForAllBars-2*(this.__barGraph.length-1))/this.__barGraph.length}else this.__calcBarWidth=Math.floor(Math.floor(xCalc)*(2/3));this.__calcBarWidth<1&&(this.__calcBarWidth=1)}else this.__calcBarWidth=1;else this.__calcBarWidth=0;let yAxisMainTickSteps=this.__yAxis[0].getMainTickSteps(),xAxisWidth=this.__xAxis.getAxisWidth(),yAxisWidth=this.getYAxisWidth();if(null!==xAxisMainTickSteps&&null!==yAxisMainTickSteps&&null!==xAxisWidth&&null!==yAxisWidth){let xAxisSubTickSteps=this.__xAxis.getSubTickSteps(),yAxisSubTickSteps=this.__ySubTickSteps,showGridHorizontal=!!this.__grid&&this.__grid.getShowHorizontalLines(),showGridVertical=!!this.__grid&&this.__grid.getShowVerticalLines(),showSubgridHorizontal=!!this.__subgrid&&this.__subgrid.getShowHorizontalLines(),showSubgridVertical=!!this.__subgrid&&this.__subgrid.getShowVerticalLines(),gridBackgroundColor=this.__grid?this.__grid.getBackgroundColor():null;if(((showGridHorizontal||showGridVertical)&&this.__grid&&null!==this.__grid.getLineColor()&&null!==this.__grid.getLineWidth()&&null!==this.__grid.getLineStyle()||(showSubgridHorizontal&&null!==yAxisSubTickSteps||showSubgridVertical&&null!==xAxisSubTickSteps)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle())&&this.__contextFrame&&gridBackgroundColor&&(this.__contextFrame.fillStyle=gridBackgroundColor,showOnlyYAxis?this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder.width,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder.height):this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,canvasHeight-xAxisHeight-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder.width,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder.height)),this.__yAxis[0].getLogarithmicScale()){let horizontalSubgridLines=[],logarithmicPoints=this.__yAxis[0].getLogarithmicYPointsForSubgrid();for(let i=0,ii=logarithmicPoints.length;i<ii;i++)this.__subgrid&&this.__subgrid.getShowHorizontalLines()&&horizontalSubgridLines.push({start:{x:this.__xAxis.getXAxisLeftWidth(),y:logarithmicPoints[i]},end:{x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:logarithmicPoints[i]}});(showSubgridHorizontal||showSubgridVertical)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle()&&this.__subgrid.drawLines([],horizontalSubgridLines)}else this.__subgrid&&this.__grid&&(showOnlyYAxis?this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2-this.__drawingBorder.height},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,this.__grid.getLineWidth()||0,this.__drawingBorder):this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-yAxisWidth/2-this.__drawingBorder.height},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,this.__grid.getLineWidth()||0,this.__drawingBorder));if(this.__grid&&(showOnlyYAxis?this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,this.__drawingBorder):this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,y:canvasHeight-xAxisHeight-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,this.__drawingBorder)),this.__referenceLines){let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder.height-yAxisWidth/2;for(let i=0,ii=this.__referenceLines.length;i<ii;i++)if(this.__referenceLines[i].getShow())if(this.__referenceLines[i].getOrientation()===TcHmiCharting.ReferenceLine.Orientation.Horizontal)if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__yAxis[0].getLineHeight()*valuePercent/100,startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,yMainTickSteps=this.__yAxis[0].getMainTickSteps();if(this.__yAxis[0].getLogarithmicScale()&&yMainTickSteps&&yMainTickSteps>=2){let yAxisLength=this.__yAxis[0].getLineHeight(),y=yAxisLength+(this.__yAxis[0].getDiffEndLabelAndLine()+(this.__yAxis[0].getAxisWidth()||0)/2+defaultDistance+this.__drawingBorder.height)-(Math.log10(value)-Number(this.__yAxis[0].getCalculatedNumbers()[0].toExponential().split("e")[1]))*(yAxisLength/(yMainTickSteps-1)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let startValue=this.__yAxis[0].getMainTickStartValueOverride()||this.__yAxis[0].getMainTickStartValue()||0,multiplier=Math.pow(10,this.__yAxis[0].getDecimalPlaces()||0),min=Math.round(startValue*multiplier)/multiplier,endValue=this.__yAxis[0].getMainTickEndValueOverride()||this.__yAxis[0].getMainTickEndValue()||0,multiplierMax=Math.pow(10,this.__yAxis[0].getDecimalPlaces()||0),max=Math.round(endValue*multiplierMax)/multiplierMax;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__yAxis[0].getLineHeight()/(max-min)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}else{let offsetLeft=this.__xAxis.getXAxisLeftWidth()||0;if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__xAxis.getLineWidth()*valuePercent/100,startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,xMainTickSteps=this.__xAxis.getMainTickSteps();if(this.__xAxis.getLogarithmicScale()&&xMainTickSteps&&xMainTickSteps>=2){let xAxisLength=this.__xAxis.getLineWidth(),x=offsetLeft+(Math.log10(value)-Number(this.__xAxis.getCalculatedNumbers()[0].toExponential().split("e")[1]))*(xAxisLength/(xMainTickSteps-1)),startPoint={x,y:beginY},endPoint={x,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let min=this.__xAxis.getMainTickStartValueOverride()||this.__xAxis.getMainTickStartValue()||0,max=this.__xAxis.getMainTickEndValueOverride()||this.__xAxis.getMainTickEndValue()||0;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__xAxis.getLineWidth()/(max-min)),startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}}this.__barChanged=!0,this.__widthLeft=this.__xAxis.getXAxisLeftWidth()}}if(this.__barChanged)if(null!==this.__yAxis&&void 0!==this.__yAxis)if(this.__yAxis.length>0){null!==this.__contextDrawing&&null!==this.__canvasDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);const canvasElem=this.__elementRoot.find(".TcHmi_Controls_Beckhoff_Controls-chart-canvas-drawing")[0];let minValues=[];this.__barGraph.length>=1&&this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked&&(minValues=new Array(this.__barGraph[0].values.length).fill(0));for(let i=0,ii=this.__barGraph.length;i<ii;i++)if(null!==this.__barGraph[i].yAxis&&void 0!==this.__barGraph[i].yAxis){let barGraph=this.__barGraphs[i];barGraph.setCanvas(canvasElem),null===this.__barWidth?barGraph.setBarWidth(this.__calcBarWidth):barGraph.setBarWidth(this.__barWidth),barGraph.setDrawingBorder(this.__drawingBorder),this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Overlapped?barGraph.draw(this.__barGraph[i],this.__xAxis):this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Clustered?barGraph.drawClustered(this.__barGraph[i],this.__xAxis,i):this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked&&barGraph.drawStacked(this.__barGraph[i],this.__xAxis,minValues)}this.__barChanged=!1}else null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);else null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);this.setHasChanged(!1)}else null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight)}}}TcHmiCharting.BarChart=BarChart}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class IAxis{static LOGARITHMIC_Y_MINIMUM=1e5;static LOGARITHMIC_X_MINIMUM=-1e5;static CANVAS_MAX_OVERFLOW=1e5;__showAxis=!0;__showLabels=!0;__mainTickStartValue=null;__mainTickSteps=null;__mainTickEndValue=null;__subTickSteps=null;__showSubTicks=!0;__mainTickStartValueOverride=null;__mainTickEndValueOverride=null;__labelFontFamily=null;__labelFontSize=null;__labelFontSizeUnit="px";__labelFontWeight=null;__labelFontColor=null;__axisWidth=null;__axisColor=null;__showAxisName=!0;__axisName=null;__axisNameFontFamily=null;__axisNameFontSize=null;__axisNameFontSizeUnit="px";__axisNameFontWeight=null;__axisNameFontColor=null;__decimalPlaces=null;__unit=null;__autoScaling=!1;__logarithmicScale=!1;__axisLabeling=IAxis.AxisLabeling.Number;__id;__canvas;__context;constructor(id,canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d"),this.__id=id}getCalculatedLabels(){let labelArray=[],unitString="";if(""!==this.__unit&&null!==this.__unit&&void 0!==this.__unit&&(unitString=" "+this.__unit),null!==this.__mainTickSteps){if(this.__logarithmicScale){let min=1,max=1;null!==this.__mainTickStartValueOverride?min=this.__mainTickStartValueOverride:null!==this.__mainTickStartValue&&(min=this.__mainTickStartValue),null!==this.__mainTickEndValueOverride?max=this.__mainTickEndValueOverride:null!==this.__mainTickEndValue&&(max=this.__mainTickEndValue);let logarithmicExpo=this.ScaleLogarithmic([min,max],this.__mainTickSteps-1);if(1===logarithmicExpo.length)labelArray.push(logarithmicExpo[0]+unitString);else{let diff=logarithmicExpo[1]-logarithmicExpo[0]+1;this.setMainTickSteps(diff);let mainTickWidth=Math.abs(logarithmicExpo[0]-logarithmicExpo[1])/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let powAsString=Math.pow(10,logarithmicExpo[0]+mainTickWidth*i).toPrecision(1);if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(Number(powAsString).toExponential()+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Number){let powSplit=powAsString.split("e");if(1===powSplit.length)labelArray.push(powSplit[0]+unitString);else if(2===powSplit.length&&Number(powSplit[1])<1){let expo=Math.abs(Number(powSplit[1]));labelArray.push(Number(powAsString).toFixed(expo)+unitString)}else labelArray.push(Number(powAsString)+unitString)}else labelArray.push(powAsString+unitString)}}return labelArray}if(this.__autoScaling){if(1===this.__mainTickSteps){if(null!==this.__mainTickStartValueOverride&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),value=this.__mainTickStartValueOverride,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}return labelArray}if(null!==this.__mainTickStartValue&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),value=this.__mainTickStartValue,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}return labelArray}}else if(this.__mainTickSteps>0){if(null!==this.__mainTickEndValueOverride&&null!==this.__mainTickStartValueOverride&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValueOverride-this.__mainTickEndValueOverride)/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let multiplier=Math.pow(10,this.__decimalPlaces),value=i*mainTickWidth+this.__mainTickStartValueOverride,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}}return labelArray}if(null!==this.__mainTickStartValue&&null!==this.__mainTickEndValue&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValue-this.__mainTickEndValue)/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let multiplier=Math.pow(10,this.__decimalPlaces),value=i*mainTickWidth+this.__mainTickStartValue,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}}return labelArray}}}else if(1===this.__mainTickSteps){if(null!==this.__mainTickStartValue&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),value=this.__mainTickStartValue,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}return labelArray}}else if(this.__mainTickSteps>0&&null!==this.__mainTickStartValue&&null!==this.__mainTickEndValue&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValue-this.__mainTickEndValue)/(this.__mainTickSteps-1),multiplier=Math.pow(10,this.__decimalPlaces);for(let i=0;i<=this.__mainTickSteps-1;i++){let value=i*mainTickWidth+this.__mainTickStartValue,roundedValue=Math.round(value*multiplier)/multiplier;if(this.__axisLabeling===IAxis.AxisLabeling.Number)labelArray.push(roundedValue+unitString);else if(this.__axisLabeling===IAxis.AxisLabeling.Scientific)labelArray.push(value.toExponential(this.__decimalPlaces)+unitString);else{let exponentialValue=value.toExponential(this.__decimalPlaces);roundedValue.toString().length<=exponentialValue.length?labelArray.push(roundedValue+unitString):labelArray.push(exponentialValue+unitString)}}return labelArray}}return labelArray}getCalculatedNumbers(){let labelArray=[];if(null!==this.__mainTickSteps){if(this.__logarithmicScale){let min=1,max=1;null!==this.__mainTickStartValueOverride?min=this.__mainTickStartValueOverride:null!==this.__mainTickStartValue&&(min=this.__mainTickStartValue),null!==this.__mainTickEndValueOverride?max=this.__mainTickEndValueOverride:null!==this.__mainTickEndValue&&(max=this.__mainTickEndValue);let logarithmicExpo=this.ScaleLogarithmic([min,max],this.__mainTickSteps-1),diff=logarithmicExpo[1]-logarithmicExpo[0]+1;if(this.setMainTickSteps(diff),1===logarithmicExpo.length)labelArray.push(logarithmicExpo[0]);else{let mainTickWidth=Math.abs(logarithmicExpo[0]-logarithmicExpo[1])/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let logNumber=Math.pow(10,logarithmicExpo[0]+mainTickWidth*i).toPrecision(1);labelArray.push(Number(logNumber))}}return labelArray}if(this.__autoScaling){if(1===this.__mainTickSteps){if(null!==this.__mainTickStartValueOverride&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round(this.__mainTickStartValueOverride*multiplier)/multiplier;labelArray.push(roundedValue)}else if(null!==this.__mainTickStartValue&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round(this.__mainTickStartValue*multiplier)/multiplier;labelArray.push(roundedValue)}}else if(this.__mainTickSteps>0)if(null!==this.__mainTickEndValueOverride&&null!==this.__mainTickStartValueOverride&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValueOverride-this.__mainTickEndValueOverride)/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round((i*mainTickWidth+this.__mainTickStartValueOverride)*multiplier)/multiplier;labelArray.push(roundedValue)}}else if(null!==this.__mainTickStartValue&&null!==this.__mainTickEndValue&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValue-this.__mainTickEndValue)/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round((i*mainTickWidth+this.__mainTickStartValue)*multiplier)/multiplier;labelArray.push(roundedValue)}}return labelArray}if(1===this.__mainTickSteps){if(null!==this.__mainTickStartValue&&null!==this.__decimalPlaces){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round(this.__mainTickStartValue*multiplier)/multiplier;labelArray.push(roundedValue)}}else if(this.__mainTickSteps>0&&null!==this.__mainTickStartValue&&null!==this.__mainTickEndValue&&null!==this.__decimalPlaces){let mainTickWidth=Math.abs(this.__mainTickStartValue-this.__mainTickEndValue)/(this.__mainTickSteps-1);for(let i=0;i<=this.__mainTickSteps-1;i++){let multiplier=Math.pow(10,this.__decimalPlaces),roundedValue=Math.round((i*mainTickWidth+this.__mainTickStartValue)*multiplier)/multiplier;labelArray.push(roundedValue)}}return labelArray}return labelArray}ScaleLogarithmic(connectedRange,divisions){let minValue=connectedRange[0],maxValue=connectedRange[connectedRange.length-1];if(0===divisions)return[1];if(0===maxValue&&(maxValue=1),0===minValue){let maxDeka=this.GetDekade(maxValue),enlargeRange=1;do{minValue=Math.pow(10,maxDeka-divisions*enlargeRange++)}while(minValue>1)}if(maxValue<minValue){let interim=minValue;minValue=maxValue,maxValue=interim}minValue<0&&(maxValue<0?(maxValue=-maxValue,minValue=-minValue):(maxValue=-minValue>maxValue?-minValue:maxValue,minValue=Math.pow(10,this.GetDekade(maxValue)-divisions)));let mindekade=this.GetDekade(minValue);Math.pow(10,mindekade)>minValue&&mindekade--;let maxdekade=this.GetDekade(maxValue);Math.pow(10,maxdekade)<maxValue&&maxdekade++,maxdekade===mindekade&&(mindekade--,maxdekade++);let scaleMin,dekaRange=maxdekade-mindekade,divisionRange=Math.ceil(dekaRange/divisions);return divisionRange<=1?(divisions=dekaRange,scaleMin=mindekade):(scaleMin=maxdekade-(divisions=Math.ceil(dekaRange/divisionRange))*divisionRange,scaleMin+=(mindekade-scaleMin)/2),[scaleMin,scaleMin+divisionRange*divisions]}GetDekade(value){if(0===value)return Number.MAX_VALUE;let absValue=Math.abs(value),retval=Math.log10(absValue);return retval<0?Math.floor(retval):Math.ceil(retval)}calculateLabelWidth(label){let cxt=this.__canvas.getContext("2d");if(null!==cxt&&label&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily){return cxt.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,cxt.measureText(label).width}return 0}calculateLabelHeight(content){return null!==this.__labelFontSize?1.2*this.__labelFontSize:0}calculateAxisNameHeight(content){return null!==this.__axisNameFontSize?1.2*this.__axisNameFontSize:0}calculateAxisNameWidth(content){let cxt=this.__canvas.getContext("2d");if(null!==cxt&&null!==this.__axisNameFontWeight&&null!==this.__axisNameFontSize&&null!==this.__axisNameFontSizeUnit&&null!==this.__axisNameFontFamily){return cxt.font=this.__axisNameFontWeight+" "+this.__axisNameFontSize+this.__axisNameFontSizeUnit+" "+this.__axisNameFontFamily,cxt.measureText(content).width}return 0}getId(){return this.__id}setShowLabels(showLabels){this.__showLabels=showLabels}setShowAxis(showAxis){this.__showAxis=showAxis}getShowAxis(){return this.__showAxis}getShowLabels(){return this.__showLabels}setShowSubTicks(showSubTicks){this.__showSubTicks=showSubTicks}getShowSubTicks(){return this.__showSubTicks}setMainTickStartValue(mainTickStartValue){this.__mainTickStartValue=mainTickStartValue}getMainTickStartValue(){return this.__mainTickStartValue}setMainTickSteps(mainTickSteps){this.__mainTickSteps=mainTickSteps}getMainTickSteps(){return this.__mainTickSteps}setMainTickEndValue(mainTickEndValue){this.__mainTickEndValue=mainTickEndValue}getMainTickEndValue(){return this.__mainTickEndValue}setSubTickSteps(subTickSteps){this.__subTickSteps=subTickSteps}getSubTickSteps(){return this.__subTickSteps}setLabelFontFamily(labelFontFamily){if(labelFontFamily)this.__labelFontFamily=labelFontFamily;else{const inheritedFontfamily=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-family")["font-family"];this.__labelFontFamily=inheritedFontfamily||null}}getLabelFontFamily(){return this.__labelFontFamily}setLabelFontSize(labelFontSize){if(labelFontSize)this.__labelFontSize=labelFontSize;else{const inheritedFontSize=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-size")["font-size"];this.__labelFontSize=inheritedFontSize?parseFloat(inheritedFontSize):null}}getLabelFontSize(){return this.__labelFontSize}setLabelFontSizeUnit(labelFontSizeUnit){}getLabelFontSizeUnit(){return this.__labelFontSizeUnit}setLabelFontWeight(labelFontWeight){if(labelFontWeight&&"Auto"!==labelFontWeight)this.__labelFontWeight=labelFontWeight;else{const inheritedFontWeight=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-weight")["font-weight"];this.__labelFontWeight=inheritedFontWeight||null}}getLabelFontWeight(){return this.__labelFontWeight}setLabelFontColor(labelFontColor){this.__labelFontColor=labelFontColor}getLabelFontColor(){return this.__labelFontColor}setShowAxisName(showAxisName){this.__showAxisName=showAxisName}getShowAxisName(){return this.__showAxisName}setAxisWidth(axisWidth){this.__axisWidth=axisWidth}getAxisWidth(){return this.__axisWidth}setAxisColor(axisColor){this.__axisColor=axisColor}getAxisColor(){return this.__axisColor}getAxisName(){return this.__axisName}setAxisNameFontFamily(axisNameFontFamily){if(axisNameFontFamily)this.__axisNameFontFamily=axisNameFontFamily;else{const inheritedFontfamily=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-family")["font-family"];this.__axisNameFontFamily=inheritedFontfamily||null}}getAxisNameFontFamily(){return this.__axisNameFontFamily}setAxisNameFontSize(axisNameFontSize){if(axisNameFontSize)this.__axisNameFontSize=axisNameFontSize;else{const inheritedFontSize=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-size")["font-size"];this.__axisNameFontSize=inheritedFontSize?parseFloat(inheritedFontSize):null}}getAxisNameFontSize(){return this.__axisNameFontSize}setAxisNameFontSizeUnit(axisNameFontSizeUnit){}getAxisNameFontSizeUnit(){return this.__axisNameFontSizeUnit}setAxisNameFontWeight(axisNameFontWeight){if(axisNameFontWeight&&"Auto"!==axisNameFontWeight)this.__axisNameFontWeight=axisNameFontWeight;else{const inheritedFontWeight=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-weight")["font-weight"];this.__axisNameFontWeight=inheritedFontWeight||null}}getAxisNameFontWeight(){return this.__axisNameFontWeight}setAxisNameFontColor(axisNameFontColor){this.__axisNameFontColor=axisNameFontColor}getAxisNameFontColor(){return this.__axisNameFontColor}setDecimalPlaces(decimalPlaces){this.__decimalPlaces=decimalPlaces}getDecimalPlaces(){return this.__decimalPlaces}setUnit(unit){this.__unit=unit}getUnit(){return this.__unit}setLogarithmicScale(logarithmicScale){this.__logarithmicScale=logarithmicScale}getLogarithmicScale(){return this.__logarithmicScale}setAxisLabeling(axisLabeling){this.__axisLabeling=axisLabeling}getAxisLabeling(){return this.__axisLabeling}setAutoScaling(autoScaling){this.__autoScaling=autoScaling}getAutoScaling(){return this.__autoScaling}setMainTickStartValueOverride(mainTickStartValueOverride){this.__mainTickStartValueOverride=mainTickStartValueOverride}getMainTickStartValueOverride(){return this.__mainTickStartValueOverride}setMainTickEndValueOverride(mainTickEndValueOverride){this.__mainTickEndValueOverride=mainTickEndValueOverride}getMainTickEndValueOverride(){return this.__mainTickEndValueOverride}}TcHmiCharting.IAxis=IAxis,function(IAxis){let Position,AxisLabeling;!function(Position){Position[Position.Left=0]="Left",Position[Position.Right=1]="Right"}(Position=IAxis.Position||(IAxis.Position={})),function(AxisLabeling){AxisLabeling[AxisLabeling.Number=0]="Number",AxisLabeling[AxisLabeling.Scientific=1]="Scientific",AxisLabeling[AxisLabeling.Auto=2]="Auto"}(AxisLabeling=IAxis.AxisLabeling||(IAxis.AxisLabeling={}))}(IAxis=TcHmiCharting.IAxis||(TcHmiCharting.IAxis={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class XAxis extends TcHmiCharting.IAxis{__width=0;__height=0;__lineWidth=0;__diffStartLabelAndLine=0;__diffEndLabelAndLine=0;__xAxisCallback=null;__xAxisLeftWidth=0;__logarithmicXPointsForSubgrid=[];constructor(id,canvas){super(id,canvas)}drawAxis(startPoint,endPoint){if(null!==this.__axisWidth){startPoint.x=startPoint.x+this.__axisWidth/2,endPoint.x=endPoint.x-this.__axisWidth/2;let beginX=startPoint.x,beginY=startPoint.y,endX=endPoint.x,labelArray=this.getCalculatedLabels(),calculatedNumbers=this.getCalculatedNumbers(),mainTickLength=10+this.__axisWidth/2,subTickLength=5+this.__axisWidth/2,startPixelDiffBetweenMain=0;if(null!==this.__mainTickSteps){this.__mainTickSteps>0&&(startPixelDiffBetweenMain=(endPoint.x-startPoint.x)/(this.__mainTickSteps-1));let subTickSteps=0;null!==this.__subTickSteps&&(subTickSteps=this.__subTickSteps);let pixelDiffBetweenMain=startPixelDiffBetweenMain,pixelDiffBetweenSub=pixelDiffBetweenMain/(subTickSteps+1),leftWidth=0;null!==this.__xAxisCallback?this.__showLabels&&void 0!==labelArray[0]&&null!==labelArray[0]&&(leftWidth=this.calculateLabelWidth(this.__xAxisCallback.apply(this,[parseFloat(labelArray[0])]))):this.__showLabels&&void 0!==labelArray[0]&&null!==labelArray[0]&&(leftWidth=this.calculateLabelWidth(labelArray[0]));let rightWidth=0;if(null!==this.__xAxisCallback?this.__showLabels&&void 0!==labelArray[labelArray.length-1]&&null!==labelArray[labelArray.length-1]&&(rightWidth=this.calculateLabelWidth(this.__xAxisCallback.apply(this,[parseFloat(labelArray[labelArray.length-1])]))):this.__showLabels&&void 0!==labelArray[labelArray.length-1]&&null!==labelArray[labelArray.length-1]&&(rightWidth=this.calculateLabelWidth(labelArray[labelArray.length-1])),this.__axisWidth<leftWidth){if(startPoint.x<leftWidth/2&&this.__showAxis){let diff=Math.abs(startPoint.x-this.__axisWidth/2-leftWidth/2);startPoint.x=startPoint.x+diff+5}beginX=startPoint.x}if(this.__xAxisLeftWidth=startPoint.x,this.__axisWidth<rightWidth){let right=this.__canvas.width/window.devicePixelRatio-endPoint.x;if(right<rightWidth/2&&this.__showAxis){let diff=Math.abs(right+this.__axisWidth/2-rightWidth/2);endPoint.x=endPoint.x-diff-5}endX=endPoint.x}startPixelDiffBetweenMain=(endPoint.x-startPoint.x)/(this.__mainTickSteps-1),pixelDiffBetweenMain=startPixelDiffBetweenMain,pixelDiffBetweenSub=pixelDiffBetweenMain/(subTickSteps+1);let height=0;if(this.__showAxisName&&null!==this.__axisName&&(height=this.calculateAxisNameHeight(this.__axisName),this.__showAxis&&null!==this.__context&&null!==this.__axisNameFontWeight&&null!==this.__axisNameFontSize&&null!==this.__axisNameFontFamily&&null!==this.__axisNameFontColor&&(this.__context.font=this.__axisNameFontWeight+" "+this.__axisNameFontSize+this.__axisNameFontSizeUnit+" "+this.__axisNameFontFamily,this.__context.fillStyle=this.__axisNameFontColor,this.__context.textAlign="center",this.__context.beginPath(),this.__context.fillText(this.__axisName,startPoint.x+(endPoint.x-startPoint.x)/2,startPoint.y),this.__context.stroke()),height+=3),this.__showLabels&&this.__mainTickSteps>0&&labelArray.length>0){if(null!==this.__labelFontSize){let highestLabel=1.2*this.__labelFontSize;startPoint.y=startPoint.y-highestLabel/2-height;let xPoint=startPoint.x,yPoint=startPoint.y;if(null!==this.__context&&this.__showAxis&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily&&null!==this.__labelFontColor){for(let i=0;i<=this.__mainTickSteps-1;i++){if(this.__context.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,this.__context.fillStyle=this.__labelFontColor,this.__context.textAlign="center",this.__context.textBaseline="alphabetic",this.__context.beginPath(),null!==this.__xAxisCallback){let formattedValue=this.__xAxisCallback.apply(this,[parseFloat(labelArray[i])]);null===formattedValue&&(formattedValue=""),this.__context.fillText(formattedValue,xPoint,yPoint)}else this.__context.fillText(labelArray[i],xPoint,yPoint);xPoint+=pixelDiffBetweenMain}this.__context.stroke()}startPoint.y=startPoint.y-highestLabel/2-5}}else startPoint.y=startPoint.y-5-height;if(this.__mainTickSteps>0&&this.__showAxis&&null!==this.__context&&null!==this.__axisColor){this.__context.strokeStyle=this.__axisColor,this.__context.lineWidth=this.__axisWidth,this.__context.setLineDash([]),this.__context.beginPath(),this.__logarithmicXPointsForSubgrid=[];for(let i=0;i<=this.__mainTickSteps-1;i++)if(0===i?(this.__context.moveTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),0|startPoint.y),this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5))):i===this.__mainTickSteps?(startPoint.x=startPoint.x+pixelDiffBetweenMain,this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),0|startPoint.y)):(startPoint.x=startPoint.x+pixelDiffBetweenMain,this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),0|startPoint.y),this.__context.moveTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5))),pixelDiffBetweenMain=startPixelDiffBetweenMain,i<=this.__mainTickSteps-2&&0!==this.__subTickSteps&&this.__showSubTicks&&null!==this.__subTickSteps)if(this.__logarithmicScale){let diffPerTick=(calculatedNumbers[i+1]-calculatedNumbers[i])/(this.__subTickSteps+1);for(let j=0;j<=this.__subTickSteps-1;j++){let value=calculatedNumbers[i]+diffPerTick*(j+1),pixelDiff=(Math.log10(value)-Number(calculatedNumbers[i].toExponential().split("e")[1]))*startPixelDiffBetweenMain;startPoint.x=beginX+pixelDiff+startPixelDiffBetweenMain*i,this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),startPoint.y-(mainTickLength-subTickLength)|0),this.__context.moveTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),j===this.__subTickSteps-1&&(pixelDiffBetweenMain-=pixelDiff),this.__logarithmicXPointsForSubgrid.push(startPoint.x)}}else for(let j=0;j<=this.__subTickSteps-1;j++)startPoint.x=startPoint.x+pixelDiffBetweenSub,this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),startPoint.y-(mainTickLength-subTickLength)|0),this.__context.moveTo((0|startPoint.x)+(this.__axisWidth%2==0?0:.5),(startPoint.y-mainTickLength|0)+(this.__axisWidth%2==0?0:.5)),pixelDiffBetweenMain-=pixelDiffBetweenSub;this.__context.stroke()}if(this.__diffStartLabelAndLine=0,this.__diffEndLabelAndLine=0,this.__showLabels)if(this.__mainTickSteps>0){let calculatedLabelWidthStart=0;calculatedLabelWidthStart=null!==this.__xAxisCallback?this.calculateLabelWidth(this.__xAxisCallback.apply(this,[parseFloat(labelArray[0])])):this.calculateLabelWidth(labelArray[0]),this.__axisWidth<calculatedLabelWidthStart&&(this.__diffStartLabelAndLine=calculatedLabelWidthStart/2-this.__axisWidth/2);let calculatedLabelWidthEnd=0;calculatedLabelWidthEnd=null!==this.__xAxisCallback?this.calculateLabelWidth(this.__xAxisCallback.apply(this,[parseFloat(labelArray[labelArray.length-1])])):this.calculateLabelWidth(labelArray[labelArray.length-1]),this.__axisWidth<calculatedLabelWidthEnd&&(this.__diffEndLabelAndLine=calculatedLabelWidthEnd/2-this.__axisWidth/2)}else this.__height=height;this.__width=endX-beginX+this.__diffStartLabelAndLine+this.__diffEndLabelAndLine,this.__height=beginY-(startPoint.y-mainTickLength)+this.__axisWidth/2,this.__lineWidth=endX-beginX,this.__lineWidth<0&&(this.__lineWidth=0),this.__width<0&&(this.__width=0),this.__height<0&&(this.__height=0),this.__showAxis||(this.__height=0),labelArray.splice(0,labelArray.length)}}}setAxisName(axisName){this.__axisName=axisName}getHeight(){return this.__height}getWidth(){return this.__width}getLineWidth(){return this.__lineWidth}getDiffStartLabelAndLine(){return this.__diffStartLabelAndLine}getDiffEndLabelAndLine(){return this.__diffEndLabelAndLine}setXAxisCallback(callback){this.__xAxisCallback=callback}getXAxisCallback(){return this.__xAxisCallback}getXAxisLeftWidth(){return this.__xAxisLeftWidth}getLogarithmicXPointsForSubgrid(){return this.__logarithmicXPointsForSubgrid}}TcHmiCharting.XAxis=XAxis}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class YAxis extends TcHmiCharting.IAxis{__position;__width=0;__height=0;__lineHeight=0;__diffStartLabelAndLine=0;__diffEndLabelAndLine=0;__yAxisCallback=null;__logarithmicYPointsForSubgrid=[];constructor(id,canvas,position){super(id,canvas),this.__position=position}drawAxis(startPoint,endPoint,showOnlyYAxis,labelSize){if(null!==this.__axisWidth){startPoint.y=startPoint.y-this.__axisWidth/2,endPoint.y=endPoint.y+this.__axisWidth/2;let beginY=startPoint.y,endY=endPoint.y,labelArray=this.getCalculatedLabels(),calculatedNumbers=this.getCalculatedNumbers(),mainTickLength=10+this.__axisWidth/2,subTickLength=5+this.__axisWidth/2,startPixelDiffBetweenMain=0;if(null!==this.__mainTickSteps){this.__mainTickSteps>0&&(startPixelDiffBetweenMain=(startPoint.y-endPoint.y)/(this.__mainTickSteps-1));let subTickSteps=0;null!==this.__subTickSteps&&(subTickSteps=this.__subTickSteps);let pixelDiffBetweenMain=startPixelDiffBetweenMain,pixelDiffBetweenSub=pixelDiffBetweenMain/(subTickSteps+1),longestLabelWidth=this.getLongestTextWidth(),height=0;if(showOnlyYAxis&&this.__axisWidth<labelSize.first&&(startPoint.y=startPoint.y-(labelSize.first/2-this.__axisWidth/2)),this.__axisWidth<labelSize.latest&&(endPoint.y=endPoint.y+(labelSize.latest/2-this.__axisWidth/2)),startPixelDiffBetweenMain=(startPoint.y-endPoint.y)/(this.__mainTickSteps-1),pixelDiffBetweenMain=startPixelDiffBetweenMain,pixelDiffBetweenSub=pixelDiffBetweenMain/(subTickSteps+1),this.__position===YAxis.Position.Left){if(this.__showAxisName&&null!==this.__axisName&&(height=this.calculateAxisNameHeight(this.__axisName),this.__showAxis&&null!==this.__context&&null!==this.__axisNameFontWeight&&null!==this.__axisNameFontSize&&null!==this.__axisNameFontFamily&&null!==this.__axisNameFontColor&&(this.__context.save(),this.__context.font=this.__axisNameFontWeight+" "+this.__axisNameFontSize+this.__axisNameFontSizeUnit+" "+this.__axisNameFontFamily,this.__context.fillStyle=this.__axisNameFontColor,this.__context.beginPath(),this.__context.textAlign="center",this.__context.textBaseline="middle",this.__context.translate(startPoint.x+height/2,startPoint.y-(startPoint.y-endPoint.y)/2),this.__context.rotate(-.5*Math.PI),this.__context.fillText(this.__axisName,0,0),this.__context.stroke(),this.__context.restore()),height+=3),this.__showLabels&&this.__mainTickSteps>0&&labelArray.length>0){let yPoint=startPoint.y;if(this.__axisWidth<labelSize.latest?yPoint+=labelSize.latest/2:yPoint=this.__axisWidth/2<labelSize.latest?yPoint+Math.abs(this.__axisWidth/2-labelSize.latest)+(this.__axisWidth-labelSize.latest)/2:yPoint+(this.__axisWidth-labelSize.latest)/2-labelSize.latest/2,null!==this.__context&&this.__showAxis&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily&&null!==this.__labelFontColor){for(let i=0;i<=this.__mainTickSteps-1;i++){if(0!==i&&(yPoint-=pixelDiffBetweenMain),null!==this.__yAxisCallback){let formattedValue=this.__yAxisCallback.apply(this,[parseFloat(labelArray[i])]);null===formattedValue&&(formattedValue=""),labelArray[i]=formattedValue}let xPoint=startPoint.x+(longestLabelWidth-this.calculateLabelWidth(labelArray[i]))+height;this.__context.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,this.__context.fillStyle=this.__labelFontColor,this.__context.textAlign="left",this.__context.textBaseline="bottom",this.__context.beginPath(),this.__context.fillText(labelArray[i],xPoint,yPoint)}this.__context.stroke()}}else longestLabelWidth=-5;if(this.__mainTickSteps>0&&null!==this.__context&&this.__showAxis&&null!==this.__axisColor){this.__context.strokeStyle=this.__axisColor,this.__context.lineWidth=this.__axisWidth,this.__context.setLineDash([]),this.__context.beginPath(),this.__logarithmicYPointsForSubgrid=[];for(let i=0;i<=this.__mainTickSteps-1;i++)if(0===i?(this.__context.moveTo(startPoint.x+(longestLabelWidth+5)+height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x+(longestLabelWidth+5)+height+mainTickLength|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))):i===this.__mainTickSteps?(startPoint.y=startPoint.y-pixelDiffBetweenMain,this.__context.lineTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x+(longestLabelWidth+5)+height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))):(startPoint.y=startPoint.y-pixelDiffBetweenMain,this.__context.lineTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x+(longestLabelWidth+5)+height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))),pixelDiffBetweenMain=startPixelDiffBetweenMain,i<=this.__mainTickSteps-2&&0!==this.__subTickSteps&&this.__showSubTicks&&null!==this.__subTickSteps)if(this.__logarithmicScale){let diffPerTick=(calculatedNumbers[i+1]-calculatedNumbers[i])/(this.__subTickSteps+1);for(let j=0;j<=this.__subTickSteps-1;j++){let value=calculatedNumbers[i]+diffPerTick*(j+1),pixelDiff=(Math.log10(value)-Number(calculatedNumbers[i].toExponential().split("e")[1]))*startPixelDiffBetweenMain;startPoint.y=beginY-pixelDiff-startPixelDiffBetweenMain*i,this.__context.lineTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x+(longestLabelWidth+5)+(mainTickLength-subTickLength)+height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),j===this.__subTickSteps-1&&(pixelDiffBetweenMain-=pixelDiff),this.__logarithmicYPointsForSubgrid.push(startPoint.y)}}else for(let j=0;j<=this.__subTickSteps-1;j++)startPoint.y=startPoint.y-pixelDiffBetweenSub,this.__context.lineTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x+(longestLabelWidth+5)+(mainTickLength-subTickLength)+height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x+(longestLabelWidth+5)+mainTickLength+height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),pixelDiffBetweenMain-=pixelDiffBetweenSub;this.__context.stroke()}}else{if(this.__showAxisName&&null!==this.__axisName&&(height=this.calculateAxisNameHeight(this.__axisName),this.__showAxis&&null!==this.__context&&null!==this.__axisNameFontWeight&&null!==this.__axisNameFontSize&&null!==this.__axisNameFontFamily&&null!==this.__axisNameFontColor&&(this.__context.save(),this.__context.font=this.__axisNameFontWeight+" "+this.__axisNameFontSize+this.__axisNameFontSizeUnit+" "+this.__axisNameFontFamily,this.__context.fillStyle=this.__axisNameFontColor,this.__context.beginPath(),this.__context.textAlign="center",this.__context.textBaseline="middle",this.__context.translate(startPoint.x-height/2,startPoint.y-(startPoint.y-endPoint.y)/2),this.__context.rotate(-.5*Math.PI),this.__context.fillText(this.__axisName,0,0),this.__context.stroke(),this.__context.restore()),height+=3),this.__showLabels&&this.__mainTickSteps>0&&labelArray.length>0){let yPoint=startPoint.y;if(this.__axisWidth<labelSize.latest?yPoint+=labelSize.latest/2:yPoint=this.__axisWidth/2<labelSize.latest?yPoint+Math.abs(this.__axisWidth/2-labelSize.latest)+(this.__axisWidth-labelSize.latest)/2:yPoint+(this.__axisWidth-labelSize.latest)/2-labelSize.latest/2,null!==this.__context&&this.__showAxis&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily&&null!==this.__labelFontColor){for(let i=0;i<=this.__mainTickSteps-1;i++){if(0!==i&&(yPoint-=pixelDiffBetweenMain),null!==this.__yAxisCallback){let formattedValue=this.__yAxisCallback.apply(this,[parseFloat(labelArray[i])]);null===formattedValue&&(formattedValue=""),labelArray[i]=formattedValue}let xPoint=startPoint.x-longestLabelWidth-height;this.__context.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,this.__context.fillStyle=this.__labelFontColor,this.__context.textAlign="left",this.__context.textBaseline="bottom",this.__context.beginPath(),this.__context.fillText(labelArray[i],xPoint,yPoint)}this.__context.stroke()}}else longestLabelWidth=0;let diffLineAndText=0;if(this.__showLabels&&(diffLineAndText=-5),this.__mainTickSteps>0&&null!==this.__context&&this.__showAxis&&null!==this.__axisColor){this.__context.strokeStyle=this.__axisColor,this.__context.lineWidth=this.__axisWidth,this.__context.setLineDash([]),this.__context.beginPath(),this.__logarithmicYPointsForSubgrid=[];for(let i=0;i<=this.__mainTickSteps-1;i++)if(0===i?(this.__context.moveTo(startPoint.x-longestLabelWidth+diffLineAndText-height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))):i===this.__mainTickSteps?(startPoint.y=startPoint.y-pixelDiffBetweenMain,this.__context.lineTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x-longestLabelWidth+diffLineAndText-height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))):(startPoint.y=startPoint.y-pixelDiffBetweenMain,this.__context.lineTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x-longestLabelWidth+diffLineAndText-height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5))),pixelDiffBetweenMain=startPixelDiffBetweenMain,i<=this.__mainTickSteps-2&&0!==this.__subTickSteps&&this.__showSubTicks&&null!==this.__subTickSteps)if(this.__logarithmicScale){let diffPerTick=(calculatedNumbers[i+1]-calculatedNumbers[i])/(this.__subTickSteps+1);for(let j=0;j<=this.__subTickSteps-1;j++){let value=calculatedNumbers[i]+diffPerTick*(j+1),pixelDiff=(Math.log10(value)-Number(calculatedNumbers[i].toExponential().split("e")[1]))*startPixelDiffBetweenMain;startPoint.y=beginY-pixelDiff-startPixelDiffBetweenMain*i,this.__context.lineTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x-longestLabelWidth+diffLineAndText-(mainTickLength-subTickLength)-height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),j===this.__subTickSteps-1&&(pixelDiffBetweenMain-=pixelDiff),this.__logarithmicYPointsForSubgrid.push(startPoint.y)}}else for(let j=0;j<=this.__subTickSteps-1;j++)startPoint.y=startPoint.y-pixelDiffBetweenSub,this.__context.lineTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.lineTo(startPoint.x-longestLabelWidth+diffLineAndText-(mainTickLength-subTickLength)-height|0,(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),this.__context.moveTo((startPoint.x-longestLabelWidth+diffLineAndText-mainTickLength-height|0)+(this.__axisWidth%2==0?0:.5),(0|startPoint.y)+(this.__axisWidth%2==0?0:.5)),pixelDiffBetweenMain-=pixelDiffBetweenSub;this.__context.stroke()}}this.__height=beginY-endY,this.__diffStartLabelAndLine=0,this.__diffEndLabelAndLine=0,this.__mainTickSteps>0?(this.__width=longestLabelWidth+5+mainTickLength+this.__axisWidth/2+height,this.__axisWidth<labelSize.first&&(this.__diffStartLabelAndLine=labelSize.first/2-this.__axisWidth/2),this.__axisWidth<labelSize.latest&&(this.__diffEndLabelAndLine=labelSize.latest/2-this.__axisWidth/2)):this.__width=height,this.__lineHeight=showOnlyYAxis?beginY-endY-this.__diffEndLabelAndLine-this.__diffStartLabelAndLine:beginY-endY-this.__diffEndLabelAndLine,this.__lineHeight<0&&(this.__lineHeight=0),this.__width<0&&(this.__width=0),this.__height<0&&(this.__height=0),this.__showAxis||(this.__width=0),labelArray.splice(0,labelArray.length)}}}getLongestTextWidth(){let labelArray=this.getCalculatedLabels();if(null!==this.__yAxisCallback)for(let i=0;i<labelArray.length;i++){let formattedValue=this.__yAxisCallback.apply(this,[parseFloat(labelArray[i])]);labelArray[i]=null===formattedValue?"":formattedValue}let width=0,cxt=this.__canvas.getContext("2d");if(null!==cxt){if(null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily){cxt.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily;for(let i=0;i<=labelArray.length-1;i++){let metrics=cxt.measureText(labelArray[i]);metrics.width>width&&(width=metrics.width)}}return labelArray.splice(0,labelArray.length),width}return 0}setPosition(position){this.__position=position}getPosition(){return this.__position}setAxisName(axisName){this.__axisName=axisName}getHeight(){return this.__height}getWidth(){return this.__width}getLineHeight(){return this.__lineHeight}getDiffStartLabelAndLine(){return this.__diffStartLabelAndLine}getDiffEndLabelAndLine(){return this.__diffEndLabelAndLine}setYAxisCallback(callback){this.__yAxisCallback=callback}getYAxisCallback(){return this.__yAxisCallback}getLogarithmicYPointsForSubgrid(){return this.__logarithmicYPointsForSubgrid}}TcHmiCharting.YAxis=YAxis}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class IGrid{__showHorizontalLines=!0;__showVerticalLines=!0;__lineWidth=null;__lineColor=null;__lineStyle=null;__backgroundColor=null;__canvas;__context=null;constructor(canvas){this.__canvas=canvas,this.__context=canvas.getContext("2d")}setLineWidth(lineWidth){this.__lineWidth=null===lineWidth||lineWidth<=0?null:lineWidth}getLineWidth(){return this.__lineWidth}setBackgroundColor(backgroundColor){this.__backgroundColor=backgroundColor}getBackgroundColor(){return this.__backgroundColor}setLineColor(lineColor){this.__lineColor=lineColor}getLineColor(){return this.__lineColor}setLineStyle(lineStyle){this.__lineStyle=lineStyle}getLineStyle(){return this.__lineStyle}setShowVerticalLines(showVerticalLines){this.__showVerticalLines=showVerticalLines}getShowVerticalLines(){return this.__showVerticalLines}setShowHorizontalLines(showHorizontalLines){this.__showHorizontalLines=showHorizontalLines}getShowHorizontalLines(){return this.__showHorizontalLines}}TcHmiCharting.IGrid=IGrid,function(IGrid){let LineStyle;!function(LineStyle){LineStyle[LineStyle.Dotted=0]="Dotted",LineStyle[LineStyle.Dashed=1]="Dashed",LineStyle[LineStyle.Solid=2]="Solid"}(LineStyle=IGrid.LineStyle||(IGrid.LineStyle={}))}(IGrid=TcHmiCharting.IGrid||(TcHmiCharting.IGrid={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class Grid extends TcHmiCharting.IGrid{constructor(canvas){super(canvas)}draw(startPoint,width,height,numberOfWidthLines,numberOfHeightLines,drawingBorder){if(null!==this.__context){if(null===this.__lineColor||null===this.__lineWidth)return;if(startPoint.x=startPoint.x+drawingBorder.width,startPoint.y=startPoint.y-drawingBorder.height,this.__context.beginPath(),this.__context.strokeStyle=this.__lineColor,this.__context.lineWidth=this.__lineWidth,this.__lineStyle){if(TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Solid?(this.__context.setLineDash([]),this.__context.lineCap="butt"):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dashed?(this.__context.lineCap="butt",1!==this.__lineWidth?this.__context.setLineDash([this.__lineWidth,this.__lineWidth]):this.__context.setLineDash([this.__lineWidth,2])):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(this.__context.lineCap="round",this.__context.setLineDash([1,2*this.__lineWidth])),this.__showVerticalLines){let yStart=startPoint.y;if(TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(yStart-=this.__lineWidth/2),1===numberOfWidthLines)this.__context.moveTo((0|startPoint.x)+(this.__lineWidth%2==0?0:.5),(yStart+(this.__lineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((0|startPoint.x)+(this.__lineWidth%2==0?0:.5),(yStart-height+(this.__lineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5));else{let xDiff=width/(numberOfWidthLines-1);for(let i=0;i<numberOfWidthLines;i++)this.__context.moveTo((startPoint.x+i*xDiff|0)+(this.__lineWidth%2==0?0:.5),(yStart+(this.__lineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x+i*xDiff|0)+(this.__lineWidth%2==0?0:.5),(yStart-height+(this.__lineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5))}}if(this.__showHorizontalLines)if(TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(startPoint.x=startPoint.x+this.__lineWidth/2,width-=this.__lineWidth),1===numberOfHeightLines)this.__context.moveTo((startPoint.x-(this.__lineWidth/2|0)|0)+(this.__lineWidth%2==0?0:.5),(0|startPoint.y)+(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x+width+(this.__lineWidth/2|0)|0)+(this.__lineWidth%2==0?0:.5),(0|startPoint.y)+(this.__lineWidth%2==0?0:.5));else{let yDiff=height/(numberOfHeightLines-1);for(let i=0;i<numberOfHeightLines;i++)this.__context.moveTo((startPoint.x-(this.__lineWidth/2|0)|0)+(this.__lineWidth%2==0?0:.5),(startPoint.y-i*yDiff|0)+(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x+width+(this.__lineWidth/2|0)|0)+(this.__lineWidth%2==0?0:.5),(startPoint.y-i*yDiff|0)+(this.__lineWidth%2==0?0:.5))}this.__context.stroke()}}}drawLines(verticalLines,horizontalLines){if(null!==this.__context){if(null===this.__lineColor||null===this.__lineWidth)return;if(this.__context.beginPath(),this.__context.strokeStyle=this.__lineColor,this.__context.lineWidth=this.__lineWidth,this.__lineStyle){TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Solid?(this.__context.setLineDash([]),this.__context.lineCap="butt"):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dashed?(this.__context.lineCap="butt",1!==this.__lineWidth?this.__context.setLineDash([this.__lineWidth,this.__lineWidth]):this.__context.setLineDash([this.__lineWidth,2])):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(this.__context.lineCap="round",this.__context.setLineDash([1,2*this.__lineWidth]));let precision=this.__lineWidth%2==0?0:.5;if(verticalLines)for(let i=0;i<verticalLines.length;i++)this.__context.moveTo((0|verticalLines[i].start.x)+precision,(verticalLines[i].start.y+(this.__lineWidth/2|0)|0)-precision),this.__context.lineTo((0|verticalLines[i].end.x)+precision,(verticalLines[i].end.y+(this.__lineWidth/2|0)|0)-precision);if(horizontalLines)for(let i=0;i<horizontalLines.length;i++)this.__context.moveTo((horizontalLines[i].start.x-(this.__lineWidth/2|0)|0)+precision,(0|horizontalLines[i].start.y)+precision),this.__context.lineTo((horizontalLines[i].end.x+(this.__lineWidth/2|0)|0)+precision,(0|horizontalLines[i].end.y)+precision);this.__context.stroke()}}}}TcHmiCharting.Grid=Grid}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class Subgrid extends TcHmiCharting.IGrid{constructor(canvas){super(canvas)}draw(startPoint,width,height,numberOfLinesBetweenMainGridWidth,widthBetweenMainGrid,numberOfLinesBetweenMainGridHeight,heightBetweenMainGrid,numberOfMainGridWidthLines,numberOfMainGridHeightLines,gridLineWidth,drawingBorder){if(null!==this.__context){if(null===this.__lineColor||null===this.__lineWidth)return;let xBegin=startPoint.x;if(null!==this.__context&&(this.__context.strokeStyle=this.__lineColor,this.__context.lineWidth=this.__lineWidth,this.__lineStyle)){if(TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Solid?(this.__context.setLineDash([]),this.__context.lineCap="butt"):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dashed?(this.__context.lineCap="butt",1!==this.__lineWidth?this.__context.setLineDash([this.__lineWidth,this.__lineWidth]):this.__context.setLineDash([this.__lineWidth,2])):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(this.__context.lineCap="round",this.__context.setLineDash([1,2*this.__lineWidth])),this.__context.beginPath(),this.__showVerticalLines&&numberOfLinesBetweenMainGridWidth){let xDiff=widthBetweenMainGrid/(numberOfLinesBetweenMainGridWidth+1),yStart=startPoint.y;TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(yStart-=this.__lineWidth/2);for(let j=0;j<numberOfMainGridWidthLines-1;j++){startPoint.x=startPoint.x+xDiff;for(let i=0;i<numberOfLinesBetweenMainGridWidth;i++)this.__context.moveTo((startPoint.x+i*xDiff|0)+(this.__lineWidth%2==0?0:.5),(yStart+(gridLineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((startPoint.x+i*xDiff|0)+(this.__lineWidth%2==0?0:.5),(yStart-height+(gridLineWidth/2|0)|0)-(this.__lineWidth%2==0?0:.5));startPoint.x=startPoint.x+(numberOfLinesBetweenMainGridWidth-1)*xDiff+xDiff}}if(this.__showHorizontalLines&&numberOfLinesBetweenMainGridHeight){let yDiff=heightBetweenMainGrid/(numberOfLinesBetweenMainGridHeight+1);TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(xBegin+=this.__lineWidth/2,width-=this.__lineWidth);for(let j=0;j<numberOfMainGridHeightLines-1;j++){startPoint.y=startPoint.y-yDiff;for(let i=0;i<numberOfLinesBetweenMainGridHeight;i++)this.__context.moveTo((xBegin-(gridLineWidth/2|0)|0)+(this.__lineWidth%2==0?0:.5),(startPoint.y-i*yDiff|0)+(this.__lineWidth%2==0?0:.5)),this.__context.lineTo((xBegin-(gridLineWidth/2|0)+width|0)+(this.__lineWidth%2==0?0:.5),(startPoint.y-i*yDiff|0)+(this.__lineWidth%2==0?0:.5));startPoint.y=startPoint.y-(numberOfLinesBetweenMainGridHeight-1)*yDiff-yDiff}}this.__context.stroke()}}}drawLines(verticalLines,horizontalLines){if(null!==this.__context){if(null===this.__lineColor||null===this.__lineWidth)return;if(this.__context.beginPath(),this.__context.strokeStyle=this.__lineColor,this.__context.lineWidth=this.__lineWidth,this.__lineStyle){TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Solid?(this.__context.setLineDash([]),this.__context.lineCap="butt"):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dashed?(this.__context.lineCap="butt",1!==this.__lineWidth?this.__context.setLineDash([this.__lineWidth,this.__lineWidth]):this.__context.setLineDash([this.__lineWidth,2])):TcHmiCharting.IGrid.LineStyle[this.__lineStyle]===TcHmiCharting.IGrid.LineStyle.Dotted&&(this.__context.lineCap="round",this.__context.setLineDash([1,2*this.__lineWidth]));let precision=this.__lineWidth%2==0?0:.5;if(verticalLines)for(let i=0;i<verticalLines.length;i++)this.__context.moveTo((0|verticalLines[i].start.x)+precision,(verticalLines[i].start.y+(this.__lineWidth/2|0)|0)-precision),this.__context.lineTo((0|verticalLines[i].end.x)+precision,(verticalLines[i].end.y+(this.__lineWidth/2|0)|0)-precision);if(horizontalLines)for(let i=0;i<horizontalLines.length;i++)this.__context.moveTo((horizontalLines[i].start.x-(this.__lineWidth/2|0)|0)+precision,(0|horizontalLines[i].start.y)+precision),this.__context.lineTo((horizontalLines[i].end.x+(this.__lineWidth/2|0)|0)+precision,(0|horizontalLines[i].end.y)+precision);this.__context.stroke()}}}}TcHmiCharting.Subgrid=Subgrid}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){let FillMode;TcHmiCharting.IGraph=class{__canvas;__context=null;constructor(canvas){this.__canvas=canvas,void 0!==this.__canvas&&(this.__context=this.__canvas.getContext("2d"))}getColorFromColorRanges(colorRanges,value,defaultColor){if(colorRanges){let firstElemFromRange=colorRanges.find(elem=>!!elem.filterInstance&&elem.filterInstance.test(value));if(firstElemFromRange&&firstElemFromRange.color)return firstElemFromRange.color.color}return defaultColor}getFillColorFromColorRanges(colorRanges,value,defaultFillColor){if(colorRanges){let firstElemFromRange=colorRanges.find(elem=>!!elem.filterInstance&&elem.filterInstance.test(value));if(firstElemFromRange&&firstElemFromRange.fillColor)return firstElemFromRange.fillColor.color}return defaultFillColor}},function(FillMode){FillMode[FillMode.None=0]="None",FillMode[FillMode.HorizontalZero=1]="HorizontalZero",FillMode[FillMode.Bottom=2]="Bottom",FillMode[FillMode.Top=3]="Top",FillMode[FillMode.Center=4]="Center",FillMode[FillMode.Source=5]="Source",FillMode[FillMode.ReferenceLine=6]="ReferenceLine"}(FillMode=TcHmiCharting.FillMode||(TcHmiCharting.FillMode={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class LineGraph extends TcHmiCharting.IGraph{__lineWidth=null;__lineColor=null;__pointDot=!1;__pointDotRadius=null;__pointDotFillColor=null;__pointDotStrokeWidth=null;__pointDotStrokeColor=null;__points=[];__drawingBorder=0;__xScaleFactor=1;__yScaleFactor=1;__fillMode=TcHmiCharting.FillMode.None;__fillColor=null;__fillTransparency=null;__colorRanges=null;__fillModeReferenceLine=null;constructor(canvas){super(canvas),this.__points=[]}draw(line,xAxis){if(this.__points.splice(0,this.__points.length),null!==line.yAxis){let yAxisLineWidth=line.yAxis.getAxisWidth();if(null===yAxisLineWidth)return;let offsetTop=line.yAxis.getDiffEndLabelAndLine()+yAxisLineWidth/2+5+this.__drawingBorder,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=line.yAxis.getMainTickStartValue();if(line.yAxis.getAutoScaling()){let valueOverride=line.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=line.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=line.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLength=xAxis.getLineWidth(),xCalc=xAxisLength/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=line.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]),zeroPoint={x:(0-xStartValue)*xCalc+offsetLeft,y:yAxisLength-(0-yStartValue)*yCalc+offsetTop};line.yAxis.getLogarithmicScale()&&(zeroPoint.y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM),xAxis.getLogarithmicScale()&&(zeroPoint.x=TcHmiCharting.IAxis.LOGARITHMIC_X_MINIMUM);let fillModePoint=zeroPoint;if(this.__fillMode===TcHmiCharting.FillMode.ReferenceLine&&this.__fillModeReferenceLine){let yAxisLineWidthFillMode=this.__fillModeReferenceLine.yAxis.getAxisWidth(),yStartValueFillMode=this.__fillModeReferenceLine.yAxis.getAutoScaling()&&null!==this.__fillModeReferenceLine.yAxis.getMainTickStartValueOverride()?this.__fillModeReferenceLine.yAxis.getMainTickStartValueOverride():this.__fillModeReferenceLine.yAxis.getMainTickStartValue(),yAxisLabelFillMode=this.__fillModeReferenceLine.yAxis.getCalculatedNumbers(),yAxisMainTickStepsFillMode=this.__fillModeReferenceLine.yAxis.getMainTickSteps(),yAxisLengthFillMode=this.__fillModeReferenceLine.yAxis.getLineHeight();if(null!==yAxisLineWidthFillMode&&null!==yStartValueFillMode&&null!==yAxisMainTickStepsFillMode){let offsetTopFillMode=this.__fillModeReferenceLine.yAxis.getDiffEndLabelAndLine()+yAxisLineWidthFillMode/2+5+this.__drawingBorder,yCalcFillMode=yAxisLengthFillMode/(yAxisLabelFillMode[yAxisMainTickStepsFillMode-1]-yAxisLabelFillMode[0]);fillModePoint={x:(0-xStartValue)*xCalc+offsetLeft,y:yAxisLengthFillMode-(this.__fillModeReferenceLine.value-yStartValueFillMode)*yCalcFillMode+offsetTopFillMode},this.__fillModeReferenceLine.yAxis.getLogarithmicScale()&&(fillModePoint.y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM),xAxis.getLogarithmicScale()&&(fillModePoint.x=TcHmiCharting.IAxis.LOGARITHMIC_X_MINIMUM)}}let points=[];for(let i=0,ii=line.points.length-1;i<=ii;i++){let x=(line.points[i].x*this.__xScaleFactor-xStartValue)*xCalc+offsetLeft,y=yAxisLength-(line.points[i].y*this.__yScaleFactor-yStartValue)*yCalc+offsetTop;line.yAxis.getLogarithmicScale()&&0!==line.points[i].y&&yAxisMainTickSteps>=2?y=yAxisLength+offsetTop-(Math.log10(line.points[i].y*this.__yScaleFactor)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1)):line.yAxis.getLogarithmicScale()&&0===line.points[i].y?y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM:y>this.__canvas.height+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?y=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:y<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(y=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),xAxis.getLogarithmicScale()&&0!==line.points[i].x&&xAxisMainTickSteps>=2?x=offsetLeft+(Math.log10(line.points[i].x*this.__xScaleFactor)-Number(xAxisLabel[0].toExponential().split("e")[1]))*(xAxisLength/(xAxisMainTickSteps-1)):xAxis.getLogarithmicScale()&&0===line.points[i].y&&(x=TcHmiCharting.IAxis.LOGARITHMIC_X_MINIMUM),points.push({xPosition:0|x,yPosition:0|y,xValue:line.points[i].x*this.__xScaleFactor,yValue:line.points[i].y*this.__yScaleFactor})}if(null!==this.__context&&void 0!==this.__canvas){if(this.__colorRanges&&this.__colorRanges.length>0){let checkpointsFromColorRanges=[],diff=(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0])/yAxisMainTickSteps/1e3;for(let elem of this.__colorRanges)if(elem.filterInstance){let allFilter=elem.filterInstance.getFilter();for(let t of allFilter)if(TcHmi.isComparison(t)){let value=Number(t.value);checkpointsFromColorRanges.push(value,value-diff,value+diff)}}checkpointsFromColorRanges.sort((a,b)=>a-b);const coloredSegments=this.getColoredSegments(points,checkpointsFromColorRanges,this.__colorRanges,this.__lineColor??"",this.__fillColor??"");for(const{segment,lineColor,fillColor}of coloredSegments){this.__context.beginPath(),this.__context.strokeStyle=lineColor,this.__context.lineWidth=this.__lineWidth,this.__context.setLineDash([]),this.__context.moveTo(segment[0].xPosition,segment[0].yPosition);for(let i=1;i<segment.length;i++)this.__context.lineTo(segment[i].xPosition,segment[i].yPosition);this.__context.stroke(),this.renderFillSegment(segment,fillColor,offsetTop,offsetLeft,xAxisLength,yAxisLength,zeroPoint,fillModePoint)}}else{if(null!==this.__lineColor&&null!==this.__lineWidth){this.__context.beginPath(),this.__context.strokeStyle=this.__lineColor,this.__context.lineWidth=this.__lineWidth,this.__context.setLineDash([]);for(let i=0,ii=points.length-1;i<=ii;i++)0===i?this.__context.moveTo(points[i].xPosition,points[i].yPosition):this.__context.lineTo(points[i].xPosition,points[i].yPosition);this.__context.stroke()}this.__fillColor&&this.__fillTransparency&&this.renderFillSegment(points,this.__fillColor,offsetTop,offsetLeft,xAxisLength,yAxisLength,zeroPoint,fillModePoint)}if(this.__pointDot&&null!==this.__pointDotRadius&&null!==this.__pointDotStrokeWidth&&null!==this.__pointDotStrokeColor){if(this.__pointDotStrokeWidth>0){this.__context.beginPath(),this.__context.strokeStyle=this.__pointDotStrokeColor,this.__context.lineWidth=2*this.__pointDotRadius+this.__pointDotStrokeWidth,this.__context.lineCap="round";for(let i=0,ii=points.length-1;i<=ii;i++)this.__context.moveTo(points[i].xPosition,points[i].yPosition),this.__context.lineTo(points[i].xPosition,points[i].yPosition);this.__context.stroke()}if("None"!==this.__pointDotFillColor&&null!==this.__pointDotFillColor&&void 0!==this.__pointDotFillColor){this.__context.beginPath(),this.__context.strokeStyle=this.__pointDotFillColor,this.__context.lineWidth=2*this.__pointDotRadius,this.__context.lineCap="round";for(let i=0,ii=points.length-1;i<=ii;i++)this.__context.moveTo(points[i].xPosition,points[i].yPosition),this.__context.lineTo(points[i].xPosition,points[i].yPosition);this.__context.stroke()}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder),canvasHeight),this.__points=points.splice(0),points.splice(0,points.length)}}}getColoredSegments(points,checkpoints,colorRanges,defaultLineColor,defaultFillColor){const segments=[];let currentSegment=[points[0]],prevY=points[0].yValue,prevX=points[0].xValue,prevPoint=points[0];for(let i=1;i<points.length;i++){const currY=points[i].yValue,currX=points[i].xValue,currPoint=points[i];let relevantCheckpoints=checkpoints.filter(c=>prevY<currY&&c>prevY&&c<currY||prevY>currY&&c<prevY&&c>currY);prevY>currY?relevantCheckpoints.sort((a,b)=>b-a):relevantCheckpoints.sort((a,b)=>a-b);let lastX=prevX,lastY=prevY,lastPoint=prevPoint;for(const checkpoint of relevantCheckpoints){const t=(checkpoint-lastY)/(currY-lastY),xInterp=lastX+t*(currX-lastX),yInterp=checkpoint,interpPoint={xPosition:lastPoint.xPosition+t*(currPoint.xPosition-lastPoint.xPosition),yPosition:lastPoint.yPosition+t*(currPoint.yPosition-lastPoint.yPosition),xValue:xInterp,yValue:yInterp};currentSegment.push(interpPoint);const lineColor=this.getColorFromColorRanges(colorRanges,checkpoint,defaultLineColor),fillColor=this.getFillColorFromColorRanges(colorRanges,checkpoint,defaultFillColor);segments.push({segment:currentSegment,lineColor,fillColor}),currentSegment=[interpPoint],lastX=xInterp,lastY=yInterp,lastPoint=interpPoint}currentSegment.push(currPoint),prevY=currY,prevX=currX,prevPoint=currPoint}const lastLineColor=this.getColorFromColorRanges(colorRanges,points[points.length-1].yValue,defaultLineColor),lastFillColor=this.getFillColorFromColorRanges(colorRanges,points[points.length-1].yValue,defaultFillColor);return segments.push({segment:currentSegment,lineColor:lastLineColor,fillColor:lastFillColor}),segments}renderFillSegment(points,fillColor,offsetTop,offsetLeft,xAxisLength,yAxisLength,zeroPoint,fillModePoint){if(this.__context&&this.__fillTransparency&&fillColor&&this.__fillMode!==TcHmiCharting.FillMode.None){this.__context.save(),this.__context.beginPath(),this.__context.moveTo(points[0].xPosition,points[0].yPosition);for(let i=1;i<points.length;i++)this.__context.lineTo(points[i].xPosition,points[i].yPosition);this.__fillMode===TcHmiCharting.FillMode.Top?(this.__context.lineTo(points[points.length-1].xPosition,offsetTop),this.__context.lineTo(points[0].xPosition,offsetTop)):this.__fillMode===TcHmiCharting.FillMode.Bottom?(this.__context.lineTo(points[points.length-1].xPosition,offsetLeft+xAxisLength+yAxisLength),this.__context.lineTo(points[0].xPosition,offsetLeft+xAxisLength+yAxisLength)):this.__fillMode===TcHmiCharting.FillMode.HorizontalZero&&zeroPoint?(this.__context.lineTo(points[points.length-1].xPosition,zeroPoint.y),this.__context.lineTo(points[0].xPosition,zeroPoint.y)):this.__fillMode===TcHmiCharting.FillMode.ReferenceLine&&fillModePoint&&(this.__context.lineTo(points[points.length-1].xPosition,fillModePoint.y),this.__context.lineTo(points[0].xPosition,fillModePoint.y)),this.__context.closePath(),this.__context.globalAlpha=this.__fillTransparency/255,this.__context.fillStyle=fillColor,this.__context.fill(),this.__context.restore()}}getPoints(){return this.__points}removePoints(){this.__points.splice(0,this.__points.length)}setLineWidth(lineWidth){this.__lineWidth=null===lineWidth||lineWidth<=0?null:lineWidth}getLineWidth(){return this.__lineWidth}setLineColor(lineColor){this.__lineColor=lineColor}getLineColor(){return this.__lineColor}setPointDot(pointDot){this.__pointDot=pointDot}getPointDot(){return this.__pointDot}setPointDotRadius(pointDotRadius){this.__pointDotRadius=pointDotRadius}getPointDotRadius(){return this.__pointDotRadius}setPointDotFillColor(pointDotFillColor){this.__pointDotFillColor=pointDotFillColor}getPointDotFillColor(){return this.__pointDotFillColor}setPointDotStrokeWidth(pointDotStrokeWidth){this.__pointDotStrokeWidth=pointDotStrokeWidth}getPointDotStrokeWidth(){return this.__pointDotStrokeWidth}setPointDotStrokeColor(pointDotStrokeColor){this.__pointDotStrokeColor=pointDotStrokeColor}getPointDotStrokeColor(){return this.__pointDotStrokeColor}setCanvas(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}getCanvas(){return this.__canvas}setDrawingBorder(drawingBorder){this.__drawingBorder=drawingBorder}getXScaleFactor(){return this.__xScaleFactor}setXScaleFactor(xScaleFactor){this.__xScaleFactor=xScaleFactor||1}getYScaleFactor(){return this.__yScaleFactor}setYScaleFactor(yScaleFactor){this.__yScaleFactor=yScaleFactor||1}getFillMode(){return this.__fillMode}setFillMode(fillMode){this.__fillMode=fillMode}getFillColor(){return this.__fillColor}setFillColor(fillColor){this.__fillColor=fillColor}getFillTransparency(){return this.__fillTransparency}setFillTransparency(fillTransparency){this.__fillTransparency=fillTransparency}getColorRanges(){return this.__colorRanges}setColorRanges(colorRanges){this.__colorRanges=colorRanges}setFillModeReferenceLine(referenceLine){this.__fillModeReferenceLine=referenceLine}}TcHmiCharting.LineGraph=LineGraph}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class LineAreaGraph extends TcHmiCharting.IGraph{__lineWidth=null;__lineColor=null;__pointDot=!1;__pointDotRadius=null;__pointDotFillColor=null;__pointDotStrokeWidth=null;__pointDotStrokeColor=null;__points=[];__areaPoints=[];__drawingBorder=0;__scaleFactor=1;__fillMode=TcHmiCharting.FillMode.None;__fillColor=null;__fillTransparency=null;__colorRanges=null;__fillModeReferenceLine=null;__areas=[];constructor(canvas){super(canvas),this.__points=[]}drawAreas(line,xAxis){if(this.__areaPoints.splice(0,this.__areaPoints.length),null!==this.__context&&void 0!==this.__canvas&&line.yAxis){let areas=[];for(let i=0,ii=this.__areas.length;i<ii;i++){let foundedArea=areas.filter(x=>x.getBackgroundColor()===this.__areas[i].backgroundColor);if(0===foundedArea.length){areas.push(new TcHmiCharting.Area(this.__canvas));let newArea=areas[areas.length-1];newArea.setBackgroundColor(this.__areas[i].backgroundColor),newArea.setDrawLineWithOnePixel(this.__areas[i].drawLineWithOnePixel),newArea.addArea({beginX:this.__areas[i].beginX,endX:this.__areas[i].endX})}else foundedArea[0].addArea({beginX:this.__areas[i].beginX,endX:this.__areas[i].endX})}let allAreaPositionAndValues=[];for(let h=0,hh=areas.length;h<hh;h++)areas[h].setCanvas(this.__canvas),areas[h].setDrawingBorder(this.__drawingBorder),areas[h].draw(xAxis,line.yAxis),allAreaPositionAndValues=allAreaPositionAndValues.concat(areas[h].getAreasPositionAndValue()),areas[h].removeAllAreas();this.__areaPoints=allAreaPositionAndValues.splice(0),allAreaPositionAndValues.splice(0,allAreaPositionAndValues.length),areas.splice(0,areas.length);let yAxisLineWidth=line.yAxis.getAxisWidth();if(null===yAxisLineWidth)return;let offsetTop=line.yAxis.getDiffEndLabelAndLine()+yAxisLineWidth/2+5+this.__drawingBorder,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=line.yAxis.getMainTickStartValue();if(line.yAxis.getAutoScaling()){let valueOverride=line.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;if(null===xAxis.getMainTickSteps())return;if(null===line.yAxis.getMainTickSteps())return;let xAxisLength=xAxis.getLineWidth(),yAxisLength=line.yAxis.getLineHeight(),canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder),canvasHeight)}}drawPoints(line,xAxis){if(this.__points.splice(0,this.__points.length),null!==this.__context&&void 0!==this.__canvas&&line.yAxis){let yAxisLineWidth=line.yAxis.getAxisWidth();if(null===yAxisLineWidth)return;let offsetTop=line.yAxis.getDiffEndLabelAndLine()+yAxisLineWidth/2+5+this.__drawingBorder,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=line.yAxis.getMainTickStartValue();if(line.yAxis.getAutoScaling()){let valueOverride=line.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=line.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=line.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLength=xAxis.getLineWidth(),xCalc=xAxisLength/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=line.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]),zeroPoint={x:(0-xStartValue)*xCalc+offsetLeft,y:yAxisLength-(0-yStartValue)*yCalc+offsetTop};line.yAxis.getLogarithmicScale()&&(zeroPoint.y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM),xAxis.getLogarithmicScale()&&(zeroPoint.x=TcHmiCharting.IAxis.LOGARITHMIC_X_MINIMUM);let fillModePoint=zeroPoint;if(this.__fillMode===TcHmiCharting.FillMode.ReferenceLine&&this.__fillModeReferenceLine){let yAxisLineWidthFillMode=this.__fillModeReferenceLine.yAxis.getAxisWidth(),yStartValueFillMode=this.__fillModeReferenceLine.yAxis.getAutoScaling()&&null!==this.__fillModeReferenceLine.yAxis.getMainTickStartValueOverride()?this.__fillModeReferenceLine.yAxis.getMainTickStartValueOverride():this.__fillModeReferenceLine.yAxis.getMainTickStartValue(),yAxisLabelFillMode=this.__fillModeReferenceLine.yAxis.getCalculatedNumbers(),yAxisMainTickStepsFillMode=this.__fillModeReferenceLine.yAxis.getMainTickSteps(),yAxisLengthFillMode=this.__fillModeReferenceLine.yAxis.getLineHeight();if(null!==yAxisLineWidthFillMode&&null!==yStartValueFillMode&&null!==yAxisMainTickStepsFillMode){let offsetTopFillMode=this.__fillModeReferenceLine.yAxis.getDiffEndLabelAndLine()+yAxisLineWidthFillMode/2+5+this.__drawingBorder,yCalcFillMode=yAxisLengthFillMode/(yAxisLabelFillMode[yAxisMainTickStepsFillMode-1]-yAxisLabelFillMode[0]);fillModePoint={x:(0-xStartValue)*xCalc+offsetLeft,y:yAxisLengthFillMode-(this.__fillModeReferenceLine.value-yStartValueFillMode)*yCalcFillMode+offsetTopFillMode},this.__fillModeReferenceLine.yAxis.getLogarithmicScale()&&(fillModePoint.y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM),xAxis.getLogarithmicScale()&&(fillModePoint.x=TcHmiCharting.IAxis.LOGARITHMIC_X_MINIMUM)}}let points=[];for(let j=0,jj=line.points.length;j<jj;j++){let yValue=line.points[j].y;if(!line.points[j].isArea&&void 0!==yValue){let x=(line.points[j].x-xStartValue)*xCalc+offsetLeft,y=yAxisLength-(yValue*this.__scaleFactor-yStartValue)*yCalc+offsetTop;line.yAxis.getLogarithmicScale()&&0!==yValue&&yAxisMainTickSteps>=2?y=yAxisLength+offsetTop-(Math.log10(yValue*this.__scaleFactor)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1)):line.yAxis.getLogarithmicScale()&&0===yValue?y=TcHmiCharting.IAxis.LOGARITHMIC_Y_MINIMUM:y>this.__canvas.height+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?y=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:y<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(y=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),points.push({xPosition:x,yPosition:y,xValue:line.points[j].x,yValue:yValue*this.__scaleFactor})}}let coloredSegments=[];if(this.__colorRanges){let checkpointsFromColorRanges=[],diff=(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0])/yAxisMainTickSteps/1e3;for(let elem of this.__colorRanges)if(elem.filterInstance){let allFilter=elem.filterInstance.getFilter();for(let t of allFilter)if(TcHmi.isComparison(t)){let value=Number(t.value);checkpointsFromColorRanges.push(value,value-diff,value+diff)}}checkpointsFromColorRanges.sort((a,b)=>a-b);let segmentStart=0;for(let i=1;i<=points.length;i++)if(i===points.length||!line.points[i-1].bindPoints){let segmentPoints=points.slice(segmentStart,i);if(segmentPoints.length>1){let segs=this.getColoredSegments(segmentPoints,checkpointsFromColorRanges,this.__colorRanges,this.__lineColor??"",this.__fillColor??"");coloredSegments.push(...segs)}segmentStart=i}}else{let segmentStart=0;for(let i=1;i<=points.length;i++)if(i===points.length||!line.points[i-1].bindPoints){let segmentPoints=points.slice(segmentStart,i);segmentPoints.length>1&&coloredSegments.push({segment:segmentPoints,lineColor:this.__lineColor??"",fillColor:this.__fillColor??""}),segmentStart=i}}for(const{segment,lineColor,fillColor}of coloredSegments){this.__context.beginPath(),this.__context.strokeStyle=lineColor,this.__context.lineWidth=this.__lineWidth,this.__context.setLineDash([]),this.__context.moveTo(segment[0].xPosition,segment[0].yPosition);for(let i=1;i<segment.length;i++)this.__context.lineTo(segment[i].xPosition,segment[i].yPosition);this.__context.stroke(),this.__fillTransparency&&fillColor&&this.__fillMode!==TcHmiCharting.FillMode.None&&this.renderFillSegment(segment,fillColor,offsetTop,offsetLeft,xAxisLength,yAxisLength,zeroPoint,fillModePoint)}if(this.__pointDot&&null!==this.__pointDotRadius&&null!==this.__pointDotStrokeWidth&&null!==this.__pointDotStrokeColor){if(this.__pointDotStrokeWidth>0){this.__context.beginPath(),this.__context.strokeStyle=this.__pointDotStrokeColor,this.__context.lineWidth=2*this.__pointDotRadius+this.__pointDotStrokeWidth,this.__context.lineCap="round";for(let m=0,mm=points.length;m<mm;m++)this.__context.moveTo(points[m].xPosition,points[m].yPosition),this.__context.lineTo(points[m].xPosition,points[m].yPosition);this.__context.stroke()}if("None"!==this.__pointDotFillColor&&null!==this.__pointDotFillColor&&void 0!==this.__pointDotFillColor){this.__context.beginPath(),this.__context.strokeStyle=this.__pointDotFillColor,this.__context.lineWidth=2*this.__pointDotRadius,this.__context.lineCap="round";for(let k=0,kk=points.length;k<kk;k++)this.__context.moveTo(points[k].xPosition,points[k].yPosition),this.__context.lineTo(points[k].xPosition,points[k].yPosition);this.__context.stroke()}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder),canvasHeight),this.__points=points.splice(0),points.splice(0,points.length)}}getColoredSegments(points,checkpoints,colorRanges,defaultLineColor,defaultFillColor){const segments=[];let currentSegment=[points[0]],prevY=points[0].yValue,prevX=points[0].xValue,prevPoint=points[0];for(let i=1;i<points.length;i++){const currY=points[i].yValue,currX=points[i].xValue,currPoint=points[i];let relevantCheckpoints=checkpoints.filter(c=>prevY<currY&&c>prevY&&c<currY||prevY>currY&&c<prevY&&c>currY);prevY>currY?relevantCheckpoints.sort((a,b)=>b-a):relevantCheckpoints.sort((a,b)=>a-b);let lastX=prevX,lastY=prevY,lastPoint=prevPoint;for(const checkpoint of relevantCheckpoints){const t=(checkpoint-lastY)/(currY-lastY),xInterp=lastX+t*(currX-lastX),yInterp=checkpoint,interpPoint={xPosition:lastPoint.xPosition+t*(currPoint.xPosition-lastPoint.xPosition),yPosition:lastPoint.yPosition+t*(currPoint.yPosition-lastPoint.yPosition),xValue:xInterp,yValue:yInterp};currentSegment.push(interpPoint);const lineColor=this.getColorFromColorRanges(colorRanges,checkpoint,defaultLineColor),fillColor=this.getFillColorFromColorRanges(colorRanges,checkpoint,defaultFillColor);segments.push({segment:currentSegment,lineColor,fillColor}),currentSegment=[interpPoint],lastX=xInterp,lastY=yInterp,lastPoint=interpPoint}currentSegment.push(currPoint),prevY=currY,prevX=currX,prevPoint=currPoint}const lastLineColor=this.getColorFromColorRanges(colorRanges,points[points.length-1].yValue,defaultLineColor),lastFillColor=this.getFillColorFromColorRanges(colorRanges,points[points.length-1].yValue,defaultFillColor);return segments.push({segment:currentSegment,lineColor:lastLineColor,fillColor:lastFillColor}),segments}renderFillSegment(points,fillColor,offsetTop,offsetLeft,xAxisLength,yAxisLength,zeroPoint,fillModePoint){if(this.__context&&this.__fillTransparency&&fillColor&&this.__fillMode!==TcHmiCharting.FillMode.None){this.__context.save(),this.__context.beginPath(),this.__context.moveTo(points[0].xPosition,points[0].yPosition);for(let i=1;i<points.length;i++)this.__context.lineTo(points[i].xPosition,points[i].yPosition);this.__fillMode===TcHmiCharting.FillMode.Top?(this.__context.lineTo(points[points.length-1].xPosition,offsetTop),this.__context.lineTo(points[0].xPosition,offsetTop)):this.__fillMode===TcHmiCharting.FillMode.Bottom?(this.__context.lineTo(points[points.length-1].xPosition,offsetLeft+xAxisLength+yAxisLength),this.__context.lineTo(points[0].xPosition,offsetLeft+xAxisLength+yAxisLength)):this.__fillMode===TcHmiCharting.FillMode.HorizontalZero&&zeroPoint?(this.__context.lineTo(points[points.length-1].xPosition,zeroPoint.y),this.__context.lineTo(points[0].xPosition,zeroPoint.y)):this.__fillMode===TcHmiCharting.FillMode.ReferenceLine&&fillModePoint&&(this.__context.lineTo(points[points.length-1].xPosition,fillModePoint.y),this.__context.lineTo(points[0].xPosition,fillModePoint.y)),this.__context.closePath(),this.__context.globalAlpha=this.__fillTransparency/255,this.__context.fillStyle=fillColor,this.__context.fill(),this.__context.restore()}}getPoints(){return this.__points}removePoints(){this.__points.splice(0,this.__points.length)}getAreaPoints(){return this.__areaPoints}removeAreaPoints(){this.__areaPoints.splice(0,this.__areaPoints.length)}setLineWidth(lineWidth){this.__lineWidth=null===lineWidth||lineWidth<=0?null:lineWidth}getLineWidth(){return this.__lineWidth}setLineColor(lineColor){this.__lineColor=lineColor}getLineColor(){return this.__lineColor}setPointDot(pointDot){this.__pointDot=pointDot}getPointDot(){return this.__pointDot}setPointDotRadius(pointDotRadius){this.__pointDotRadius=pointDotRadius}getPointDotRadius(){return this.__pointDotRadius}setPointDotFillColor(pointDotFillColor){this.__pointDotFillColor=pointDotFillColor}getPointDotFillColor(){return this.__pointDotFillColor}setPointDotStrokeWidth(pointDotStrokeWidth){this.__pointDotStrokeWidth=pointDotStrokeWidth}getPointDotStrokeWidth(){return this.__pointDotStrokeWidth}setPointDotStrokeColor(pointDotStrokeColor){this.__pointDotStrokeColor=pointDotStrokeColor}getPointDotStrokeColor(){return this.__pointDotStrokeColor}setCanvas(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}getCanvas(){return this.__canvas}setDrawingBorder(drawingBorder){this.__drawingBorder=drawingBorder}addArea(newArea){this.__areas.push(newArea)}deleteAllAreas(){this.__areas.splice(0,this.__areas.length)}deleteArea(index){this.__areas.splice(index,1)}getAllAreas(){return this.__areas}getAreaAtPosition(index){return this.__areas[index]}getScaleFactor(){return this.__scaleFactor}setScaleFactor(scaleFactor){this.__scaleFactor=scaleFactor||1}getFillMode(){return this.__fillMode}setFillMode(fillMode){this.__fillMode=fillMode}getFillColor(){return this.__fillColor}setFillColor(fillColor){this.__fillColor=fillColor}getFillTransparency(){return this.__fillTransparency}setFillTransparency(fillTransparency){this.__fillTransparency=fillTransparency}getColorRanges(){return this.__colorRanges}setColorRanges(colorRanges){this.__colorRanges=colorRanges}setFillModeReferenceLine(referenceLine){this.__fillModeReferenceLine=referenceLine}}TcHmiCharting.LineAreaGraph=LineAreaGraph}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class BarGraph extends TcHmiCharting.IGraph{__barWidth=null;__barColor=null;__drawingBorder={height:0,width:0};__scaleFactor=1;__colorRanges=null;constructor(canvas){super(canvas)}draw(bar,xAxis){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLegth=xAxis.getLineWidth(),xCalc=xAxisLegth/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();let yBegin=yAxisLength-(0-yStartValue)*yCalc+offsetTop;for(let i=0,ii=bar.values.length-1;i<=ii;i++){let y,x=(i-xStartValue)*xCalc+offsetLeft-this.__barWidth/2;y=bar.yAxis.getLogarithmicScale()&&0!==bar.values[i]&&yAxisMainTickSteps>=2?yAxisLength+offsetTop-(Math.log10(bar.values[i]*this.__scaleFactor)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1)):yAxisLength-(bar.values[i]*this.__scaleFactor-yStartValue)*yCalc+offsetTop,y>this.__canvas.height+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?y=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:y<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(y=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(x,yBegin,this.__barWidth,y-yBegin)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLegth-this.__drawingBorder.width),canvasHeight)}}}drawClustered(bar,xAxis,index){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLegth=xAxis.getLineWidth(),xCalc=xAxisLegth/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();let yBegin=yAxisLength-(0-yStartValue)*yCalc+offsetTop;for(let i=0,ii=bar.values.length-1;i<=ii;i++){let y,x=(i-xStartValue)*xCalc+offsetLeft-this.__drawingBorder.width+2*index+index*this.__barWidth;y=bar.yAxis.getLogarithmicScale()&&0!==bar.values[i]&&yAxisMainTickSteps>=2?yAxisLength+offsetTop-(Math.log10(bar.values[i]*this.__scaleFactor)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1)):yAxisLength-(bar.values[i]*this.__scaleFactor-yStartValue)*yCalc+offsetTop,y>this.__canvas.height+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?y=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:y<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(y=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(x,yBegin,this.__barWidth,y-yBegin)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLegth-this.__drawingBorder.width),canvasHeight)}}}drawStacked(bar,xAxis,minValues){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLegth=xAxis.getLineWidth(),xCalc=xAxisLegth/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();for(let i=0,ii=bar.values.length-1;i<=ii;i++){let yBegin,minValue=0;void 0!==minValues[i]&&(minValue=minValues[i]);let y,x=(i-xStartValue)*xCalc+offsetLeft-this.__barWidth/2;bar.yAxis.getLogarithmicScale()&&0!==bar.values[i]&&yAxisMainTickSteps>=2?(yBegin=0!==minValue?yAxisLength+offsetTop-(Math.log10(minValue)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1)):yAxisLength+offsetTop,y=yAxisLength+offsetTop-(Math.log10(bar.values[i]+minValue*this.__scaleFactor)-Number(yAxisLabel[0].toExponential().split("e")[1]))*(yAxisLength/(yAxisMainTickSteps-1))):(yBegin=yAxisLength-(minValue-yStartValue)*yCalc+offsetTop,y=yAxisLength-(minValue+bar.values[i]*this.__scaleFactor-yStartValue)*yCalc+offsetTop),y>this.__canvas.height+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?y=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:y<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(y=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(x,yBegin,this.__barWidth,y-yBegin),void 0!==minValues[i]?minValues[i]=minValues[i]+bar.values[i]*this.__scaleFactor:minValues.push(bar.values[i]*this.__scaleFactor)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLegth-this.__drawingBorder.width),canvasHeight)}}}setBarWidth(barWidth){this.__barWidth=barWidth}getBarWidth(){return this.__barWidth}setDrawingBorder(drawingBorder){this.__drawingBorder=drawingBorder}setBarColor(barColor){this.__barColor=barColor}getBarColor(){return this.__barColor}setCanvas(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}getCanvas(){return this.__canvas}getScaleFactor(){return this.__scaleFactor}setScaleFactor(scaleFactor){this.__scaleFactor=scaleFactor||1}getColorRanges(){return this.__colorRanges}setColorRanges(colorRanges){this.__colorRanges=colorRanges}}TcHmiCharting.BarGraph=BarGraph,function(BarGraph){let BarGraphArrangement;!function(BarGraphArrangement){BarGraphArrangement.Overlapped="Overlapped",BarGraphArrangement.Clustered="Clustered",BarGraphArrangement.Stacked="Stacked"}(BarGraphArrangement=BarGraph.BarGraphArrangement||(BarGraph.BarGraphArrangement={}))}(BarGraph=TcHmiCharting.BarGraph||(TcHmiCharting.BarGraph={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class HorizontalBarChart extends TcHmiCharting.IChart{__barGraph;__barGraphs;__barChanged;__widthLeft=0;__calcBarWidth=0;__barWidth=null;__barGraphArrangement=null;__drawingBorder={height:0,width:0};constructor(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition){super(elementRoot,canvasWidth,canvasHeight,referenceLinesPosition),this.__barGraph=[],this.__barGraphs=[],this.__barChanged=!1}deleteYAxis(index){for(let i=0,ii=this.__barGraph.length;i<ii;i++){const tempBarGraph=this.__barGraph[i];null!==tempBarGraph.yAxis&&tempBarGraph.yAxis.getId()===this.__yAxis[index].getId()&&(tempBarGraph.yAxis=null)}this.__yAxis.splice(index,1),this.setHasChanged(!0)}deleteAllYAxis(){this.__yAxis.splice(0,this.__yAxis.length);for(let i=0,ii=this.__barGraph.length;i<ii;i++)this.__barGraph[i].yAxis=null;this.setHasChanged(!0)}deleteAllReferenceLines(){this.__referenceLines.splice(0,this.__referenceLines.length),this.setHasChanged(!0)}addGraph(newGraph){this.__canvasFrame&&(this.__barGraph.push(newGraph),this.__barGraphs.push(new TcHmiCharting.HorizontalBarGraph(this.__canvasFrame)),this.__barChanged=!0)}deleteGraph(index){this.__barGraph.splice(index,1),this.__barGraphs.splice(index,1),this.__barChanged=!0}deleteAllGraphs(){this.__barGraph.splice(0,this.__barGraph.length),this.__barGraphs.splice(0,this.__barGraphs.length),this.__barChanged=!0}remove(){super.remove(),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null,this.__barWidth=null}clear(width,height){super.clear(width,height),this.deleteGrid(),this.deleteSubgrid(),this.deleteAllYAxis(),this.deleteAllReferenceLines(),this.deleteAllGraphs(),this.__xAxis=null,this.__barWidth=null}getBars(){return this.__barGraph}getBarsAtPosition(index){return this.__barGraph[index]}getBarGraphs(){return this.__barGraphs}getBarGraphsAtPosition(index){return this.__barGraphs[index]}setBarWidth(barWidth){this.__barWidth=barWidth}setBarGraphArrangement(barGraphArrangement){this.__barGraphArrangement=barGraphArrangement}setBarChanged(barChanged){this.__barChanged=barChanged}draw(defaultDistance=5){if(null!==this.__canvasFrame&&void 0!==this.__canvasFrame){let canvasWidth=this.__canvasFrame.width/window.devicePixelRatio,canvasHeight=this.__canvasFrame.height/window.devicePixelRatio;if(null!==this.__xAxis&&void 0!==this.__xAxis){if(this.getHasChanged()){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextLines&&this.__contextLines.clearRect(0,0,canvasWidth,canvasHeight);let xAxisHeight=0,startValueX=null,endValueX=null;if(this.__xAxis.setMainTickStartValueOverride(null),this.__xAxis.setMainTickEndValueOverride(null),this.__xAxis.getAutoScaling())for(let j=0,jj=this.__barGraph.length;j<jj;j++){const scaleFactor=this.__barGraphs[j].getScaleFactor();if(this.__barGraphArrangement===TcHmiCharting.BarGraph.BarGraphArrangement.Stacked){const resultArr=[];for(let j=0,jj=this.__barGraph.length;j<jj;j++){for(const[index,value]of this.__barGraph[j].values.entries())resultArr[index]?resultArr[index]+=value*scaleFactor:resultArr[index]=value*scaleFactor;this.__xAxis.setMainTickStartValueOverride(Math.min(...resultArr,0)),this.__xAxis.setMainTickEndValueOverride(Math.max(...resultArr))}}else{for(let k=0,kk=this.__barGraph[j].values.length;k<kk;k++)(null===startValueX||startValueX>this.__barGraph[j].values[k]*scaleFactor)&&(startValueX=this.__barGraph[j].values[k]*scaleFactor),(null===endValueX||endValueX<this.__barGraph[j].values[k]*scaleFactor)&&(endValueX=this.__barGraph[j].values[k]*scaleFactor);if(null!==startValueX&&null!==endValueX){let overrideStartX=startValueX,overrideEndX=endValueX;startValueX===endValueX?overrideStartX===overrideEndX&&overrideStartX>Number.MAX_SAFE_INTEGER?(overrideStartX-=.1*overrideStartX/100,overrideEndX+=.1*overrideEndX/100):this.__barGraph[j].yAxis?.getLogarithmicScale()?(overrideStartX-=.1,overrideEndX+=1):(overrideStartX-=.5,overrideEndX+=.5):(overrideStartX=startValueX,overrideEndX=endValueX),this.__xAxis.setMainTickStartValueOverride(overrideStartX),this.__xAxis.setMainTickEndValueOverride(overrideEndX)}}}if(this.__xAxis.drawAxis({x:0,y:canvasHeight},{x:canvasWidth,y:canvasHeight}),xAxisHeight=this.__xAxis.getHeight(),xAxisHeight>0?xAxisHeight+=10:xAxisHeight=defaultDistance,null!==this.__yAxis&&void 0!==this.__yAxis&&this.__yAxis.length>0){null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight);let widthLeft=defaultDistance,widthRight=defaultDistance,showOnlyYAxis=!1,biggestFirst=0,biggestLatest=0;for(let h=0,hh=this.__yAxis.length;h<hh;h++){this.__yAxis[h].setMainTickStartValueOverride(null),this.__yAxis[h].setMainTickEndValueOverride(null);let startValue=0,endValue=null;if(this.__yAxis[h].getAutoScaling()){for(let j=0,jj=this.__barGraph.length;j<jj;j++)(null===endValue||endValue<this.__barGraph[j].values.length-1)&&(endValue=this.__barGraph[j].values.length-1);startValue=0,null!==startValue&&null!==endValue&&(startValue===endValue&&startValue>Number.MAX_SAFE_INTEGER?(startValue-=.1*startValue/100,endValue+=.1*endValue/100):startValue===endValue&&(startValue-=.5,endValue+=.5),this.__yAxis[h].setMainTickStartValueOverride(startValue),this.__yAxis[h].setMainTickEndValueOverride(endValue))}let yAxis=this.__yAxis[h],labelArray=yAxis.getCalculatedLabels();if(yAxis.getShowAxis()&&yAxis.getShowLabels()){let callback=yAxis.getYAxisCallback(),mainTickSteps=yAxis.getMainTickSteps();if(null!==callback){if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[0])]));first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(callback.apply(this,[parseFloat(labelArray[mainTickSteps-1])]));latest>biggestLatest&&(biggestLatest=latest)}}else{if(void 0!==labelArray[0]&&null!==labelArray[0]){let first=yAxis.calculateLabelHeight(labelArray[0]);first>biggestFirst&&(biggestFirst=first)}if(null!==mainTickSteps&&void 0!==labelArray[mainTickSteps-1]&&null!==labelArray[mainTickSteps-1]){let latest=yAxis.calculateLabelHeight(labelArray[mainTickSteps-1]);latest>biggestLatest&&(biggestLatest=latest)}}}}for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__xAxis.getShowAxis()||(showOnlyYAxis=!0),this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight},{x:widthLeft,y:defaultDistance},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthLeft=widthLeft+10+this.__yAxis[i].getWidth())):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight},{x:canvasWidth-widthRight,y:defaultDistance},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),this.__yAxis[i].getShowAxis()&&(widthRight=widthRight+10+this.__yAxis[i].getWidth()));canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder.width,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder.width,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0});let yAxisLabel=this.__yAxis[0].getCalculatedNumbers(),yAxisMainTickSteps=this.__yMainTickSteps,barWidthDrawingBorder=0;if(null===this.__barWidth)if(this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked)if(this.__barGraph.length>0)if(null!==yAxisMainTickSteps&&yAxisMainTickSteps>1&&0!==yAxisLabel.length){let yCalc=this.__yAxis[0].getLineHeight()/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);this.__calcBarWidth=Math.floor(Math.floor(yCalc)*(2/3)),this.__calcBarWidth<1&&(this.__calcBarWidth=1),barWidthDrawingBorder=this.__calcBarWidth}else this.__calcBarWidth=1,barWidthDrawingBorder=this.__calcBarWidth;else this.__calcBarWidth=0,barWidthDrawingBorder=this.__calcBarWidth;else if(this.__barGraph.length>0)if(null!==yAxisMainTickSteps&&yAxisMainTickSteps>1&&0!==yAxisLabel.length){let yCalc=this.__yAxis[0].getLineHeight()/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(this.__barGraph.length>0){let placeForAllBars=Math.floor(Math.floor(yCalc)*(2/3));barWidthDrawingBorder=placeForAllBars,this.__calcBarWidth=(placeForAllBars-2*(this.__barGraph.length-1))/this.__barGraph.length}else this.__calcBarWidth=Math.floor(Math.floor(yCalc)*(2/3)),barWidthDrawingBorder=this.__calcBarWidth;this.__calcBarWidth<1&&(this.__calcBarWidth=1,barWidthDrawingBorder=this.__calcBarWidth)}else this.__calcBarWidth=1,barWidthDrawingBorder=this.__calcBarWidth;else this.__calcBarWidth=0,barWidthDrawingBorder=this.__calcBarWidth;else this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked?barWidthDrawingBorder=this.__barWidth:(barWidthDrawingBorder=this.__barWidth,this.__barGraph.length>1&&(barWidthDrawingBorder=2*((this.__barGraph.length-1)/2*2+this.__barGraph.length/2*this.__barWidth)));let gridLineWidth=0;null!==this.__grid&&(gridLineWidth=this.__grid.getLineWidth()||0,gridLineWidth/=2),this.__drawingBorder.height=gridLineWidth>barWidthDrawingBorder/2?gridLineWidth:barWidthDrawingBorder/2,this.__drawingBorder.width=gridLineWidth>defaultDistance?gridLineWidth:defaultDistance,this.__drawingBorder.width<defaultDistance&&(this.__drawingBorder.width=defaultDistance),null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),widthLeft=defaultDistance,widthRight=defaultDistance;for(let i=0,ii=this.__yAxis.length;i<ii;i++)this.__yAxis[i].getPosition()===TcHmiCharting.IAxis.Position.Left?(this.__yAxis[i].drawAxis({x:widthLeft,y:canvasHeight-xAxisHeight-this.__drawingBorder.height},{x:widthLeft,y:defaultDistance+this.__drawingBorder.height},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),widthLeft=widthLeft+10+this.__yAxis[i].getWidth()):(this.__yAxis[i].drawAxis({x:canvasWidth-widthRight,y:canvasHeight-xAxisHeight-this.__drawingBorder.height},{x:canvasWidth-widthRight,y:defaultDistance+this.__drawingBorder.height},showOnlyYAxis,{first:biggestFirst,latest:biggestLatest}),widthRight=widthRight+10+this.__yAxis[i].getWidth());if(canvasWidth-widthRight-widthLeft>0?this.__xAxis.drawAxis({x:widthLeft+this.__drawingBorder.width,y:canvasHeight},{x:canvasWidth-widthRight-this.__drawingBorder.width,y:canvasHeight}):this.__xAxis.drawAxis({x:0,y:0},{x:0,y:0}),null===this.__barWidth)if(this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Overlapped||this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked)if(this.__barGraph.length>0)if(null!==yAxisMainTickSteps&&yAxisMainTickSteps>1&&0!==yAxisLabel.length){let yCalc=this.__yAxis[0].getLineHeight()/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);this.__calcBarWidth=Math.floor(Math.floor(yCalc)*(2/3)),this.__calcBarWidth<1&&(this.__calcBarWidth=1)}else this.__calcBarWidth=1;else this.__calcBarWidth=0;else if(this.__barGraph.length>0)if(null!==yAxisMainTickSteps&&yAxisMainTickSteps>1&&0!==yAxisLabel.length){let yCalc=this.__yAxis[0].getLineHeight()/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(this.__barGraph.length>0){let placeForAllBars=Math.floor(Math.floor(yCalc)*(2/3));this.__calcBarWidth=(placeForAllBars-2*(this.__barGraph.length-1))/this.__barGraph.length}else this.__calcBarWidth=Math.floor(Math.floor(yCalc)*(2/3));this.__calcBarWidth<1&&(this.__calcBarWidth=1)}else this.__calcBarWidth=1;else this.__calcBarWidth=0;let xAxisMainTickSteps=this.__xAxis.getMainTickSteps(),xAxisWidth=this.__xAxis.getAxisWidth(),yAxisWidth=this.getYAxisWidth();if(null!==xAxisMainTickSteps&&null!==yAxisMainTickSteps&&null!==xAxisWidth&&null!==yAxisWidth){let xAxisSubTickSteps=this.__xAxis.getSubTickSteps(),yAxisSubTickSteps=this.__ySubTickSteps,showGridHorizontal=!!this.__grid&&this.__grid.getShowHorizontalLines(),showGridVertical=!!this.__grid&&this.__grid.getShowVerticalLines(),showSubgridHorizontal=!!this.__subgrid&&this.__subgrid.getShowHorizontalLines(),showSubgridVertical=!!this.__subgrid&&this.__subgrid.getShowVerticalLines(),gridBackgroundColor=this.__grid?this.__grid.getBackgroundColor():null;if(((showGridHorizontal||showGridVertical)&&this.__grid&&null!==this.__grid.getLineColor()&&null!==this.__grid.getLineWidth()&&null!==this.__grid.getLineStyle()||(showSubgridHorizontal&&null!==yAxisSubTickSteps||showSubgridVertical&&null!==xAxisSubTickSteps)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle())&&this.__contextFrame&&gridBackgroundColor&&(this.__contextFrame.fillStyle=gridBackgroundColor,showOnlyYAxis?this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder.width,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder.height):this.__contextFrame.fillRect(this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,canvasHeight-xAxisHeight-yAxisWidth/2,this.__xAxis.getLineWidth()+2*this.__drawingBorder.width,-this.__yAxis[0].getLineHeight()-2*this.__drawingBorder.height)),this.__xAxis.getLogarithmicScale()){let verticalSubgridLines=[],diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let yValue=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder.height-yAxisWidth/2;if(this.__xAxis.getLogarithmicScale()){let xPoints=this.__xAxis.getLogarithmicXPointsForSubgrid();for(let k=0,kk=xPoints.length;k<kk;k++)this.__subgrid&&this.__subgrid.getShowVerticalLines()&&verticalSubgridLines.push({start:{x:xPoints[k],y:yValue},end:{x:xPoints[k],y:yValue-this.__yAxis[0].getLineHeight()}})}(showSubgridHorizontal||showSubgridVertical)&&this.__subgrid&&null!==this.__subgrid.getLineColor()&&null!==this.__subgrid.getLineWidth()&&null!==this.__subgrid.getLineStyle()&&this.__subgrid.drawLines(verticalSubgridLines,[])}else this.__subgrid&&this.__grid&&(showOnlyYAxis?this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2-this.__drawingBorder.height},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,this.__grid.getLineWidth()||0,this.__drawingBorder):this.__subgrid.draw({x:this.__xAxis.getXAxisLeftWidth(),y:canvasHeight-xAxisHeight-yAxisWidth/2-this.__drawingBorder.height},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisSubTickSteps,this.__xAxis.getLineWidth()/(xAxisMainTickSteps-1),yAxisSubTickSteps,this.__yAxis[0].getLineHeight()/(yAxisMainTickSteps-1),xAxisMainTickSteps,yAxisMainTickSteps,this.__grid.getLineWidth()||0,this.__drawingBorder));if(this.__grid&&(showOnlyYAxis?this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,y:canvasHeight-xAxisHeight-this.__yAxis[0].getDiffStartLabelAndLine()-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,this.__drawingBorder):this.__grid.draw({x:this.__xAxis.getXAxisLeftWidth()-this.__drawingBorder.width,y:canvasHeight-xAxisHeight-yAxisWidth/2},this.__xAxis.getLineWidth(),this.__yAxis[0].getLineHeight(),xAxisMainTickSteps,yAxisMainTickSteps,this.__drawingBorder)),this.__referenceLines){let diffOnlyYAxis=0;showOnlyYAxis&&(diffOnlyYAxis=this.__yAxis[0].getDiffStartLabelAndLine());let beginY=canvasHeight-xAxisHeight-diffOnlyYAxis-this.__drawingBorder.height-yAxisWidth/2;for(let i=0,ii=this.__referenceLines.length;i<ii;i++)if(this.__referenceLines[i].getShow())if(this.__referenceLines[i].getOrientation()===TcHmiCharting.ReferenceLine.Orientation.Horizontal)if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__yAxis[0].getLineHeight()*valuePercent/100,startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,yMainTickSteps=this.__yAxis[0].getMainTickSteps();if(this.__yAxis[0].getLogarithmicScale()&&yMainTickSteps&&yMainTickSteps>=2){let yAxisLength=this.__yAxis[0].getLineHeight(),y=yAxisLength+(this.__yAxis[0].getDiffEndLabelAndLine()+(this.__yAxis[0].getAxisWidth()||0)/2+defaultDistance+this.__drawingBorder.height)-(Math.log10(value)-Number(this.__yAxis[0].getCalculatedNumbers()[0].toExponential().split("e")[1]))*(yAxisLength/(yMainTickSteps-1)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let startValue=this.__yAxis[0].getMainTickStartValueOverride()||this.__yAxis[0].getMainTickStartValue()||0,multiplier=Math.pow(10,this.__yAxis[0].getDecimalPlaces()||0),min=Math.round(startValue*multiplier)/multiplier,endValue=this.__yAxis[0].getMainTickEndValueOverride()||this.__yAxis[0].getMainTickEndValue()||0,multiplierMax=Math.pow(10,this.__yAxis[0].getDecimalPlaces()||0),max=Math.round(endValue*multiplierMax)/multiplierMax;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__yAxis[0].getLineHeight()/(max-min)),startPoint={x:this.__xAxis.getXAxisLeftWidth(),y:beginY-diffPixel},endPoint={x:this.__xAxis.getXAxisLeftWidth()+this.__xAxis.getLineWidth(),y:beginY-diffPixel};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}else{let offsetLeft=this.__xAxis.getXAxisLeftWidth()||0;if("%"===this.__referenceLines[i].getValueUnit()){let valuePercent=this.__referenceLines[i].getValue()||0;if(valuePercent>=0&&valuePercent<=100){let diffPixel=this.__xAxis.getLineWidth()*valuePercent/100,startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}else{let value=this.__referenceLines[i].getValue()||0,xMainTickSteps=this.__xAxis.getMainTickSteps();if(this.__xAxis.getLogarithmicScale()&&xMainTickSteps&&xMainTickSteps>=2){let xAxisLength=this.__xAxis.getLineWidth(),x=offsetLeft+(Math.log10(value)-Number(this.__xAxis.getCalculatedNumbers()[0].toExponential().split("e")[1]))*(xAxisLength/(xMainTickSteps-1)),startPoint={x,y:beginY},endPoint={x,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}else{let min=this.__xAxis.getMainTickStartValueOverride()||this.__xAxis.getMainTickStartValue()||0,max=this.__xAxis.getMainTickEndValueOverride()||this.__xAxis.getMainTickEndValue()||0;if(value>=min&&value<=max){let diffPixel=(value-min)*(this.__xAxis.getLineWidth()/(max-min)),startPoint={x:offsetLeft+diffPixel,y:beginY},endPoint={x:offsetLeft+diffPixel,y:beginY-this.__yAxis[0].getLineHeight()};this.__referenceLines[i].drawLine(startPoint,endPoint)}}}}}}this.__barChanged=!0,this.__widthLeft=this.__xAxis.getXAxisLeftWidth()}}if(this.__barChanged)if(null!==this.__yAxis&&void 0!==this.__yAxis)if(this.__yAxis.length>0){null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);let canvasElem=this.__elementRoot.find(".TcHmi_Controls_Beckhoff_Controls-chart-canvas-drawing")[0],minValues=[];this.__barGraph.length>=1&&this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked&&(minValues=new Array(this.__barGraph[0].values.length).fill(0));for(let i=0,ii=this.__barGraph.length;i<ii;i++)if(null!==this.__barGraph[i].yAxis&&void 0!==this.__barGraph[i].yAxis){let barGraph=this.__barGraphs[i];barGraph.setCanvas(canvasElem),null===this.__barWidth?barGraph.setBarWidth(this.__calcBarWidth):barGraph.setBarWidth(this.__barWidth),barGraph.setDrawingBorder(this.__drawingBorder),this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Overlapped?barGraph.draw(this.__barGraph[i],this.__xAxis):this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Clustered?barGraph.drawClustered(this.__barGraph[i],this.__xAxis,i):this.__barGraphArrangement===TcHmiCharting.HorizontalBarGraph.BarGraphArrangement.Stacked&&barGraph.drawStacked(this.__barGraph[i],this.__xAxis,minValues)}this.__barChanged=!1}else null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);else null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight);this.setHasChanged(!1)}else null!==this.__contextFrame&&this.__contextFrame.clearRect(0,0,canvasWidth,canvasHeight),null!==this.__contextDrawing&&this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight)}}}TcHmiCharting.HorizontalBarChart=HorizontalBarChart}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class HorizontalBarGraph extends TcHmiCharting.IGraph{__barWidth=null;__barColor=null;__drawingBorder={height:0,width:0};__scaleFactor=1;__colorRanges=null;constructor(canvas){super(canvas)}draw(bar,xAxis){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLength=xAxis.getLineWidth(),xCalc=xAxisLength/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();let xBegin=(0-xStartValue)*xCalc+offsetLeft;for(let i=0,ii=bar.values.length-1;i<=ii;i++){let x,y=yAxisLength-(i-yStartValue)*yCalc+offsetTop-this.__barWidth/2;x=xAxis.getLogarithmicScale()&&0!==bar.values[i]&&xAxisMainTickSteps>=2?(Math.log10(bar.values[i]*this.__scaleFactor)-Number(xAxisLabel[0].toExponential().split("e")[1]))*(xAxisLength/(xAxisMainTickSteps-1))+offsetLeft:(bar.values[i]*this.__scaleFactor-xStartValue)*xCalc+offsetLeft,x>this.__canvas.width+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?x=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:x<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(x=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(xBegin,y,x-xBegin,this.__barWidth)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder.width),canvasHeight)}}}drawClustered(bar,xAxis,index){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLength=xAxis.getLineWidth(),xCalc=xAxisLength/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();let xBegin=(0-xStartValue)*xCalc+offsetLeft;for(let i=0,ii=bar.values.length-1;i<=ii;i++){let x,y=yAxisLength-(i-yStartValue)*yCalc+offsetTop-this.__drawingBorder.height+2*index+index*this.__barWidth;x=xAxis.getLogarithmicScale()&&0!==bar.values[i]&&xAxisMainTickSteps>=2?(Math.log10(bar.values[i]*this.__scaleFactor)-Number(xAxisLabel[0].toExponential().split("e")[1]))*(xAxisLength/(xAxisMainTickSteps-1))+offsetLeft:(bar.values[i]*this.__scaleFactor-xStartValue)*xCalc+offsetLeft,x>this.__canvas.width+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?x=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:x<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(x=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(xBegin,y,x-xBegin,this.__barWidth)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder.width),canvasHeight)}}}drawStacked(bar,xAxis,minValues){if(null!==bar.yAxis){let yAxisWidth=bar.yAxis.getAxisWidth();if(null===yAxisWidth)return;let offsetTop=bar.yAxis.getDiffEndLabelAndLine()+yAxisWidth/2+5+this.__drawingBorder.height,offsetLeft=xAxis.getXAxisLeftWidth()||0,xStartValue=xAxis.getMainTickStartValue();if(xAxis.getAutoScaling()){let valueOverride=xAxis.getMainTickStartValueOverride();null!==valueOverride&&(xStartValue=valueOverride)}if(null===xStartValue)return;let yStartValue=bar.yAxis.getMainTickStartValue();if(bar.yAxis.getAutoScaling()){let valueOverride=bar.yAxis.getMainTickStartValueOverride();null!==valueOverride&&(yStartValue=valueOverride)}if(null===yStartValue)return;let xAxisLabel=xAxis.getCalculatedNumbers(),yAxisLabel=bar.yAxis.getCalculatedNumbers(),xAxisMainTickSteps=xAxis.getMainTickSteps();if(null===xAxisMainTickSteps)return;let yAxisMainTickSteps=bar.yAxis.getMainTickSteps();if(null===yAxisMainTickSteps)return;let xAxisLength=xAxis.getLineWidth(),xCalc=xAxisLength/(xAxisLabel[xAxisMainTickSteps-1]-xAxisLabel[0]),yAxisLength=bar.yAxis.getLineHeight(),yCalc=yAxisLength/(yAxisLabel[yAxisMainTickSteps-1]-yAxisLabel[0]);if(null!==this.__context&&void 0!==this.__canvas){if(null!==this.__barWidth&&null!==this.__barColor){this.__context.beginPath();for(let i=0,ii=bar.values.length-1;i<=ii;i++){let minValue=0;void 0!==minValues[i]&&(minValue=minValues[i]);let xBegin,x,y=yAxisLength-(i-yStartValue)*yCalc+offsetTop-this.__barWidth/2;xAxis.getLogarithmicScale()&&0!==bar.values[i]&&xAxisMainTickSteps>=2?(xBegin=0!==minValue?(Math.log10(minValue)-Number(xAxisLabel[0].toExponential().split("e")[1]))*(xAxisLength/(xAxisMainTickSteps-1)):offsetLeft,x=(Math.log10(bar.values[i]*this.__scaleFactor+minValue)-Number(xAxisLabel[0].toExponential().split("e")[1]))*(xAxisLength/(xAxisMainTickSteps-1))+offsetLeft):(xBegin=(minValue-xStartValue)*xCalc+offsetLeft,x=(minValue+bar.values[i]*this.__scaleFactor-xStartValue)*xCalc+offsetLeft),x>this.__canvas.width+TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW?x=TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW:x<-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW&&(x=-1*TcHmiCharting.IAxis.CANVAS_MAX_OVERFLOW),this.__context.fillStyle=this.getColorFromColorRanges(this.__colorRanges,bar.values[i],this.__barColor),this.__context.fillRect(xBegin,y,x-xBegin,this.__barWidth),void 0!==minValues[i]?minValues[i]=minValues[i]+bar.values[i]*this.__scaleFactor:minValues.push(bar.values[i]*this.__scaleFactor)}}let canvasWidth=this.__canvas.width/window.devicePixelRatio,canvasHeight=this.__canvas.height/window.devicePixelRatio;this.__context.clearRect(0,0,canvasWidth,offsetTop-this.__drawingBorder.height),this.__context.clearRect(0,0,offsetLeft-this.__drawingBorder.width,canvasHeight),this.__context.clearRect(0,canvasHeight,canvasWidth,-(canvasHeight-yAxisLength-offsetTop-this.__drawingBorder.height)),this.__context.clearRect(canvasWidth,0,-(canvasWidth-offsetLeft-xAxisLength-this.__drawingBorder.width),canvasHeight)}}}setBarWidth(barWidth){this.__barWidth=barWidth}getBarWidth(){return this.__barWidth}setDrawingBorder(drawingBorder){this.__drawingBorder=drawingBorder}setBarColor(barColor){this.__barColor=barColor}getBarColor(){return this.__barColor}getScaleFactor(){return this.__scaleFactor}setScaleFactor(scaleFactor){this.__scaleFactor=scaleFactor||1}setCanvas(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}getCanvas(){return this.__canvas}getColorRanges(){return this.__colorRanges}setColorRanges(colorRanges){this.__colorRanges=colorRanges}}TcHmiCharting.HorizontalBarGraph=HorizontalBarGraph,function(HorizontalBarGraph){let BarGraphArrangement;!function(BarGraphArrangement){BarGraphArrangement.Overlapped="Overlapped",BarGraphArrangement.Clustered="Clustered",BarGraphArrangement.Stacked="Stacked"}(BarGraphArrangement=HorizontalBarGraph.BarGraphArrangement||(HorizontalBarGraph.BarGraphArrangement={}))}(HorizontalBarGraph=TcHmiCharting.HorizontalBarGraph||(TcHmiCharting.HorizontalBarGraph={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class ReferenceLine{__name=null;__show=!0;__yAxisId=null;__value=null;__valueUnit="Value";__orientation=ReferenceLine.Orientation.Horizontal;__locked=!0;__showTooltip=!1;__highlightDataPoints=!1;__color=null;__lineWidth=null;__showLabel=!0;__labelHorizontalAlignment=null;__labelVerticalAlignment=null;__labelFontFamily=null;__labelFontSize=null;__labelFontSizeUnit="px";__labelFontWeight=null;__startPoint=null;__endPoint=null;__canvas;__context;constructor(canvas){this.__canvas=canvas,this.__context=this.__canvas.getContext("2d")}drawLine(startPoint,endPoint){if(this.__context&&this.__lineWidth&&this.__color){if(this.__startPoint=startPoint,this.__endPoint=endPoint,this.__context.lineWidth=this.__lineWidth,this.__context.setLineDash([]),this.__context.strokeStyle=this.__color,this.__context.fillStyle=this.__color,this.__context.beginPath(),"Center"===this.__labelVerticalAlignment&&this.__showLabel){let labelWidth=this.calculateLabelWidth(this.__name);if(this.__orientation===ReferenceLine.Orientation.Horizontal)switch(this.__labelHorizontalAlignment){case"Left":this.__context.moveTo(startPoint.x+labelWidth,startPoint.y),this.__context.lineTo(endPoint.x,endPoint.y);break;case"Center":let diffX=endPoint.x-startPoint.x;this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(startPoint.x+diffX/2-labelWidth/2,endPoint.y),this.__context.moveTo(startPoint.x+diffX/2+labelWidth/2,endPoint.y),this.__context.lineTo(endPoint.x,endPoint.y);break;case"Right":this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x-labelWidth,endPoint.y);break;default:this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x,endPoint.y)}else switch(this.__labelHorizontalAlignment){case"Left":this.__context.moveTo(startPoint.x,startPoint.y-labelWidth),this.__context.lineTo(endPoint.x,endPoint.y);break;case"Center":let diffX=startPoint.y-endPoint.y;this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x,startPoint.y-diffX/2+labelWidth/2),this.__context.moveTo(endPoint.x,startPoint.y-diffX/2-labelWidth/2),this.__context.lineTo(endPoint.x,endPoint.y);break;case"Right":this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x,endPoint.y+labelWidth);break;default:this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x,endPoint.y)}}else this.__context.moveTo(startPoint.x,startPoint.y),this.__context.lineTo(endPoint.x,endPoint.y);if(this.__context.stroke(),this.__showLabel&&this.__name){this.__context.save(),this.__context.beginPath(),this.__context.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily;let xPoint=0,yPoint=0;switch(this.__labelVerticalAlignment){case"Center":this.__context.textBaseline="middle";break;case"Bottom":this.__context.textBaseline="top";break;default:this.__context.textBaseline="bottom"}if(this.__orientation===ReferenceLine.Orientation.Horizontal)switch(yPoint=startPoint.y,this.__labelHorizontalAlignment){case"Left":xPoint=startPoint.x,this.__context.textAlign="left";break;case"Center":xPoint=startPoint.x+(endPoint.x-startPoint.x)/2,this.__context.textAlign="center";break;default:xPoint=endPoint.x,this.__context.textAlign="right"}else switch(this.__labelHorizontalAlignment){case"Left":this.__context.textAlign="left",this.__context.translate(startPoint.x,startPoint.y),this.__context.rotate(-.5*Math.PI);break;case"Center":this.__context.textAlign="center",this.__context.translate(startPoint.x,startPoint.y-(startPoint.y-endPoint.y)/2),this.__context.rotate(-.5*Math.PI);break;default:this.__context.textAlign="right",this.__context.translate(startPoint.x,endPoint.y),this.__context.rotate(-.5*Math.PI)}this.__context.fillText(this.__name,xPoint,yPoint),this.__context.stroke(),this.__context.restore()}}}calculateLabelWidth(label){let cxt=this.__canvas.getContext("2d");if(null!==cxt&&label&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily){return cxt.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,cxt.measureText(label).width}return 0}getStartPoint(){return this.__startPoint}getEndPoint(){return this.__endPoint}setName(name){this.__name=name}getName(){return this.__name}setShow(show){this.__show=show}getShow(){return this.__show}setYAxisId(yAxisId){this.__yAxisId=yAxisId}getYAxisId(){return this.__yAxisId}setValue(value){this.__value=value}getValue(){return this.__value}setValueUnit(valueUnit){this.__valueUnit=valueUnit}getValueUnit(){return this.__valueUnit}setOrientation(orientation){this.__orientation=orientation}getOrientation(){return this.__orientation}setLocked(locked){this.__locked=locked}getLocked(){return this.__locked}setShowTooltip(showTooltip){this.__showTooltip=showTooltip}getShowTooltip(){return this.__showTooltip}setHighlightDataPoints(highlightDataPoints){this.__highlightDataPoints=highlightDataPoints}getHighlightDataPoints(){return this.__highlightDataPoints}setColor(color){this.__color=color}getColor(){return this.__color}setLineWidth(lineWidth){this.__lineWidth=lineWidth}getLineWidth(){return this.__lineWidth}setShowLabel(showLabel){this.__showLabel=showLabel}getShowLabel(){return this.__showLabel}setLabelHorizontalAlignment(labelHorizontalAlignment){this.__labelHorizontalAlignment=labelHorizontalAlignment}getLabelHorizontalAlignment(){return this.__labelHorizontalAlignment}setLabelVerticalAlignment(labelVerticalAlignment){this.__labelVerticalAlignment=labelVerticalAlignment}getLabelVerticalAlignment(){return this.__labelVerticalAlignment}setLabelFontFamily(labelFontFamily){if(labelFontFamily)this.__labelFontFamily=labelFontFamily;else{const inheritedFontfamily=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-family")["font-family"];this.__labelFontFamily=inheritedFontfamily||null}}getLabelFontFamily(){return this.__labelFontFamily}setLabelFontSize(labelFontSize){if(labelFontSize)this.__labelFontSize=labelFontSize;else{const inheritedFontSize=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-size")["font-size"];this.__labelFontSize=inheritedFontSize?parseFloat(inheritedFontSize):null}}getLabelFontSize(){return this.__labelFontSize}setLabelFontWeight(labelFontWeight){if(labelFontWeight&&"Auto"!==labelFontWeight)this.__labelFontWeight=labelFontWeight;else{const inheritedFontWeight=TcHmi.StyleProvider.getComputedElementStyle(this.__canvas,"font-weight")["font-weight"];this.__labelFontWeight=inheritedFontWeight||null}}getLabelFontWeight(){return this.__labelFontWeight}}TcHmiCharting.ReferenceLine=ReferenceLine,function(ReferenceLine){let Orientation;!function(Orientation){Orientation[Orientation.Horizontal=0]="Horizontal",Orientation[Orientation.Vertical=1]="Vertical"}(Orientation=ReferenceLine.Orientation||(ReferenceLine.Orientation={}))}(ReferenceLine=TcHmiCharting.ReferenceLine||(TcHmiCharting.ReferenceLine={}))}(TcHmiCharting||(TcHmiCharting={})),function(TcHmiCharting){class PieChart extends TcHmiCharting.IChart{__pieDescription;__pieData;__labelPosition="Inside";__labelUnit=null;__percentLabelDecimalPlaces=2;__valueLabelDecimalPlaces=null;__labelFontFamily=null;__labelFontSize=null;__labelFontSizeUnit="px";__labelFontWeight=null;constructor(elementRoot,canvasWidth,canvasHeight){super(elementRoot,canvasWidth,canvasHeight,TcHmiCharting.IChart.Position.Background),this.__pieDescription=[],this.__pieData=[]}addPieceOfPie(pieceOfPie){this.__pieDescription.push(pieceOfPie)}addValueOfPie(valueOfPie){this.__pieData.push(valueOfPie)}remove(){super.remove(),this.__pieDescription=[],this.__pieData=[]}clear(width,height){super.clear(width,height),this.__pieDescription=[],this.__pieData=[]}calculateLabelWidth(label){if(this.__canvasDrawing){let cxt=this.__canvasDrawing.getContext("2d");if(null!==cxt&&label&&null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily){return cxt.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,cxt.measureText(label).width}}return 0}getLongestLabelWidth(labels){let width=0;if(this.__contextDrawing){if(null!==this.__labelFontWeight&&null!==this.__labelFontSize&&null!==this.__labelFontFamily){this.__contextDrawing.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily;for(let label of labels){let metrics=this.__contextDrawing.measureText(label);metrics.width>width&&(width=metrics.width)}}return labels.splice(0,labels.length),width}return 0}setLabelUnit(labelUnit){this.__labelUnit=labelUnit}getLabelUnit(){return this.__labelUnit}setLabelPosition(labelPosition){this.__labelPosition=labelPosition}getLabelPosition(){return this.__labelPosition}setPercentLabelDecimalPlaces(percentLabelDecimalPlaces){this.__percentLabelDecimalPlaces=percentLabelDecimalPlaces}getPercentLabelDecimalPlaces(){return this.__percentLabelDecimalPlaces}setValueLabelDecimalPlaces(valueLabelDecimalPlaces){this.__valueLabelDecimalPlaces=valueLabelDecimalPlaces}getValueLabelDecimalPlaces(){return this.__valueLabelDecimalPlaces}setLabelFontFamily(labelFontFamily){if(this.__canvasDrawing)if(labelFontFamily)this.__labelFontFamily=labelFontFamily;else{const inheritedFontfamily=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasDrawing,"font-family")["font-family"];this.__labelFontFamily=inheritedFontfamily||null}}getLabelFontFamily(){return this.__labelFontFamily}setLabelFontSize(labelFontSize){if(this.__canvasDrawing)if(labelFontSize)this.__labelFontSize=labelFontSize;else{const inheritedFontSize=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasDrawing,"font-size")["font-size"];this.__labelFontSize=inheritedFontSize?parseFloat(inheritedFontSize):null}}getLabelFontSize(){return this.__labelFontSize}getLabelFontSizeUnit(){return this.__labelFontSizeUnit}setLabelFontWeight(labelFontWeight){if(this.__canvasDrawing)if(labelFontWeight&&"Auto"!==labelFontWeight)this.__labelFontWeight=labelFontWeight;else{const inheritedFontWeight=TcHmi.StyleProvider.getComputedElementStyle(this.__canvasDrawing,"font-weight")["font-weight"];this.__labelFontWeight=inheritedFontWeight||null}}getLabelFontWeight(){return this.__labelFontWeight}draw(){if(this.__canvasDrawing){let canvasWidth=this.__canvasDrawing.width/window.devicePixelRatio,canvasHeight=this.__canvasDrawing.height/window.devicePixelRatio,lineHeight=this.__labelFontSize?1.2*this.__labelFontSize:0;if(this.__contextDrawing&&this.__contextDrawing)if(this.__contextDrawing.clearRect(0,0,canvasWidth,canvasHeight),"Inside"===this.__labelPosition){let diameter=canvasWidth>canvasHeight?canvasHeight-20:canvasWidth-20,radius=diameter/2;if(diameter>0){let x=(canvasWidth-20)/2+10,y=(canvasHeight-20)/2+10,sum=this.__pieData.reduce((a,b)=>a+b,0),currentAngle=0,angles=[];for(let i=0,ii=Math.min(this.__pieDescription.length,this.__pieData.length);i<ii;i++){let pie=this.__pieDescription[i],portionAngle=this.__pieData[i]/sum*2*Math.PI;pie&&pie.pieColor&&(this.__contextDrawing.fillStyle=pie.pieColor.color,this.__contextDrawing.beginPath(),this.__contextDrawing.arc(x,y,radius,currentAngle,currentAngle+portionAngle),this.__contextDrawing.lineTo(.5+(0|x),.5+(0|y)),this.__contextDrawing.fill()),angles.push(currentAngle+portionAngle/2),currentAngle+=portionAngle}for(let i=0,ii=angles.length;i<ii;i++){let xPoint=x+2*radius/3*Math.cos(angles[i]),yPoint=y+2*radius/3*Math.sin(angles[i]),lines=[];if(this.__pieDescription[i].showName&&lines.push(this.__pieDescription[i].name),this.__pieDescription[i].showPercentLabel){let value=100*this.__pieData[i]/sum,valueAsString="";valueAsString=this.__percentLabelDecimalPlaces?value.toFixed(this.__percentLabelDecimalPlaces)+" %":value+" %",lines.push(valueAsString)}if(this.__pieDescription[i].showValueLabel){let valueAsString="";valueAsString=this.__valueLabelDecimalPlaces?this.__pieData[i].toFixed(this.__valueLabelDecimalPlaces):this.__pieData[i].toString(),this.__pieDescription[i].showUnit&&this.__labelUnit&&(valueAsString+=" "+this.__labelUnit),lines.push(valueAsString)}lines.length>1&&(yPoint-=lines.length*lineHeight/2-lineHeight/2),this.__contextDrawing.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,this.__contextDrawing.fillStyle=this.__pieDescription[i].labelColor?.color||"",this.__contextDrawing.textAlign="center",this.__contextDrawing.textBaseline="middle",this.__contextDrawing.beginPath();for(let j=0,jj=lines.length;j<jj;j++)this.__contextDrawing.fillText(lines[j],xPoint,yPoint+j*lineHeight)}}}else{let sum=this.__pieData.reduce((a,b)=>a+b,0),currentAngle=0,min=Math.min(this.__pieDescription.length,this.__pieData.length),angles=[],labels=[],allLabels=[];for(let i=0,ii=min;i<ii;i++){let portionAngle=this.__pieData[i]/sum*2*Math.PI;angles.push(currentAngle+portionAngle/2);let lines=[];if(this.__pieDescription[i].showName&&(lines.push(this.__pieDescription[i].name),allLabels.push(this.__pieDescription[i].name)),this.__pieDescription[i].showPercentLabel){let value=100*this.__pieData[i]/sum,valueAsString="";valueAsString=this.__percentLabelDecimalPlaces?value.toFixed(this.__percentLabelDecimalPlaces)+" %":value+" %",lines.push(valueAsString),allLabels.push(valueAsString)}if(this.__pieDescription[i].showValueLabel){let valueAsString="";valueAsString=this.__valueLabelDecimalPlaces?this.__pieData[i].toFixed(this.__valueLabelDecimalPlaces):this.__pieData[i].toString(),this.__pieDescription[i].showUnit&&this.__labelUnit&&(valueAsString+=" "+this.__labelUnit),lines.push(valueAsString),allLabels.push(valueAsString)}labels.push(lines),currentAngle+=portionAngle}let longestLabelWidth=this.getLongestLabelWidth(allLabels),longestLabelWidthOrHeight=longestLabelWidth>lineHeight?longestLabelWidth:lineHeight,radius=(canvasWidth>canvasHeight?canvasHeight-20-2*longestLabelWidthOrHeight:canvasWidth-20-2*longestLabelWidthOrHeight)/2,x=(canvasWidth-20)/2+10,y=(canvasHeight-20)/2+10;currentAngle=0;let boundingRects=[];for(let i=0,ii=min;i<ii;i++){let pie=this.__pieDescription[i],portionAngle=this.__pieData[i]/sum*2*Math.PI;pie&&pie.pieColor&&(this.__contextDrawing.fillStyle=pie.pieColor.color,this.__contextDrawing.beginPath(),this.__contextDrawing.arc(x,y,radius,currentAngle,currentAngle+portionAngle),this.__contextDrawing.lineTo(.5+(0|x),.5+(0|y)),this.__contextDrawing.fill());let boundingRectAct={x:x-5,y:y-5,width:longestLabelWidth,height:lineHeight*labels[i].length+10,angle:currentAngle+portionAngle/2+10},newPosition=this.calcPositionOfElem(boundingRectAct,boundingRects,angles[i],radius,{x,y},canvasWidth,canvasHeight);boundingRectAct.x=newPosition.x,boundingRectAct.y=newPosition.y,boundingRectAct.angle=newPosition.angle,boundingRects.push(boundingRectAct),currentAngle+=portionAngle}for(let i=0,ii=boundingRects.length;i<ii&&-1!==boundingRects[i].y;i++){this.__contextDrawing.font=this.__labelFontWeight+" "+this.__labelFontSize+this.__labelFontSizeUnit+" "+this.__labelFontFamily,this.__contextDrawing.fillStyle=this.__pieDescription[i].labelColor?.color||"",this.__contextDrawing.strokeStyle=this.__pieDescription[i].labelColor?.color||"";let isPositionedRight=boundingRects[i].angle>=0&&boundingRects[i].angle<=Math.PI/2||boundingRects[i].angle>=Math.PI+Math.PI/2&&boundingRects[i].angle<=2*Math.PI;this.__contextDrawing.textAlign=isPositionedRight?"end":"start",this.__contextDrawing.textBaseline="middle",this.__contextDrawing.beginPath(),labels[i].length>1&&(boundingRects[i].y=boundingRects[i].y-(labels[i].length*lineHeight/2-lineHeight/2));for(let j=0,jj=labels[i].length;j<jj;j++)this.__contextDrawing.fillText(labels[i][j],boundingRects[i].x,boundingRects[i].y+j*lineHeight);let longestLabelWidthForSection=this.getLongestLabelWidth(labels[i]),xPoint=x+(radius-10)*Math.cos(angles[i]),yPoint=y+(radius-10)*Math.sin(angles[i]),leftSideOfRightLabel=boundingRects[i].x-longestLabelWidthForSection-5,rightSideOfLeftLabel=boundingRects[i].x+longestLabelWidthForSection+5;this.__contextDrawing.moveTo(xPoint,yPoint);let intermediatePoint=isPositionedRight?xPoint+10>leftSideOfRightLabel?leftSideOfRightLabel:xPoint+10:xPoint-10<rightSideOfLeftLabel?rightSideOfLeftLabel:xPoint-10;this.__contextDrawing.lineTo(intermediatePoint,boundingRects[i].y),isPositionedRight?this.__contextDrawing.lineTo(leftSideOfRightLabel,boundingRects[i].y):this.__contextDrawing.lineTo(rightSideOfLeftLabel,boundingRects[i].y),this.__contextDrawing.stroke()}}}}calcPositionOfElem(elem,previousElems,actAngle,radius,middlePoint,canvasWidth,canvasHeight){let angle=actAngle,x=elem.x,y=elem.y,repeat=!1;angle>=0&&angle<=Math.PI/2||angle>=Math.PI+Math.PI/2&&angle<=2*Math.PI?(x=canvasWidth-5,y=middlePoint.y+radius*Math.sin(angle)):(x=5,y=middlePoint.y+radius*Math.sin(angle));let tryAgain=!0,goUp=!1;angle>=Math.PI&&angle<=2*Math.PI&&(goUp=!0);do{0===previousElems.length&&(repeat=!0);for(let rect of previousElems){if(this.pointInsideRect(rect,{x,y})||this.pointInsideRect(rect,{x,y:y+elem.height})){if(goUp){if(y--,y<elem.height/2&&tryAgain)goUp=!1,y=elem.y,tryAgain=!1;else if(y<elem.height/2&&!tryAgain)return{x,y,angle}}else if(y++,y+elem.height/2>canvasHeight&&tryAgain)goUp=!0,y=elem.y,tryAgain=!1;else if(y+elem.height/2>canvasHeight&&!tryAgain)return{x,y,angle};break}rect===previousElems[previousElems.length-1]&&(repeat=!0)}}while(!repeat);return{x,y,angle}}pointInsideRect(rect,point){return point.x>=rect.x&&point.x<=rect.x+rect.width&&point.y>=rect.y&&point.y<=rect.y+rect.height}}TcHmiCharting.PieChart=PieChart}(TcHmiCharting||(TcHmiCharting={})); |