MY JSON:
Code: Select all
"values": {
"2021-02-07T02:02:00.000Z": [
{
"min": 2256.11,
"max": 2256.11
}
],
"2021-02-07T06:17:00.000Z": [
{
"min": 2288.07,
"max": 2288.07
}
],
"2021-02-07T10:32:00.000Z": [
{
"min": 2300.65,
"max": 2300.65
}
Code: Select all
[
1167609600000,
0.7537
],
[
1167696000000,
0.7537
],
[
1167782400000,
0.7559
],
[
1167868800000,
0.7631
],
Code: Select all
import { Component } from "@angular/core";
import * as Highcharts from "highcharts/highstock";
import { Options } from "highcharts/highstock";
// For demonstration purposes only.
import random from "highcharts-random";
@Component({
selector: "my-app",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"]
})
export class AppComponent {
Highcharts: typeof Highcharts = Highcharts;
chartOptions: Options = {
plotOptions: {
series: {
dataGrouping: {
//enabled: false,
forced: true,
units: [["day", [1]]]
}
}
},
xAxis: {
type: 'datetime',[code]
yAxis: {
gridLineWidth: 1,
title: {
text: "RO",
//textAlign : 'center',
style: { color: "purple", fontSize: "15px" }
},
plotLines: [
{
value: 3.5,
color: "red",
width: 1.5,
label: {
text: "LL"
}
},
{
value: 4,
color: "orange",
width: 1.5,
label: {
text: "L"
}
},
{
value: 5.7,
color: "red",
width: 1.5,
label: {
text: "HH"
}
},
{
value: 5,
color: "orange",
width: 1.5,
label: {
text: "H"
}
}
]
},
series: [
{
type: "line",
pointStart: Date.UTC(2010, 0, 1),
pointInterval: 24 *3600 * 1000,
data: random.data(5000)
}
]
};
}[/code]