数据视图点开全屏了,怎么让他和图表在一个地方(默认不是在一个地方的吗)
自适应——
initEcharts1() {
let myCharts = document.getElementById("bottomRightChart");
myCharts.style.width = 58 + "rem";
myCharts.style.height = 21.5 + "rem";
this.myCharts = this.$echarts.init(myCharts);
this.myCharts.setOption(this.options);
this.myCharts.resize();
let self = this;
window.addEventListener("resize", () => { // 通过resize方法来重设图表宽度850/320
let myCharts = document.getElementById("bottomRightChart");
myCharts.style.width = 58 + "rem";
myCharts.style.height = 21.5 + "rem";
self.myCharts.resize();
});
},
数据视图——
optionToContent: function(opt) {
var angleAxisData = opt.angleAxis[0].data;
console.log(angleAxisData[0].value)
var seriesData = opt.series;
var table =
'<div class="tableweb" style="width:1300px;height:301px"><table style="width:95%;height:100%;text-align:center;margin-left:0px;"><tbody><tr>' +
'<td style="width:20px;">风向</td>' +
'<td style="width:20px;">' + seriesData[0].name + '</td>' +
'<td style="width:20px;">' + seriesData[1].name + '</td>' +
'<td style="width:20px;">' + seriesData[2].name + '</td>' +
'<td style="width:20px;">' + seriesData[3].name + '</td>' +
'<td style="width:20px;">' + seriesData[4].name + '</td>' +
'<td style="width:20px;">' + seriesData[5].name + '</td>' +
'<td style="width:20px;">' + seriesData[6].name + '</td>' +
'<td style="width:20px;">' + seriesData[7].name + '</td>' +
'<td style="width:20px;">' + seriesData[8].name + '</td>' +
'<td style="width:20px;">' + seriesData[9].name + '</td>' +
'<td style="width:20px;">' + seriesData[10].name + '</td>' +
// '<td style="width:150px;height:50px">风速1</td>' +
'</tr>';
for (var i = 0, l = angleAxisData.length; i < l; i++) {
table += '<tr>' +
'<td style="width:30px;">' + angleAxisData[i].value + '</td>' +
'<td style="width:30px;">' + seriesData[0].data[i] + '</td>' +
'<td style="width:30px">' + seriesData[1].data[i] + '</td>' +
'<td style="width:30px">' + seriesData[2].data[i] + '</td>' +
'<td style="width:30px">' + seriesData[3].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[4].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[5].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[6].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[7].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[8].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[9].data[i] + '</td>' +
'<td style="width:20px">' + seriesData[10].data[i] + '</td>' +
'</tr>'
}
table += '</tbody></table></div>';
return table;
},