|
|
@@ -128,7 +128,7 @@ const initChart = (data: any) => {
|
|
|
// const xData = data.x;
|
|
|
const yData = data.msv;
|
|
|
const liqsData = data.liqs;
|
|
|
- const spreadsData = data.spreads;
|
|
|
+ // const spreadsData = data.spreads;
|
|
|
const chartOption = {
|
|
|
title: {
|
|
|
text: `${pageParams.exchange} ${pageParams.symbol?.toUpperCase()} ${parseFloat(((Number(pageParams.minute_time_range) || 240) / 60).toFixed(2)).toString()}小时波动率指标`,
|
|
|
@@ -138,31 +138,31 @@ const initChart = (data: any) => {
|
|
|
top: "80px",
|
|
|
left: "60px",
|
|
|
right: "60px",
|
|
|
- height: "30%", // 主图高度
|
|
|
+ height: "45%", // 主图高度
|
|
|
backgroundColor: "red",
|
|
|
},
|
|
|
- {
|
|
|
- left: "60px",
|
|
|
- right: "60px",
|
|
|
- bottom: "220px",
|
|
|
- height: "15%", // 副图高度
|
|
|
- },
|
|
|
{
|
|
|
left: "60px",
|
|
|
right: "60px",
|
|
|
bottom: "80px",
|
|
|
- height: "15%", // 副图高度
|
|
|
+ height: "20%", // 副图高度
|
|
|
},
|
|
|
+ // {
|
|
|
+ // left: "60px",
|
|
|
+ // right: "60px",
|
|
|
+ // bottom: "80px",
|
|
|
+ // height: "15%", // 副图高度
|
|
|
+ // },
|
|
|
],
|
|
|
dataZoom: [
|
|
|
{
|
|
|
type: "inside",
|
|
|
- xAxisIndex: [0, 1, 2],
|
|
|
+ xAxisIndex: [0, 1],
|
|
|
start: 0,
|
|
|
end: 100,
|
|
|
},
|
|
|
{
|
|
|
- xAxisIndex: [0, 1, 2],
|
|
|
+ xAxisIndex: [0, 1],
|
|
|
start: 0,
|
|
|
end: 100,
|
|
|
},
|
|
|
@@ -188,11 +188,12 @@ const initChart = (data: any) => {
|
|
|
result = `时间:${time}<br/>波动率:${volatilities}%<br/>强度:${dissociation} USDT<br/>`;
|
|
|
} else if (param.seriesIndex == 1) {
|
|
|
// 副图的 tooltip
|
|
|
- result = `时间:${time}<br/>挂单总量:${param.value[1]}<br/>`;
|
|
|
- } else if (param.seriesIndex == 2) {
|
|
|
- // 副图的 tooltip
|
|
|
- result = `时间:${time}<br/>价差:${param.value[1]}<br/>`;
|
|
|
+ result = `时间:${time}<br/>挂单总量:${param.value[1]}K<br/>`;
|
|
|
}
|
|
|
+ // else if (param.seriesIndex == 2) {
|
|
|
+ // // 副图的 tooltip
|
|
|
+ // result = `时间:${time}<br/>价差:${param.value[1]}<br/>`;
|
|
|
+ // }
|
|
|
});
|
|
|
|
|
|
return result;
|
|
|
@@ -219,16 +220,16 @@ const initChart = (data: any) => {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
- {
|
|
|
- gridIndex: 2, // 第二个网格的 y 轴
|
|
|
- type: "category",
|
|
|
- show: true,
|
|
|
- axisLabel: {
|
|
|
- formatter: (value: any) => {
|
|
|
- return dayjs(value * 1).format("MM-DD HH:mm:ss");
|
|
|
- },
|
|
|
- },
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // gridIndex: 2, // 第二个网格的 y 轴
|
|
|
+ // type: "category",
|
|
|
+ // show: true,
|
|
|
+ // axisLabel: {
|
|
|
+ // formatter: (value: any) => {
|
|
|
+ // return dayjs(value * 1).format("MM-DD HH:mm:ss");
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ // },
|
|
|
],
|
|
|
yAxis: [
|
|
|
{
|
|
|
@@ -238,17 +239,17 @@ const initChart = (data: any) => {
|
|
|
gridIndex: 1,
|
|
|
type: "value",
|
|
|
position: "left",
|
|
|
- splitLine: {
|
|
|
- show: false,
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- formatter: () => "",
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- gridIndex: 2,
|
|
|
- type: "value",
|
|
|
+ // splitLine: {
|
|
|
+ // show: false,
|
|
|
+ // },
|
|
|
+ // axisLabel: {
|
|
|
+ // formatter: () => "",
|
|
|
+ // },
|
|
|
},
|
|
|
+ // {
|
|
|
+ // gridIndex: 2,
|
|
|
+ // type: "value",
|
|
|
+ // },
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
@@ -281,16 +282,16 @@ const initChart = (data: any) => {
|
|
|
},
|
|
|
data: liqsData,
|
|
|
},
|
|
|
- {
|
|
|
- type: "line",
|
|
|
- sampling: "lttb",
|
|
|
- xAxisIndex: 2,
|
|
|
- yAxisIndex: 2,
|
|
|
- itemStyle: {
|
|
|
- color: "rgb(55, 162, 255)",
|
|
|
- },
|
|
|
- data: spreadsData,
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // type: "line",
|
|
|
+ // sampling: "lttb",
|
|
|
+ // xAxisIndex: 2,
|
|
|
+ // yAxisIndex: 2,
|
|
|
+ // itemStyle: {
|
|
|
+ // color: "rgb(55, 162, 255)",
|
|
|
+ // },
|
|
|
+ // data: spreadsData,
|
|
|
+ // },
|
|
|
],
|
|
|
};
|
|
|
msvChart.value.setOption(chartOption);
|