import * as echarts from "echarts";//引用echarts
import { onMounted } from "vue";//引入方法onMounted
import * as service from "./request/request";//接口方法
onMounted(async () => {//一进来就调用一遍这个方法
temData();
});
const temData = async () => {
//年月日
let data = {
startingTime: SearchFrom.value.startingTime,
endTime: SearchFrom.value.endTime,
unit: SearchFrom.value.unit,
status: tab.value,
};
const res = await service.ljfsWeight(data);
xdata.value = res.data.time;
y1data.value = res.data.grossWeight; //毛重
y2data.value = res.data.tare; //皮重
y3data.value = res.data.netWeight; //净重
let xdaaaata = [45, 45, 45, 0, 80, 78, 14, 7, 19, 23, 15, 10];
var chartDom = document.getElementById("main");
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: "axis",
confine: true,
axisPointer: { type: "none" },
textStyle: { fontSize: 12, fontWeight: 500 },
formatter(params) {
// 只展示柱子对应的内容,把顶部底部的 tooltip 过滤掉
return params.reduce((pre, i) => {
if (i.componentSubType === "bar") {
i.marker = i.marker.replace(/[object Object]/, i.color.colorStops[1].color);
i.value = `<span style="flex: 1;
Echarts柱状图3d立体效果
于 2022-06-27 14:08:06 首次发布