echarts里面点击折线图的折点能进行跳转（或者有点击）

参考链接：https://blog.csdn.net/flting1017/article/details/79747007

<template>
    <div>
      <!-- 签收率 -->
        <div id="myChart1" :style="{width: '90%',height:'500px',margin:'0 auto'}"></div>
    </div>
</template>

<script>
import echarts from "echarts";
export default {
  props: ["ec1"],
  data() {
    return {

    };
  },
  mounted() {
    this.$emit('echarts1')
    this.init();
  },
  methods: {
    init() {
      var myChart1 = this.$echarts.init(document.getElementById("myChart1")); //获取容器元素
      myChart1.setOption({
        tooltip: {
          formatter: function(params) {
            return (
              params.name +
              "<br/>" +
              "签收率:" +
              params.value +
              "%"
            );
          },
          show: true,
          trigger: "axis",
          textStyle: {
            //---提示框内容样式
            color: "#fff"
          }
        },
        legend: {
          y: "bottom",
          x: "center",
          textStyle: {
            //---提示框内容样式
            color: "#ED781E"
          }
        },
        //-------------  grid区域  ----------------
        grid: {
          show: true, //---是否显示直角坐标系网格
          top: 50,
          bottom: 50,
          left:60,
          right: 35, //---相对位置，top\bottom\left\right
          containLabel: false, //---grid 区域是否包含坐标轴的刻度标签
          tooltip: {
            //---鼠标焦点放在图形上，产生的提示框
            show: true,
            trigger: "item", //---触发类型
            textStyle: {
              color: "#eee"
            }
          }
        },
        xAxis: {
          type: "category",
          boundaryGap: false,
          data: this.ec1.addtimes,
          axisLine: {
            show: true,
            //------------------- 箭头 -------------------------
            symbol: ["none", "arrow"], //---是否显示轴线箭头
            symbolSize: [8, 8], //---箭头大小
            symbolOffset: [0, 7], //---箭头位置
            lineStyle: {
              color: "#000",
              width: 1,
              type: "solid"
            }
          },
          axisTick: {
            //---坐标轴 刻度
            show: true, //---是否显示
            inside: true, //---是否朝内
            lengt: 1, //---长度
            lineStyle: {
              //color:'red',          //---默认取轴线的颜色
              width: 1,
              type: "solid"
            }
          },
          axisLabel: {
            show: true,
            interval:0,//横轴信息全部显示
            rotate: 30,//30度角倾斜显示
            textStyle: {
              color: "#000", //更改坐标轴文字颜色
              fontSize: 12 //更改坐标轴文字大小
            }
          }
        },
        yAxis: {
          name: "签收率(%)", //---轴名称
          min: 0,
          max: 100,
          nameLocation: "end", //---轴名称相对位置value
          nameTextStyle: {
            //---坐标轴名称样式
            color: "#000",
            padding: [5, 0, 0, 5] //---坐标轴名称相对位置
          },
          type: "value",
          axisLine: {
            show: true,
            interval: "auto",
            formatter: "{value}%",
            //------------------- 箭头 -------------------------
            symbol: ["none", "arrow"], //---是否显示轴线箭头
            symbolSize: [8, 8], //---箭头大小
            symbolOffset: [0, 7], //---箭头位置

            lineStyle: {
              color: "#000",
              width: 1,
              type: "solid"
            }
          },
          axisTick: {
            //---坐标轴 刻度
            top: 0,
            show: false, //---是否显示
            inside: true, //---是否朝内
            lengt: 1, //---长度
            lineStyle: {
              //color:'red',          //---默认取轴线的颜色
              width: 1,
              type: "solid"
            }
          },
          axisLabel: {
            show: true,
            textStyle: {
              color: "#000", //更改坐标轴文字颜色
              fontSize: 12 //更改坐标轴文字大小
            }
          },
          splitLine: {
            //---grid 区域中的分隔线
            show: true, //---是否显示，'category'类目轴不显示，此时我的y轴为类目轴，splitLine属性是有意义的
            lineStyle: {
              color: "#666",
              width: 1,
              type: "dashed" //---类型
            }
          }
        },
        series: [
          {
            // name:'签收率',
            type: "line",
            stack: "百分比",
            // symbol: 'none', //去掉折线图中的节点
            smooth: false, //true 为平滑曲线，false为直线
            lineStyle: {
              color: "#ED781E",
              width: 1,
              type: "solid" //---类型
            },
            data: this.ec1.probabilitys,
            itemStyle : { normal: {label : {show: true}}}
          }
        ]
      });
      **myChart1.on("click", this.eConsole);//点击折点的方法**
    },
    **eConsole(param){
    //param.dataIndex 获取当前点击索引，
      console.log(param,param.dataIndex,'echarts点击事件--签收率');
    }**
   
  },
  // 监听ec
  watch: {
    ec1: {
      handler(newValue, oldValue) {
        console.log(newValue);
        this.ec1 = newValue; //把新值赋值给我们的属性数据
        this.init(); //刷新echarts图表
      },
      deep: true
    }
  }
};
</script>