TeeChart .NET For Blazor Chart not displaying

TeeChart for Microsoft Visual Studio .NET, Xamarin Studio (Android, iOS & Forms) & Monodevelop.
Post Reply
dynamicrisk
Newbie
Newbie
Posts: 12
Joined: Thu Apr 06, 2023 12:00 am

TeeChart .NET For Blazor Chart not displaying

Post by dynamicrisk » Wed Oct 02, 2024 9:10 pm

Hello,

I am trying to display a chart in a test project. My Chart.razor file contains the following code:

@page "/chart"

@using TestApp.Chart;
@using Microsoft.Extensions.Localization;
@using System.Reflection;
@using System.Resources;
@using System.IO;
@using Microsoft.AspNetCore.Components;

<h3>
@((MarkupString)(title))
</h3>

<br />
<br />

@((MarkupString)(supportUnit))
@((MarkupString)(chartResize))

<!-- Tab content -->
<div id="Example" class="tabcontent">

<canvas id="canvas1" width="1400" height="500" style="border: 0px solid #808080;" oncl>
This browser does not seem to support HTML5 Canvas.
</canvas>

</div>

<div id="Source" class="tabcontent">
<br />
@((MarkupString)chartCode)
</div>

@((MarkupString)chartJS)

@code
{
String chartImage;
String chartCode;
String chartResize;
String supportUnit;
String? chartJS = String.Empty;
string title;

protected override async Task OnInitializedAsync()
{
ChartCreationFactory chart = new ChartCreationFactory();
chartJS = await chart.CreateJSChart();

title = "Chart";
}
}

======

chart.CreateJSChart() returns the following script:

<script> var dynoTeeChart; dynoTeeChart=new Tee.Chart("canvas1");
dynoTeeChart.scroll.direction ='both';
dynoTeeChart.zoom.direction ='both';
dynoTeeChart.panel.format.fill="#FFFFFF";
dynoTeeChart.panel.format.gradient.colors = ["#EAEAEA", "#FFFFFF"];
dynoTeeChart.panel.format.gradient.direction = "topbottom";
dynoTeeChart.panel.format.gradient.visible = false;
dynoTeeChart.panel.format.stroke.fill="";
dynoTeeChart.panel.format.stroke.cap="butt";
dynoTeeChart.panel.format.shadow.visible=false;
dynoTeeChart.panel.margins.left=3;
dynoTeeChart.panel.margins.right=3;
dynoTeeChart.panel.margins.top=4;
dynoTeeChart.panel.margins.bottom=4;
dynoTeeChart.walls.back.visible=false;
dynoTeeChart.walls.back.format.fill="";
dynoTeeChart.walls.back.format.stroke.fill="";
dynoTeeChart.walls.back.format.gradient.colors = ["#EAEAEA", "#FFFFFF"];
dynoTeeChart.walls.back.format.gradient.direction = "topbottom";
dynoTeeChart.walls.back.format.gradient.visible = true;
dynoTeeChart.walls.back.format.stroke.fill="#000000";
dynoTeeChart.walls.back.format.stroke.cap="butt";
dynoTeeChart.walls.back.format.shadow.visible=false;
dynoTeeChart.title.text="ILI Chart";
dynoTeeChart.title.format.font.style="16px Verdana";
dynoTeeChart.title.format.font.fill="#808080";
dynoTeeChart.title.format.font.shadow.color="#A9A9A9";
dynoTeeChart.title.format.font.shadow.width=1;
dynoTeeChart.title.format.font.shadow.height=1;
dynoTeeChart.title.format.font.shadow.visible=false;
dynoTeeChart.title.format.font.shadow.blur=0;
dynoTeeChart.footer.visible=false;
dynoTeeChart.palette= new Tee.Palette(["#7799D6", "#FFCF68", "#FF7F47", "#81CADB", "#5E739E", "#50AE96", "#E63B41", "#FFF390", "#90EAD1", "#A3A3A3", "#FFFFC0", "#E7E7E7"]);
dynoTeeChart.axes.left.visible=true;
dynoTeeChart.axes.left.start=0;
dynoTeeChart.axes.left.end=100;
dynoTeeChart.axes.left.position=0;
dynoTeeChart.axes.left.labels.format.font.style="13px Verdana";
dynoTeeChart.axes.left.labels.format.font.fill="#808080";
dynoTeeChart.axes.left.labels.format.font.shadow.color="#A9A9A9";
dynoTeeChart.axes.left.labels.format.font.shadow.width=1;
dynoTeeChart.axes.left.labels.format.font.shadow.height=1;
dynoTeeChart.axes.left.labels.format.font.shadow.visible=false;
dynoTeeChart.axes.left.labels.format.font.shadow.blur=0;
dynoTeeChart.axes.left.format.stroke.fill="";
dynoTeeChart.axes.left.format.stroke.size=2;
dynoTeeChart.axes.left.format.stroke.cap="butt";
dynoTeeChart.axes.left.grid.format.stroke.fill="#A9A9A9";
dynoTeeChart.axes.left.grid.format.stroke.cap="butt";
dynoTeeChart.axes.top.visible=true;
dynoTeeChart.axes.top.start=0;
dynoTeeChart.axes.top.end=100;
dynoTeeChart.axes.top.position=0;
dynoTeeChart.axes.top.labels.format.font.style="13px Verdana";
dynoTeeChart.axes.top.labels.format.font.fill="#808080";
dynoTeeChart.axes.top.labels.format.font.shadow.color="#A9A9A9";
dynoTeeChart.axes.top.labels.format.font.shadow.width=1;
dynoTeeChart.axes.top.labels.format.font.shadow.height=1;
dynoTeeChart.axes.top.labels.format.font.shadow.visible=false;
dynoTeeChart.axes.top.labels.format.font.shadow.blur=0;
dynoTeeChart.axes.top.format.stroke.fill="#404040";
dynoTeeChart.axes.top.format.stroke.size=2;
dynoTeeChart.axes.top.format.stroke.cap="butt";
dynoTeeChart.axes.top.grid.format.stroke.fill="#A9A9A9";
dynoTeeChart.axes.top.grid.format.stroke.cap="butt";
dynoTeeChart.axes.right.visible=true;
dynoTeeChart.axes.right.start=0;
dynoTeeChart.axes.right.end=100;
dynoTeeChart.axes.right.position=0;
dynoTeeChart.axes.right.labels.format.font.style="13px Verdana";
dynoTeeChart.axes.right.labels.format.font.fill="#808080";
dynoTeeChart.axes.right.labels.format.font.shadow.color="#A9A9A9";
dynoTeeChart.axes.right.labels.format.font.shadow.width=1;
dynoTeeChart.axes.right.labels.format.font.shadow.height=1;
dynoTeeChart.axes.right.labels.format.font.shadow.visible=false;
dynoTeeChart.axes.right.labels.format.font.shadow.blur=0;
dynoTeeChart.axes.right.format.stroke.fill="";
dynoTeeChart.axes.right.format.stroke.size=2;
dynoTeeChart.axes.right.format.stroke.cap="butt";
dynoTeeChart.axes.right.grid.format.stroke.fill="#A9A9A9";
dynoTeeChart.axes.right.grid.format.stroke.cap="butt";
dynoTeeChart.axes.bottom.visible=true;
dynoTeeChart.axes.bottom.automatic=false;
dynoTeeChart.axes.bottom.maximum=1000;
dynoTeeChart.axes.bottom.minimum=0;
dynoTeeChart.axes.bottom.start=0;
dynoTeeChart.axes.bottom.end=100;
dynoTeeChart.axes.bottom.position=0;
dynoTeeChart.axes.bottom.labels.format.font.style="13px Verdana";
dynoTeeChart.axes.bottom.labels.format.font.fill="#808080";
dynoTeeChart.axes.bottom.labels.format.font.shadow.color="#A9A9A9";
dynoTeeChart.axes.bottom.labels.format.font.shadow.width=1;
dynoTeeChart.axes.bottom.labels.format.font.shadow.height=1;
dynoTeeChart.axes.bottom.labels.format.font.shadow.visible=false;
dynoTeeChart.axes.bottom.labels.format.font.shadow.blur=0;
dynoTeeChart.axes.bottom.format.stroke.fill="#404040";
dynoTeeChart.axes.bottom.format.stroke.size=2;
dynoTeeChart.axes.bottom.format.stroke.cap="butt";
dynoTeeChart.axes.bottom.grid.visible=false;
dynoTeeChart.axes.bottom.grid.format.stroke.fill="";
dynoTeeChart.axes.bottom.grid.format.stroke.cap="butt";
dynoTeeChart.axes.bottom.title.text="Odometer";
dynoTeeChart.axes.bottom.title.format.round.x=0;
dynoTeeChart.axes.bottom.title.format.round.y=0;
dynoTeeChart.axes.bottom.title.format.font.style="15px Verdana";
dynoTeeChart.axes.bottom.title.format.font.fill="#404040";
dynoTeeChart.axes.bottom.title.format.font.shadow.color="#A9A9A9";
dynoTeeChart.axes.bottom.title.format.font.shadow.width=1;
dynoTeeChart.axes.bottom.title.format.font.shadow.height=1;
dynoTeeChart.axes.bottom.title.format.font.shadow.visible=false;
dynoTeeChart.axes.bottom.title.format.font.shadow.blur=0;
dynoTeeChart.axes.bottom.title.format.fill="";
dynoTeeChart.axes.bottom.title.format.stroke.fill="";
dynoTeeChart.axes.bottom.title.format.gradient.colors = ["#FFD700", "#FFFFFF"];
dynoTeeChart.axes.bottom.title.format.gradient.direction = "topbottom";
dynoTeeChart.axes.bottom.title.format.gradient.visible = false;
dynoTeeChart.axes.bottom.title.format.stroke.fill="#000000";
dynoTeeChart.axes.bottom.title.format.stroke.cap="butt";
dynoTeeChart.axes.bottom.title.format.shadow.visible=false;
var axis0= dynoTeeChart.axes.add(false,false);
axis0.visible=true;
axis0.start=0;
axis0.end=8;
axis0.position=0;
axis0.labels.format.font.style="13px Verdana";
axis0.labels.format.font.fill="#808080";
axis0.labels.format.font.shadow.color="#A9A9A9";
axis0.labels.format.font.shadow.width=1;
axis0.labels.format.font.shadow.height=1;
axis0.labels.format.font.shadow.visible=false;
axis0.labels.format.font.shadow.blur=0;
axis0.format.stroke.fill="";
axis0.format.stroke.size=2;
axis0.format.stroke.cap="butt";
axis0.grid.format.stroke.fill="#A9A9A9";
axis0.grid.format.stroke.cap="butt";
var axis1= dynoTeeChart.axes.add(false,false);
axis1.visible=true;
axis1.inverted=true;
axis1.automatic=false;
axis1.maximum=12;
axis1.minimum=0;
axis1.start=10;
axis1.end=100;
axis1.position=0;
axis1.labels.format.font.style="13px Verdana";
axis1.labels.format.font.fill="#808080";
axis1.labels.format.font.shadow.color="#A9A9A9";
axis1.labels.format.font.shadow.width=1;
axis1.labels.format.font.shadow.height=1;
axis1.labels.format.font.shadow.visible=false;
axis1.labels.format.font.shadow.blur=0;
axis1.format.stroke.fill="";
axis1.format.stroke.size=2;
axis1.format.stroke.cap="butt";
axis1.grid.format.stroke.fill="#A9A9A9";
axis1.grid.format.stroke.cap="butt";
axis1.title.text="Clock";
axis1.title.format.round.x=0;
axis1.title.format.round.y=0;
axis1.title.format.font.style="15px Verdana";
axis1.title.format.font.fill="#404040";
axis1.title.format.font.shadow.color="#A9A9A9";
axis1.title.format.font.shadow.width=1;
axis1.title.format.font.shadow.height=1;
axis1.title.format.font.shadow.visible=false;
axis1.title.format.font.shadow.blur=0;
axis1.title.format.fill="";
axis1.title.format.stroke.fill="";
axis1.title.format.gradient.colors = ["#FFD700", "#FFFFFF"];
axis1.title.format.gradient.direction = "topbottom";
axis1.title.format.gradient.visible = false;
axis1.title.format.stroke.fill="#000000";
axis1.title.format.stroke.cap="butt";
axis1.title.format.shadow.visible=false;
var Series1=dynoTeeChart.addSeries(new Tee.PointXY());
Series1.title="points1";
Series1.format.fill="#7799D6";
Series1.format.stroke.cap="butt";
Series1.format.shadow.visible=false;
Series1.colorEach="no";
Series1.hover.enabled=false;
Series1.data.values=[1.0007928867830755,5.09095980594684,0.3233929793485668,8.991546865987512,8.406538656752122,7.848772044361571,6.195099755469368,2.470215724838154,5.889326610739117,11.76066005522772,7.625285168066473,2.635777544192528,7.160955813741605,10.316956390432349,9.2154334344742,6.25269777465043,1.719453664796112,0.38376268976601935,8.831074576833824,2.142060697407624,6.635003994450328,10.561246032657225,4.1417271150369706,10.643084622833513,2.6746995747409845];
Series1.data.x=[0,893.2457182573048,552.0158581390341,44.99631612292043,561.3558141411736,669.8950982788415,317.2411646119212,871.7600268280412,591.8532106131445,396.8103641151822,676.9772074452405,660.9123959515119,328.39571454787506,845.9016046056041,930.434172213013,323.3827796396561,712.7021339775562,920.3844694143121,367.89096587426275,94.80184135303004,117.77314340544054,641.1678651717632,570.5001158145282,454.6752348191526,210.04994414903376];
Series1.pointer.format.gradient.visible=false;
Series1.pointer.style="rectangle";
Series1.pointer.width=8;
Series1.pointer.height=8;
Series1.pointer.format.shadow.visible=false
Series1.dateFormat="d";
Series1.marks.visible=false;
Series1.marks.format.round.x=0;
Series1.marks.format.round.y=0;
Series1.marks.format.font.style="12px Verdana";
Series1.marks.format.font.fill="#000000";
Series1.marks.format.font.shadow.color="#A9A9A9";
Series1.marks.format.font.shadow.width=1;
Series1.marks.format.font.shadow.height=1;
Series1.marks.format.font.shadow.visible=false;
Series1.marks.format.font.shadow.blur=0;
Series1.marks.format.fill="#FFFFFF";
Series1.marks.format.gradient.colors = ["#FFD700", "#FFFFFF"];
Series1.marks.format.gradient.direction = "topbottom";
Series1.marks.format.gradient.visible = false;
Series1.marks.format.stroke.fill="#6B8AC1";
Series1.marks.format.stroke.cap="butt";
Series1.marks.format.shadow.visible=false;
Series1.marks.arrow.visible=false;
Series1.marks.arrow.length=0;
Series1.vertAxis=axis1;
var Series2=dynoTeeChart.addSeries(new Tee.PointXY());
Series2.title="points2";
Series2.format.fill="#FFCF68";
Series2.format.stroke.cap="butt";
Series2.format.shadow.visible=false;
Series2.colorEach="no";
Series2.hover.enabled=false;
Series2.data.values=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
Series2.data.x=[810.2725773061984,186.40463703504295,5.371035277584091,495.2649261218918,66.77719199825371,634.6808656133829,58.11407302427784,373.8322237885081,296.3020475934274,601.7501670574128,786.1798466329458,199.81992928099746,557.3521876108592,295.4526209647182,102.9324445552724];
Series2.pointer.format.gradient.visible=false;
Series2.pointer.style="downtriangle";
Series2.pointer.width=24;
Series2.pointer.height=24;
Series2.pointer.format.shadow.visible=false
Series2.dateFormat="d";
Series2.marks.visible=false;
Series2.marks.format.round.x=0;
Series2.marks.format.round.y=0;
Series2.marks.format.font.style="12px Verdana";
Series2.marks.format.font.fill="#000000";
Series2.marks.format.font.shadow.color="#A9A9A9";
Series2.marks.format.font.shadow.width=1;
Series2.marks.format.font.shadow.height=1;
Series2.marks.format.font.shadow.visible=false;
Series2.marks.format.font.shadow.blur=0;
Series2.marks.format.fill="#FFFFFF";
Series2.marks.format.gradient.colors = ["#FFD700", "#FFFFFF"];
Series2.marks.format.gradient.direction = "topbottom";
Series2.marks.format.gradient.visible = false;
Series2.marks.format.stroke.fill="#E6BA5E";
Series2.marks.format.stroke.cap="butt";
Series2.marks.format.shadow.visible=false;
Series2.marks.arrow.visible=false;
Series2.marks.arrow.length=0;
Series2.vertAxis=axis0;
var Series3=dynoTeeChart.addSeries(new Tee.PointXY());
Series3.visible=false;
Series3.title="points3";
Series3.format.fill="#FF7F47";
Series3.format.stroke.cap="butt";
Series3.format.shadow.visible=false;
Series3.colorEach="no";
Series3.hover.enabled=false;
Series3.data.values=[9.34846513378554,5.705295072804015,10.697416915560254,3.8480405750688846,11.591726434551433,9.728859719168792,1.8131468969486213,2.423217710941529,0.7852049700313479,0.3785440475087434,11.111580353767822,2.2951156177060894,2.7255197890305425,5.727988143044055,8.904809783286836,7.525374003765464,4.898394080552196,0.7033589806421761,5.958256563234704,10.278307738182525];
Series3.pointer.format.gradient.visible=false;
Series3.pointer.style="rectangle";
Series3.pointer.width=8;
Series3.pointer.height=8;
Series3.pointer.format.shadow.visible=false
Series3.dateFormat="d";
Series3.marks.visible=false;
Series3.marks.format.round.x=0;
Series3.marks.format.round.y=0;
Series3.marks.format.font.style="12px Verdana";
Series3.marks.format.font.fill="#000000";
Series3.marks.format.font.shadow.color="#A9A9A9";
Series3.marks.format.font.shadow.width=1;
Series3.marks.format.font.shadow.height=1;
Series3.marks.format.font.shadow.visible=false;
Series3.marks.format.font.shadow.blur=0;
Series3.marks.format.fill="#FFFFFF";
Series3.marks.format.gradient.colors = ["#FFD700", "#FFFFFF"];
Series3.marks.format.gradient.direction = "topbottom";
Series3.marks.format.gradient.visible = false;
Series3.marks.format.stroke.fill="#E67240";
Series3.marks.format.stroke.cap="butt";
Series3.marks.format.shadow.visible=false;
Series3.marks.arrow.visible=false;
Series3.marks.arrow.length=0;
Series3.vertAxis=axis1;
var Series4=dynoTeeChart.addSeries(new Tee.PointXY());
Series4.visible=false;
Series4.title="points4";
Series4.format.fill="#81CADB";
Series4.format.stroke.cap="butt";
Series4.format.shadow.visible=false;
Series4.colorEach="no";
Series4.hover.enabled=false;
Series4.data.values=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
Series4.data.x=[0,50,100,150,200,250,300,350,400,450,500,550,600,650,700,750,800,850,900,950];
Series4.pointer.format.gradient.visible=false;
Series4.pointer.style="rectangle";
Series4.pointer.width=8;
Series4.pointer.height=8;
Series4.pointer.format.shadow.visible=false
Series4.dateFormat="d";
Series4.marks.visible=false;
Series4.marks.format.round.x=0;
Series4.marks.format.round.y=0;
Series4.marks.format.font.style="12px Verdana";
Series4.marks.format.font.fill="#000000";
Series4.marks.format.font.shadow.color="#A9A9A9";
Series4.marks.format.font.shadow.width=1;
Series4.marks.format.font.shadow.height=1;
Series4.marks.format.font.shadow.visible=false;
Series4.marks.format.font.shadow.blur=0;
Series4.marks.format.fill="#FFFFFF";
Series4.marks.format.gradient.colors = ["#FFD700", "#FFFFFF"];
Series4.marks.format.gradient.direction = "topbottom";
Series4.marks.format.gradient.visible = false;
Series4.marks.format.stroke.fill="#74B6C5";
Series4.marks.format.stroke.cap="butt";
Series4.marks.format.shadow.visible=false;
Series4.marks.arrow.visible=false;
Series4.marks.arrow.length=0;
Series4.vertAxis=axis1;
dynoTeeChart.legend.position="right";
dynoTeeChart.legend.legendStyle="series";
dynoTeeChart.legend.format.round.x=0;
dynoTeeChart.legend.format.round.y=0;
dynoTeeChart.legend.format.font.style="13px Verdana";
dynoTeeChart.legend.format.font.fill="#404040";
dynoTeeChart.legend.format.font.shadow.color="#A9A9A9";
dynoTeeChart.legend.format.font.shadow.width=1;
dynoTeeChart.legend.format.font.shadow.height=1;
dynoTeeChart.legend.format.font.shadow.visible=false;
dynoTeeChart.legend.format.font.shadow.blur=0;
dynoTeeChart.legend.format.fill="";
dynoTeeChart.legend.format.stroke.fill="";
dynoTeeChart.legend.format.gradient.colors = ["#FFD700", "#FFFFFF"];
dynoTeeChart.legend.format.gradient.direction = "topbottom";
dynoTeeChart.legend.format.gradient.visible = false;
dynoTeeChart.legend.format.stroke.fill="";
dynoTeeChart.legend.format.stroke.cap="butt";
dynoTeeChart.legend.format.shadow.visible=false;
dynoTeeChart.legend.transparent=true;
dynoTeeChart.legend.symbol.format.stroke.fill="#00000000";
dynoTeeChart.legend.symbol.format.stroke.cap="butt";
dynoTeeChart.legend.symbol.format.shadow.color="#A9A9A9";
dynoTeeChart.legend.symbol.format.shadow.width=0;
dynoTeeChart.legend.symbol.format.shadow.height=0;
dynoTeeChart.legend.symbol.format.shadow.visible=false;
dynoTeeChart.legend.symbol.format.shadow.blur=0;
dynoTeeChart.axes.bottom.labels.format.font.fill = "rgba(0,0,0,0.6)";
dynoTeeChart.axes.bottom.labels.format.font.setSize("10px");
dynoTeeChart.series.items[0].marks.transparent = true;
chartFeatures(dynoTeeChart);
resizeC(dynoTeeChart);
const myFormat = new Tee.Format(dynoTeeChart);
myFormat.fill='lime';
myFormat.transparency=0.2;
let axisX1, axisY1, axisX2, axisY2, vertAxis;
dynoTeeChart.ondraw = function()
{
axisX1 = dynoTeeChart.axes.bottom.calc(0);
axisY1 = dynoTeeChart.axes.left.calc(1.0007928867830755);
axisX2 = dynoTeeChart.axes.bottom.calc(16);
axisY2 = dynoTeeChart.axes.left.calc(62);
myFormat.rectangle(axisX1-(16/2),axisY1-(62/2),16,62);
axisX1 = dynoTeeChart.axes.bottom.calc(893.2457182573048);
axisY1 = dynoTeeChart.axes.left.calc(5.09095980594684);
axisX2 = dynoTeeChart.axes.bottom.calc(33);
axisY2 = dynoTeeChart.axes.left.calc(55);
myFormat.rectangle(axisX1-(33/2),axisY1-(55/2),33,55);
axisX1 = dynoTeeChart.axes.bottom.calc(552.0158581390341);
axisY1 = dynoTeeChart.axes.left.calc(0.3233929793485668);
axisX2 = dynoTeeChart.axes.bottom.calc(48);
axisY2 = dynoTeeChart.axes.left.calc(90);
myFormat.rectangle(axisX1-(48/2),axisY1-(90/2),48,90);
axisX1 = dynoTeeChart.axes.bottom.calc(44.99631612292043);
axisY1 = dynoTeeChart.axes.left.calc(8.991546865987512);
axisX2 = dynoTeeChart.axes.bottom.calc(48);
axisY2 = dynoTeeChart.axes.left.calc(82);
myFormat.rectangle(axisX1-(48/2),axisY1-(82/2),48,82);
axisX1 = dynoTeeChart.axes.bottom.calc(561.3558141411736);
axisY1 = dynoTeeChart.axes.left.calc(8.406538656752122);
axisX2 = dynoTeeChart.axes.bottom.calc(38);
axisY2 = dynoTeeChart.axes.left.calc(91);
myFormat.rectangle(axisX1-(38/2),axisY1-(91/2),38,91);
axisX1 = dynoTeeChart.axes.bottom.calc(669.8950982788415);
axisY1 = dynoTeeChart.axes.left.calc(7.848772044361571);
axisX2 = dynoTeeChart.axes.bottom.calc(30);
axisY2 = dynoTeeChart.axes.left.calc(20);
myFormat.rectangle(axisX1-(30/2),axisY1-(20/2),30,20);
axisX1 = dynoTeeChart.axes.bottom.calc(317.2411646119212);
axisY1 = dynoTeeChart.axes.left.calc(6.195099755469368);
axisX2 = dynoTeeChart.axes.bottom.calc(22);
axisY2 = dynoTeeChart.axes.left.calc(16);
myFormat.rectangle(axisX1-(22/2),axisY1-(16/2),22,16);
axisX1 = dynoTeeChart.axes.bottom.calc(871.7600268280412);
axisY1 = dynoTeeChart.axes.left.calc(2.470215724838154);
axisX2 = dynoTeeChart.axes.bottom.calc(12);
axisY2 = dynoTeeChart.axes.left.calc(47);
myFormat.rectangle(axisX1-(12/2),axisY1-(47/2),12,47);
axisX1 = dynoTeeChart.axes.bottom.calc(591.8532106131445);
axisY1 = dynoTeeChart.axes.left.calc(5.889326610739117);
axisX2 = dynoTeeChart.axes.bottom.calc(26);
axisY2 = dynoTeeChart.axes.left.calc(29);
myFormat.rectangle(axisX1-(26/2),axisY1-(29/2),26,29);
axisX1 = dynoTeeChart.axes.bottom.calc(396.8103641151822);
axisY1 = dynoTeeChart.axes.left.calc(11.76066005522772);
axisX2 = dynoTeeChart.axes.bottom.calc(18);
axisY2 = dynoTeeChart.axes.left.calc(14);
myFormat.rectangle(axisX1-(18/2),axisY1-(14/2),18,14);
axisX1 = dynoTeeChart.axes.bottom.calc(676.9772074452405);
axisY1 = dynoTeeChart.axes.left.calc(7.625285168066473);
axisX2 = dynoTeeChart.axes.bottom.calc(34);
axisY2 = dynoTeeChart.axes.left.calc(95);
myFormat.rectangle(axisX1-(34/2),axisY1-(95/2),34,95);
axisX1 = dynoTeeChart.axes.bottom.calc(660.9123959515119);
axisY1 = dynoTeeChart.axes.left.calc(2.635777544192528);
axisX2 = dynoTeeChart.axes.bottom.calc(10);
axisY2 = dynoTeeChart.axes.left.calc(19);
myFormat.rectangle(axisX1-(10/2),axisY1-(19/2),10,19);
axisX1 = dynoTeeChart.axes.bottom.calc(328.39571454787506);
axisY1 = dynoTeeChart.axes.left.calc(7.160955813741605);
axisX2 = dynoTeeChart.axes.bottom.calc(47);
axisY2 = dynoTeeChart.axes.left.calc(96);
myFormat.rectangle(axisX1-(47/2),axisY1-(96/2),47,96);
axisX1 = dynoTeeChart.axes.bottom.calc(845.9016046056041);
axisY1 = dynoTeeChart.axes.left.calc(10.316956390432349);
axisX2 = dynoTeeChart.axes.bottom.calc(3);
axisY2 = dynoTeeChart.axes.left.calc(50);
myFormat.rectangle(axisX1-(3/2),axisY1-(50/2),3,50);
axisX1 = dynoTeeChart.axes.bottom.calc(930.434172213013);
axisY1 = dynoTeeChart.axes.left.calc(9.2154334344742);
axisX2 = dynoTeeChart.axes.bottom.calc(9);
axisY2 = dynoTeeChart.axes.left.calc(17);
myFormat.rectangle(axisX1-(9/2),axisY1-(17/2),9,17);
axisX1 = dynoTeeChart.axes.bottom.calc(323.3827796396561);
axisY1 = dynoTeeChart.axes.left.calc(6.25269777465043);
axisX2 = dynoTeeChart.axes.bottom.calc(26);
axisY2 = dynoTeeChart.axes.left.calc(93);
myFormat.rectangle(axisX1-(26/2),axisY1-(93/2),26,93);
axisX1 = dynoTeeChart.axes.bottom.calc(712.7021339775562);
axisY1 = dynoTeeChart.axes.left.calc(1.719453664796112);
axisX2 = dynoTeeChart.axes.bottom.calc(32);
axisY2 = dynoTeeChart.axes.left.calc(95);
myFormat.rectangle(axisX1-(32/2),axisY1-(95/2),32,95);
axisX1 = dynoTeeChart.axes.bottom.calc(920.3844694143121);
axisY1 = dynoTeeChart.axes.left.calc(0.38376268976601935);
axisX2 = dynoTeeChart.axes.bottom.calc(48);
axisY2 = dynoTeeChart.axes.left.calc(11);
myFormat.rectangle(axisX1-(48/2),axisY1-(11/2),48,11);
axisX1 = dynoTeeChart.axes.bottom.calc(367.89096587426275);
axisY1 = dynoTeeChart.axes.left.calc(8.831074576833824);
axisX2 = dynoTeeChart.axes.bottom.calc(37);
axisY2 = dynoTeeChart.axes.left.calc(32);
myFormat.rectangle(axisX1-(37/2),axisY1-(32/2),37,32);
axisX1 = dynoTeeChart.axes.bottom.calc(94.80184135303004);
axisY1 = dynoTeeChart.axes.left.calc(2.142060697407624);
axisX2 = dynoTeeChart.axes.bottom.calc(12);
axisY2 = dynoTeeChart.axes.left.calc(87);
myFormat.rectangle(axisX1-(12/2),axisY1-(87/2),12,87);
axisX1 = dynoTeeChart.axes.bottom.calc(117.77314340544054);
axisY1 = dynoTeeChart.axes.left.calc(6.635003994450328);
axisX2 = dynoTeeChart.axes.bottom.calc(35);
axisY2 = dynoTeeChart.axes.left.calc(15);
myFormat.rectangle(axisX1-(35/2),axisY1-(15/2),35,15);
axisX1 = dynoTeeChart.axes.bottom.calc(641.1678651717632);
axisY1 = dynoTeeChart.axes.left.calc(10.561246032657225);
axisX2 = dynoTeeChart.axes.bottom.calc(42);
axisY2 = dynoTeeChart.axes.left.calc(53);
myFormat.rectangle(axisX1-(42/2),axisY1-(53/2),42,53);
axisX1 = dynoTeeChart.axes.bottom.calc(570.5001158145282);
axisY1 = dynoTeeChart.axes.left.calc(4.1417271150369706);
axisX2 = dynoTeeChart.axes.bottom.calc(1);
axisY2 = dynoTeeChart.axes.left.calc(12);
myFormat.rectangle(axisX1-(1/2),axisY1-(12/2),1,12);
axisX1 = dynoTeeChart.axes.bottom.calc(454.6752348191526);
axisY1 = dynoTeeChart.axes.left.calc(10.643084622833513);
axisX2 = dynoTeeChart.axes.bottom.calc(21);
axisY2 = dynoTeeChart.axes.left.calc(41);
myFormat.rectangle(axisX1-(21/2),axisY1-(41/2),21,41);
axisX1 = dynoTeeChart.axes.bottom.calc(210.04994414903376);
axisY1 = dynoTeeChart.axes.left.calc(2.6746995747409845);
axisX2 = dynoTeeChart.axes.bottom.calc(19);
axisY2 = dynoTeeChart.axes.left.calc(97);
myFormat.rectangle(axisX1-(19/2),axisY1-(97/2),19,97);
const mySites = new Tee.Format(dynoTeeChart);
mySites.stroke.cap='round';
mySites.transparency=0.7;
let stripX1, stripY1, stripX2, stripY2;
mySites.fill='orange';
stripX1 = dynoTeeChart.axes.bottom.startPos;
stripY1 = dynoTeeChart.axes.left.startPos;
stripX2 = dynoTeeChart.axes.bottom.calc(300);
stripY2 = dynoTeeChart.axes.left.endPos;
mySites.rectangle(stripX1, stripY2 - (stripY2-stripY1)/2, stripX2-stripX1, (stripY2-stripY1)/2);
mySites.fill='green';
stripX1 = dynoTeeChart.axes.bottom.startPos;
stripY1 = dynoTeeChart.axes.left.calc(6);
stripX2 = dynoTeeChart.axes.bottom.calc(250);
stripY2 = dynoTeeChart.axes.left.calc(12);
mySites.rectangle(stripX1, stripY1, stripX2-stripX1, stripY1-stripY2);
mySites.fill='blue';
stripX1 = dynoTeeChart.axes.bottom.calc(250);
stripY1 = dynoTeeChart.axes.left.calc(6);
stripX2 = dynoTeeChart.axes.bottom.calc(500);
stripY2 = dynoTeeChart.axes.left.calc(12);
mySites.rectangle(stripX1, stripY1, stripX2-stripX1, stripY1-stripY2);
mySites.fill='green';
stripX1 = dynoTeeChart.axes.bottom.calc(500);
stripY1 = dynoTeeChart.axes.left.calc(6);
stripX2 = dynoTeeChart.axes.bottom.calc(1000);
stripY2 = dynoTeeChart.axes.left.calc(12);
mySites.rectangle(stripX1, stripY1, stripX2-stripX1, stripY1-stripY2);
mySites.fill='orange';
stripX1 = dynoTeeChart.axes.bottom.calc(600);
stripY1 = dynoTeeChart.axes.left.startPos;
stripX2 = dynoTeeChart.axes.bottom.calc(1000);
stripY2 = dynoTeeChart.axes.left.endPos;
mySites.rectangle(stripX1, stripY2 - (stripY2-stripY1)/2, stripX2-stripX1, (stripY2-stripY1)/2);
const ctx = dynoTeeChart.ctx;
let x1;
x1 = dynoTeeChart.axes.bottom.calc(0);
x2 = dynoTeeChart.axes.bottom.calc(50);
y1 = dynoTeeChart.axes.left.calc(9.34846513378554);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(50);
x2 = dynoTeeChart.axes.bottom.calc(100);
y1 = dynoTeeChart.axes.left.calc(5.705295072804015);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(100);
x2 = dynoTeeChart.axes.bottom.calc(150);
y1 = dynoTeeChart.axes.left.calc(10.697416915560254);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(150);
x2 = dynoTeeChart.axes.bottom.calc(200);
y1 = dynoTeeChart.axes.left.calc(3.8480405750688846);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(200);
x2 = dynoTeeChart.axes.bottom.calc(250);
y1 = dynoTeeChart.axes.left.calc(11.591726434551433);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(250);
x2 = dynoTeeChart.axes.bottom.calc(300);
y1 = dynoTeeChart.axes.left.calc(9.728859719168792);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(300);
x2 = dynoTeeChart.axes.bottom.calc(350);
y1 = dynoTeeChart.axes.left.calc(1.8131468969486213);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(350);
x2 = dynoTeeChart.axes.bottom.calc(400);
y1 = dynoTeeChart.axes.left.calc(2.423217710941529);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(400);
x2 = dynoTeeChart.axes.bottom.calc(450);
y1 = dynoTeeChart.axes.left.calc(0.7852049700313479);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(450);
x2 = dynoTeeChart.axes.bottom.calc(500);
y1 = dynoTeeChart.axes.left.calc(0.3785440475087434);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(500);
x2 = dynoTeeChart.axes.bottom.calc(550);
y1 = dynoTeeChart.axes.left.calc(11.111580353767822);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(550);
x2 = dynoTeeChart.axes.bottom.calc(600);
y1 = dynoTeeChart.axes.left.calc(2.2951156177060894);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(600);
x2 = dynoTeeChart.axes.bottom.calc(650);
y1 = dynoTeeChart.axes.left.calc(2.7255197890305425);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(650);
x2 = dynoTeeChart.axes.bottom.calc(700);
y1 = dynoTeeChart.axes.left.calc(5.727988143044055);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(700);
x2 = dynoTeeChart.axes.bottom.calc(750);
y1 = dynoTeeChart.axes.left.calc(8.904809783286836);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(750);
x2 = dynoTeeChart.axes.bottom.calc(800);
y1 = dynoTeeChart.axes.left.calc(7.525374003765464);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(800);
x2 = dynoTeeChart.axes.bottom.calc(850);
y1 = dynoTeeChart.axes.left.calc(4.898394080552196);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(850);
x2 = dynoTeeChart.axes.bottom.calc(900);
y1 = dynoTeeChart.axes.left.calc(0.7033589806421761);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(900);
x2 = dynoTeeChart.axes.bottom.calc(950);
y1 = dynoTeeChart.axes.left.calc(5.958256563234704);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(950);
x2 = dynoTeeChart.axes.bottom.calc(1000);
y1 = dynoTeeChart.axes.left.calc(10.278307738182525);
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y1);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'red';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(0);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(50);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(100);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(150);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(200);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(250);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(300);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(350);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(400);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(450);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(500);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(550);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(600);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(650);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(700);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(750);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(800);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(850);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(900);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
x1 = dynoTeeChart.axes.bottom.calc(950);
y1 = dynoTeeChart.axes.left.startPos;
y2 = dynoTeeChart.axes.left.endPos;
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x1, y2);
ctx.closePath();
ctx.lineWidth = 1;
ctx.strokeStyle = 'black';
ctx.stroke();
dynoTeeChart.onzoom = function()
{
console.log('zoom function triggered.')
DotNet.invokeMethodAsync('TeeChartOnBlazor', 'ReturnArrayAsync')
.then(result =>
{
console.log(result)
});
}
dynoTeeChart.afterdraw = function()
{
console.log('draw function triggered.')
DotNet.invokeMethodAsync('TeeChartOnBlazor', 'ReturnArrayAsync')
.then(result =>
{
console.log(result)
});
}
}
dynoTeeChart.isNLc = true;
dynoTeeChart.draw();
</script>

=======

When I navigate to the chart page nothing is displaying and I am not getting any console errors. Any help would be appreciated.

Thanks
Top
Post Reply

Return to “.NET”