const colors = ["#5470C6", "#91CC75", "#EE6666"];
export const option = {
  color: colors,
  tooltip: {
    trigger: "axis",
    axisPointer: {
      type: "cross",
    },
  },
  title: {
    text: "Dynamic Data",
  },

  grid: {
    top: "20%",
    right: "20%",
    bottom: "10%",
    containLabel: true, // 包含标签在内
  },
  toolbox: {
    feature: {
      dataView: { show: true, readOnly: false },
      restore: { show: true },
      saveAsImage: { show: true },
    },
  },
  toolbox: {
    feature: {
      dataView: { show: true, readOnly: false },
      magicType: { show: true, type: ["line", "bar"] },
      restore: { show: true },
      saveAsImage: { show: true },
    },
  },
  legend: {
    top: "bottom",
  },
  xAxis:
    // [
    {
      type: "category",
      axisTick: {
        alignWithLabel: true,
      },
      data: [
        "Jan",
        "Feb",
        "Mar",
        "Apr",
        "May",
        "Jun",
        "Jul",
        "Aug",
        "Sep",
        "Oct",
        "Nov",
        "Dec",
      ],
    },
  // ],
  yAxis: {
    type: "value",
    name: "温度",
    position: "left",
    alignTicks: true,
    axisLine: {
      show: true,
      lineStyle: {
        color: colors[2],
      },
    },
    axisLabel: {
      formatter: "{value} °C",
    },
  },
  series: [
    {
      name: "Evaporation",
      type: "bar",
      data: [
        2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3,
      ],
    },
    {
      name: "Precipitation",
      type: "bar",
      data: [
        2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3,
      ],
    },
    {
      name: "Temperature",
      type: "line",
      data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
    },
  ],
};