默认状态

鼠标移入

// const xData = [
        "1",
        "2",
        "3",
        "4",
        "5",
        "6",
        "7",
        "8",
        "100",
        "10",
        "11",
        "12",

        "13",
        "14",
        "15",
        "16",
        "17",
        "18",
      ];
//var maxNum = Math.max.apply(null, xData);
option = {
series: [
              {
                name: "Calls",
                type: "bar",
                data: [
				        111112, 858565, 88285, 2255, 57575, 758655, 14574, 85685, 58587,
				        56565656, 444444, 158585, 2255, 57575, 758655, 14574, 85685, 58587,
				      ],
                itemStyle: {
                  color: "rgba(74, 181, 232, 1)",
                },
              },
              {
                name: "Puts",
                type: "bar",
                data: [
				        111112, 858565, 88285, 2255, 111112, 858565, 88285, 2255, 57575, 758655,
				        57575, 758655, 858565, 88285, 2255, 57575, 758655, 57575,
				      ],
                itemStyle: {
                  color: "rgba(234, 204, 174, 1)",
                },
              },
              {
                name: "Total Intrinsic Value",
                type: "line",
                yAxisIndex: 1,
                data: cyData,
                //标记x轴最大值
                markLine: {
                  symbol: [],
                  symbolSize: [14, 17],
                  label: {
                    show: true,
                    padding: [0, 0, 5, 0],
                    formatter() {
                      return `Max Strike Price：${maxNum}`;
                    },
                  },
                  data: [{ xAxis: maxNum.toString() }],
                  lineStyle: {
                    width: 1,
                    color: "#979797",
                  },
                },
                symbol: "circle", //将小圆点改成实心 不写symbol默认空心
                symbolSize: 8, //小圆点
                lineStyle: {
                  normal: {
                    color: " ",
                    width: 0,
                  },
                  //hover状态,显示折线，设置颜色跟线宽
                  emphasis:{
                    color: "rgba(0, 102, 210, 1)",
                    width: 1.5,
                  }
                },
                itemStyle: {
                  color: "rgba(0, 102, 210, 1)",
                },
              },
            ],
}

核心代码

		emphasis:{
					//里面也可以配置拐点边框、背景颜色.....
                    color: "rgba(0, 102, 210, 1)",
                    width: 1.5,
                  }