[ABI 5.1] 酷屏引入日历图报错

js代码：var chart = null;
/*
* 初始化方法
*
* @params cwidget 组件对象
* @params vardata 取数定义中定义的变量，json格式：{'var1':'xxx'}
* @params storagedata 组件自己需要存储的值，字符串格式
* @params events 事件，用户在右边属性上设置的事件, json格式：{'evt1': function(){...}, 'evt2':function(){....}}
* @params resources 资源及权限校验，json格式：{'resids': ['EBI$12$xxx$1$xxx.rpttpl','EBI$12$xxx$1$xxx.coolrpt'], 'pms': [true, false]}
*/
function init(cwidget, vardata, events, storagedata, resources){
    var basedom = cwidget.basedom;
    cwidget.defdata = vardata;
    renderChart(cwidget,vardata);

    basedom.onclick = events.evt1;
    if(cwidget.isresultview){
        //只在结果界面的时候执行，例如只想在结果界面绑定click事件
    }
}

/**
* 渲染环形图
*/
function renderChart(cwidget,vardata){
    var option = getOption(cwidget,vardata);
   if(!window["echarts"]) {
                EUI.include("vfs/root/products/ebi/sys/coolrpt/coolresource/js/third/echartse.js");
    }
    if(!chart){
        chart = echarts.init(cwidget.basedom);
        chart.setOption(option);

    }else{
        chart.clear();
        chart.setOption(option);

    }
}

function getVirtulData(year) {
    var date = new Date();
    year = date.getFullYear();
    var date = +echarts.number.parseDate(year + '-01-01');
    var end = +echarts.number.parseDate((+year + 1) + '-01-01');
    var dayTime = 3600 * 24 * 1000;
    var data = [];
    for (var time = date; time < end; time += dayTime) {
        data.push([
            echarts.format.formatTime('yyyy-MM-dd', time),
            Math.floor(Math.random() * 1000)
        ]);
    }
    console.log(data[data.length - 1]);
    return data;
}

function getMon(date){
    var date = new Date();
    var seperator1 = "-";
    var year = date.getFullYear(); //获取完整的年份(4位)
    var mon = date.getMonth()+1; //获取当前月份(0-11,0代表1月)
        if (mon >= 1 && mon <= 9) {
        mon = "0" + mon;
    }
    var date = year + seperator1 + mon;
    return date ;
}  //获取当前月

function getOption(cwidget,vardata) {
    var date = new Date();
    var year = date.getFullYear();
    var data = getVirtulData(year);
    var mon = getMon(date);

    var y = JSON.parse(vardata.data);
    var name=JSON.parse(vardata.name);
    var color=JSON.parse(cwidget.getProperty('color'));
    var colorx=JSON.parse(cwidget.getProperty('colorx'));
    var colorf=JSON.parse(cwidget.getProperty('colorf'));
    var colorw=JSON.parse(cwidget.getProperty('colorw'));
    var cellSize = [40, 40]; //格子大小
        var option= {
     backgroundColor: '#02111E',
     tooltip: {
    },
    calendar: [{
        left: '2%',
        top: 'middle',
        orient: 'vertical',
        cellSize: cellSize,
        splitLine:{
                        show:true,
                        lineStyle:{
                                color: colorf[0],
                width:0.6,
                type:'solid'
                        }
                },  //网格线设置
        yearLabel: {show:false},
        dayLabel: {
            margin: 8,
            color: colorx[0],
            fontSize: Number(cwidget.getProperty("size")),
            fontFamily: 'normal',
            firstDay: 1,
            nameMap: 'cn'
        },  //星期字体设置
       itemStyle: {
            color: '#02111E',
            borderWidth: 0.2,
            borderColor:colorw[0]
        }, //小格子样式设置
        monthLabel: {
            show: false
        },
        range: '2020-11' //时间范围
    }],
    series: [{
        type: 'scatter',
        coordinateSystem: 'calendar', //坐标系为日历
        dimensions: [null, {type: 'ordinal'}],
        symbolSize: function (val) {
            return val[1] / 60;
        },
        label: {
            normal: {
                show: true,
                formatter: function (params) {
                    return echarts.format.formatTime('dd', params.value[0]);
                },
                offset: [-cellSize[0] / 2 + 10, -cellSize[1] / 2 + 10],
                textStyle: {
                       color: colorx[0],
                       fontSize: Number(cwidget.getProperty("size")),
                       fontFamily: 'normal',
                }
            }
        },
        data: data
    }]
};
return option;
}

function hexToRgb(hex,opacity){
    var color1, color2, color3;
    hex = ""+hex;
    if (typeof hex !== "string") return;
    if (hex.charAt(0) == "#") {
        hex = hex.substring(1);
    }
    if (hex.length == 3) {
        hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
    }
    if (/^[0-9a-fA-F]{6}$/.test(hex)) {
    color1 = parseInt(hex.substr(0,2), 16);
    color2 = parseInt(hex.substr(2,2), 16);
    color3 = parseInt(hex.substr(4,2), 16);
    return "rgba("+color1+","+color2+","+color3+","+opacity+")";
    }
}




/**
* 定义了自定义属性时，必须实现该方法，方法名为setProperty
* 当在属性面板上修改属性后，会调用该方法
* @param key  属性名
* @param value  属性值
* @param cwidget  组件对象
* @returns
*/
function setProperty(key, value, cwidget) {
    if (key === 'color' || key === 'colorx' || key === 'colorf' || key === 'colorw' || key === 'size') {
        //修改属性xxx时，触发的事
        renderChart(cwidget,cwidget.defdata,value);
    } else if (key === 'yyy') {
            //修改属性yyy时，触发的事

    }
}

/**
* 刷新操作，数据改变时，调用该方法，重新渲染数据
* @param cwidget 组件对象
* @param vardata 取数定义中定义的变量，json格式：{'var1':'xxx'}
* @param storagedata  组件自己需要存储的值，字符串格式
* @returns
*/
function refreshDatas(cwidget, vardata, storagedata){
    var basedom = cwidget.basedom;
   renderChart(cwidget,vardata);

}

/**
* 组件大小改变时执行
* @param cwidget 组件对象
* @returns
*/
function resize(cwidget){
    chart.resize();
}


/**
* 获取组件的参数值
* @param cwidget 组件对象
* @returns
*/
function getValue(cwidget){

}

/**
* 获取组件的参数名称
* @param cwidget 组件对象
* @returns
*/
function getParamName(cwidget){

}


/*
* 销毁操作,销毁自己相关的东西
*/
function dispose(cwidget){
    chart.dispose();
    chart = null;
}

点击预览后可以显示我做出来的图，但是只要点击计算酷屏就会报错，这个报错是啥意思呀，如果是js有问题为什么在组件里点击预览不会报错呢

截图202011101438116109.png (108.29 KB, 下载次数: )

下载附件

2020-11-10 14:38 上传

截图202011101438295553.png (98.2 KB, 下载次数: )

下载附件

2020-11-10 14:38 上传