ECharts日历热力图点击事件和选中日期加边框

ECharts日历热力图点击事件和选中日期加边框_第1张图片

Echarts日历热力图子组件






 父组件


            
              
                

 切换日期时,选中框问题和日总计问题

this.date = todayTime;
            const dataIndex = parseInt(this.date.split("-").pop(), 10) - 1; // 拿到日期所在的索引
            // 获取echarts实例
            this.$refs.calendarRef.ChangeFontColor({ dataIndex: dataIndex }); // 切换回todayTime的日期,选中 dataIndex 的日期
            this.$refs.calendarRef.ChangeInfoData({ dataIndex: dataIndex }); // 切换回todayTime的日期,更新日总计的数据
getCalendarSummary(query).then(response => {
        this.dateInfoData = response.data.infoData;
        this.calendarMonthDataObj = response.data;
        if (this.date !== "") {
          // 如果有选择日期,则调用子组件方法更新最新的月数据
          const dataIndex = parseInt(this.date.split("-").pop(), 10) - 1; // 拿到日期所在的索引
          this.$refs.calendarRef.ChangeInfoData({
            dataIndex: dataIndex,
            infoData: this.dateInfoData
          }); // 更新日总计的数据
        }
      });

 

你可能感兴趣的:(vue,web前端,JS,echarts,前端,javascript)