I am creating a scatter chart widget with One series data. On top of the graph I need to create a rectangle box with Curved Upper and Lower Side.
I am able to create rectangle box using trend line but unable to curved two sides.
Code: Select all
annotations: [{
shapes: [{
type: 'path',
width: 50,
points: ['A', 'B', 'D', 'C', 'A'],
fill: "none",
dashStyle: 'Solid',
r: 100,
}]
}],
this.NTPvalueChartOptions2.series.push({
name: 'NA/PO4',
// To make this series hidden and unaccessible for user.
type: 'scatter',
marker: {
enabled: false
},
showInLegend: false,
//
/*data:tempArrayNapo4*/
data: [{
x: 16.25,
y: 10.0,
id: 'A'
}, {
x: 18,
y: 10.1,
id: 'B'
}, {
x:16.25,
y: 9.60,
id: 'C'
}, {
x: 18,
y: 9.8,
id: 'D'
}]
});
I have four x,y cordinates and with use of these points I have created this box. Please find screenshot below: