the line chart does not show the x-axis on ios, but it can be plotted on Android. Why is there no x-axis? Use echarts
var optionFH = {
axisLine: {
show: false
},
//
splitLine: {
show: true,
},
// y
axisTick: {
show: false
},
tooltip: {
trigger: "axis",
// formatter:function(params){
// console.log(params)
// }
},
color: ["-sharp02aac2", "-sharpf19f00"], //
legend: {
orient: "horizontal",
right: 25,
top: 20,//
data: ["..."],
itemWidth: 22, //
itemHeight: 15,
background: "-sharp149f79",
textStyle:{
color:["-sharp02aac2","-sharpf19f00"],//
fontSize:13,//
}
},
calculable: true,
xAxis: {
type: "category",
boundaryGap: false,
splitLine: { //x
show: true,
lineStyle: {
color: "-sharp35363B",
width: 1
}
},
axisLabel: {
show: true,
interval: "auto",
textStyle: {
color: "white"//
}
//interval: Int //
},
axisLine:{
show: true,
lineStyle: {
color: "white"//x
}
},
axisTick: {
show: false //
},
data: [0]
//data: arrOne_FH
},
grid: { //
x: 50,
top:45,
// x2: 100,
y2: 80,// y2 XZoom labelzoom
},
yAxis: {
type: "value",
splitLine: { //x
show: true,
lineStyle: {
color: "-sharp35363B",//
width: 1
}
},
// name: "(/)",
nameTextStyle: {
fontSize: 15,
color: "-sharpa9a9a9"
},
axisLabel: {
show: true,
interval: "auto",
inside: false,
// rotate: 90,
// margin: 8,
formatter: null,
},
nameLocation: "end", //
// nameRotate:90,
axisLabel: { //
show: true,
textStyle: {
color: "white"//
}
},
axisLine: { //y
show: true,
lineStyle: {
color: "white"//y
}
},
axisTick: {
show: false //
},
},
series: [{
name: "...", //1
type: "line",
symbol: "none", //
yAxisIndex: 0,
data: 0,
connectNulls: true,//null
itemStyle: {
normal: { //
color: function(params) {
var colorList = ["yellow"];
return colorList[params.dataIndex];
}
},
},
itemStyle: { //
normal: {
lineStyle: {
color: "-sharp02aac2"
}
},
},
},
{
name: "...", //1
type: "line",
symbol: "none", //
yAxisIndex: 0,
data: 0,
connectNulls: true,//null
itemStyle: {
normal: { //
color: function(params) {
var colorList = ["yellow"];
return colorList[params.dataIndex];
}
},
},
itemStyle: { //
normal: {
lineStyle: {
color: "-sharpf19f00"
}
},
},
}
]
};
myChart.setOption(optionFH);
this is the
that gets the data. let myData;
//
//
axios.get(`xxxxxxxxx`)
.then(function(response) {
// success
myData = response.data.data;
var maxtime = "0000-00-00 00:00:00";//
var mintime = "0000-00-00 00:00:00";//
let arrall = [];
arrall.push(zhizhizhi);
arrall.push(myData);
console.log(arrall);
for(var i=0;i<arrall.length;iPP){
arrall[i].map(function(item,key){
if (item.RECORD_TIME > maxtime){
maxtime = item.RECORD_TIME;//
}
if (item.RECORD_TIME < maxtime){
mintime = item.RECORD_TIME;
}
})
}
//
let nowDate = new Date();
const year = nowDate.getFullYear();
const month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1):nowDate.getMonth() + 1;
const day = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate();
var minZhi = Date.parse(year+"-"+month+"-"+day+" 00:00:00");
var maxZhi = Date.parse(maxtime);
console.log(year+"-"+month+"-"+day+" 00:00:00");
console.log(maxtime);
var Minute = Number(Math.round((maxZhi - minZhi) / 60 / 1000));//
console.log(Minute);
// interval
var Int = "";
Int = Math.floor(Minute / 6);
var arrOne_FH = [];
var arrOne_FH_val = [];
var arrOne_FH_val_plan = [];
var arrTwo_FH_val = [];
var arrOne_AGC_val = [];
var arrTwo_AGC_val = [];
var arrOne_GRL_val = [];
var arrTwo_GRL_val = [];
//
var loadAll=[]; //
var loadRateAll=[]; //
let hours = 0;
let minutes = 0;
var resv = [];//x
for(var i=0;i<Minute;iPP){
//
loadAll[i]="--";
loadRateAll[i]="--";
//x
if(minutes>=60){
hours+=1;
minutes=0;
}
resv[i]=(hours<10?"0"+hours : hours)+":"+(minutes<10?"0"+minutes : minutes);
minutes+=1;
}
//
for (var i in myData) {
var minute_num=Number(myData[i].RECORD_TIME.slice(11, 13))*60+Number(myData[i].RECORD_TIME.slice(14, 16));
var FHOne_val = (Number(myData[i].ITEM_VALUE)/10).toFixed(2);
loadAll[minute_num]=FHOne_val;
}
//
for (var i in zhizhizhi) {
var minute_num=Number(zhizhizhi[i].RECORD_TIME.slice(11, 13))*60+Number(zhizhizhi[i].RECORD_TIME.slice(14, 16));
var FHOne_val = (Number(zhizhizhi[i].ITEM_VALUE)/10).toFixed(2);
loadRateAll[minute_num]=FHOne_val;
}
optionFH.legend.data = [wenzi];
optionFH.xAxis.axisLabel.interval = Int;
optionFH.xAxis.data = resv;
optionFH.series[0].name = wenzi;
optionFH.series[0].data = loadAll;
if(responseZhi=="SY-FH-01"){
optionFH.legend.data = [wenzi,""];
optionFH.series[1].name = "";
optionFH.series[1].data = loadRateAll;
}
if (optionFH.series[0].data.length == 0) {
optionFH.yAxis.min = "0";
optionFH.yAxis.max = "5";
}
myChart.setOption(optionFH, true);
window.onresize = function () {
//
myChart.resize();
};
})
is normal on computers and normal on Android
iosx
what is this problem? Wait online!
