Message-ID: <410894453.75709.1711678880224.JavaMail.root@iZbp18oy7vkjyb4wkosfi9Z> Subject: Exported From Confluence MIME-Version: 1.0 Content-Type: multipart/related; boundary="----=_Part_75708_416370443.1711678880224" ------=_Part_75708_416370443.1711678880224 Content-Type: text/html; charset=UTF-8 Content-Transfer-Encoding: quoted-printable Content-Location: file:///C:/exported.html Echarts=E6=8E=A7=E4=BB=B6=E6=A8=A1=E6=9D=BF

Echarts=E6=8E=A7=E4=BB=B6=E6=A8=A1=E6=9D=BF

 

=E3=80=90Designer=E8=84=9A=E6=9C=AC=E6=A8=A1=E6=9D=BF=E3=80= =91


=20
//=E8=AF=
=B7=E5=B0=86$vcPlugin_demo_demoEcharts=E4=B8=AD=E7=9A=84demo=E6=8D=A2=E6=88=
=90=E7=9B=B8=E5=BA=94=E7=9A=84=E5=88=86=E7=B1=BB=E6=A0=87=E8=AF=86
vsPluginComponentModule.factory('$vcPlugin_demo_demoEcharts', ['$vsPluginRe=
gister', '$timeout', function ($vsPluginRegister, $timeout) {

    //echarts=E7=9A=84=E5=9B=BE=E5=BD=A2=E7=9A=84=E9=BB=98=E8=AE=A4option
    var optionTemplate =3D {
=09    title: {
        =09show: false
        },
        legend: {
        =09show: false,
            orient : 'horizontal',
            x : 'right',
            y : 'top',
            data:[],
            textStyle: {
=09           color: "#999",
=09           fontSize: 12
=09        }
        },
        grid: {
            x: 42,
            y: 34,
            x2: 11,
            y2: 25,
=09        borderWidth: 0,
=09        borderColor: "#f0f0f0"
        },
        tooltip : {
            show:true,
=09=09=09confine: true,
            trigger: 'axis',
            axisPointer: {
            =09type: 'shadow'
            },
            position: function (pos, params, dom, rect, size) {
=09=09=09=09var obj =3D {top: 0};
=09=09=09=09obj['left'] =3D pos[0] < size.viewSize[0] / 2 ? pos[1] : pos=
[1]-size.contentSize[0];
=09=09=09=09return obj;
=09=09=09}
        },
        calculable : false,
        confine: true,
        animationDuration: 500,
        xAxis : [{
            type : 'category',
            boundaryGap: true,
            axisLine: {
                lineStyle: {
                    color: '#DDD',
                    width: 1,
                    shadowBlur: 0,
                    shadowOffsetX: 0,
                    shadowOffsetY: 0
                },
                show: true
            },
            splitArea: {
                show: false
            },
            splitLine: {
                lineStyle: {
                    color: '#F6F6F6'
                }
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                textStyle:{
                    color: '#666',
                    fontSize: 12
                }
            },
            data : ['=E5=91=A8=E4=B8=80', '=E5=91=A8=E4=BA=8C', '=E5=91=A8=
=E4=B8=89', '=E5=91=A8=E5=9B=9B', '=E5=91=A8=E4=BA=94', '=E5=91=A8=E5=85=AD=
', '=E5=91=A8=E6=97=A5']
        }],
        yAxis : [{
            name: "=E9=94=80=E5=94=AE=E9=A2=9D",
            type : 'value',
            axisLine: {
                lineStyle: {
                    color: '#B0B0B0',
                    width: 1,
                    shadowBlur: 0,
                    shadowOffsetX: 0,
                    shadowOffsetY: 0
                },
                show: true
            },
            splitArea: {
                show: false
            },
            splitLine: {
                lineStyle: {
                    color: '#F6F6F6'
                }
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                textStyle:{
                    color: '#666',
                    fontSize: 12
                }
            }
        }],
        series: [{
            name: "=E9=94=80=E5=94=AE=E9=A2=9D",
            itemStyle: {
                normal: {
                    color: "#006BB7",
                    lineStyle : {
                        color: "#006BB7"
                    }
                }
            },
            data: [820, 932, 901, 934, 1290, 1330, 1320],
            type: 'bar'
        }]
    };


    var factory =3D {

        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E6=95=B0=E6=8D=AE]=E9=85=8D=E7=BD=AE
        showDataCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E8=BE=B9=E6=A1=86]=E9=85=8D=E7=BD=AE
        showBorderCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E5=9F=BA=E6=9C=AC]=E9=85=8D=E7=BD=AE
        showBasicCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E6=B5=AE=E5=8A=A8]=E9=85=8D=E7=BD=AE
        showFixedCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E4=BA=8B=E4=BB=B6]=E9=85=8D=E7=BD=AE
        showEventCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E6=A0=87=E9=A2=98]=E9=85=8D=E7=BD=AE
        showTitleCategory: true,
        //=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF=E4=B8=AD=E6=98=BE=E7=A4=BA[=
=E9=A2=84=E8=AD=A6]=E9=85=8D=E7=BD=AE
        showThresholdCategory: true,

        /* =E6=8E=A7=E4=BB=B6=E7=9A=84=E5=88=9D=E5=A7=8B=E5=8C=96 */
        init: function(scope, element, component, $compile){
            scope.element =3D element;
            scope.component =3D component;
            //=E5=85=B3=E9=97=AD=E9=A1=B5=E9=9D=A2=E8=BF=87=E6=BB=A4
            component.config.pageFilter =3D false;
            //=E6=8E=A7=E4=BB=B6=E7=9A=84=E5=9B=BE=E5=BD=A2=E7=BB=B4=E5=BA=
=A6=E6=95=B0=E9=87=8F
            scope.component.config.chartDimensionCount =3D 1;
            //=E6=8E=A7=E4=BB=B6=E8=87=B3=E5=B0=91=E9=9C=80=E8=A6=811=E4=B8=
=AA=E7=BB=B4=E5=BA=A6
            scope.component.config.minDimensionCount =3D 1;
            //=E6=8E=A7=E4=BB=B6=E8=87=B3=E5=B0=91=E9=9C=80=E8=A6=811=E4=B8=
=AA=E5=BA=A6=E9=87=8F
            scope.component.config.minMeasureCount =3D 1;
            //=E6=A3=80=E6=9F=A5=E6=8E=A7=E4=BB=B6=E9=AB=98=E5=BA=A6
            if(element.height() =3D=3D 0){
=09=09=09=09$timeout(function(){
=09=09=09=09=09factory.init(scope, element, component, $compile, $sce, $tim=
eout);
=09=09=09=09},100);
=09=09=09}else{
=09=09=09=09factory.initChart(scope, element, component, $compile);
=09=09=09}

        },
       =20
        initChart: function(scope, element, component, $compile){
=09=09=09var myChart =3D echarts.init(element[0]);
            var option =3D component.config.chartConfig;
            if(option =3D=3D null){
                //=E5=88=9D=E5=A7=8B=E5=8C=96echarts=E7=9A=84option=E9=BB=
=98=E8=AE=A4=E5=80=BC
            =09option =3D optionTemplate;
            =09option.noDataLoadingOption =3D {};
            =09//=E5=B0=86option=E4=BF=9D=E5=AD=98=E5=88=B0chartConfig=E5=
=AF=B9=E8=B1=A1=E4=B8=AD
            =09component.config.chartConfig =3D option;
            =09component.config.legendOrient =3D "horizontal";
            }

            option.tooltip.position =3D function (pos, params, dom, rect, s=
ize) {
=09=09=09=09var obj =3D {top: 0};
=09=09=09=09obj['left'] =3D pos[0] < size.viewSize[0] / 2 ? pos[0] : pos=
[0]-size.contentSize[0];
=09=09=09=09return obj;
=09=09=09};

            //=E8=B0=83=E7=94=A8echarts=E7=9A=84setOption=E6=96=B9=E6=B3=95
=09=09=09try{
=09=09=09=09myChart.setOption(option);
=09=09=09}catch(e){
=09=09=09}
            //=E5=B0=86chart=E5=AF=B9=E8=B1=A1=E6=94=BE=E5=88=B0context=E4=
=B8=AD
            component.context.chart =3D myChart;
            //=E5=BD=93=E6=8E=A7=E4=BB=B6=E5=B0=BA=E5=AF=B8=E6=94=B9=E5=8F=
=98=E6=97=B6=EF=BC=8C=E6=94=B9=E5=8F=98echarts=E7=9A=84=E5=B0=BA=E5=AF=B8
            component.context.resize =3D function(){
            =09$timeout(function(){
            =09=09if(component.context.chart.resize){
            =09=09=09component.context.chart.resize();
            =09=09}
            =09}, 100);
            }
=09=09},

        /*
         * =E6=9E=84=E5=BB=BA=E6=95=B0=E6=8D=AE=E6=8F=8F=E8=BF=B0=EF=BC=8C=
=E6=AD=A4=E6=96=B9=E6=B3=95=E4=B8=AD=E5=AF=B9=E6=8E=A7=E4=BB=B6=E7=9A=84=E6=
=95=B0=E6=8D=AE=E8=BF=9B=E8=A1=8C=E5=A4=84=E7=90=86
         */
        buildDataDescription: function(dataDescription, scope, element, com=
ponent, $compile){
            //=E6=8E=A5=E6=94=B6=E6=8E=A7=E4=BB=B6=E5=88=B7=E6=96=B0=E6=95=
=B0=E6=8D=AE=E7=9A=84=E4=BA=8B=E4=BB=B6
            scope.$on(event_refreshComponentData, function(target, param){
                scope.queryComponentData(param, {
                    onSuccess: function(){
                        refreshChartView(scope, element, component, $compil=
e);
                    }
                });
            });

            //=E6=8E=A5=E6=94=B6=E7=BB=B4=E5=BA=A6=E8=81=94=E5=8A=A8=E4=BA=
=8B=E4=BB=B6
            scope.$on(event_chartDimensionValueChange, function(s, event){
                var dataIndex =3D -1;
=09=09=09=09var axisLabels =3D component.config.chartConfig.xAxis[0].data;
=09=09=09=09for(var i =3D 0; i < axisLabels.length; i++){
=09=09=09=09=09if(""+axisLabels[i] =3D=3D=3D ""+event.source.value){
=09=09=09=09=09=09dataIndex =3D i;
=09=09=09=09=09=09break;
=09=09=09=09=09}
=09=09=09=09}
=09=09=09=09if(dataIndex < 0){
=09=09=09=09=09component.context.chart.dispatchAction({
=09=09=09=09=09=09type: 'hideTip'
=09=09=09=09=09});
=09=09=09=09=09return;
=09=09=09=09}
=09=09=09=09if(dataIndex > -1){
=09=09=09=09=09component.context.chart.dispatchAction({
=09=09=09=09=09=09type: 'showTip',
=09=09=09=09=09=09dataIndex:dataIndex,
=09=09=09=09=09=09seriesIndex: 0
=09=09=09=09=09});
=09=09=09=09}
            });
        },

        /*
         * =E6=9E=84=E5=BB=BA=E5=9B=BE=E5=BD=A2=E6=8F=8F=E8=BF=B0=EF=BC=8C=
=E6=AD=A4=E6=96=B9=E6=B3=95=E4=B8=AD=E5=AE=9A=E4=B9=89=E6=8E=A7=E4=BB=B6=E7=
=9A=84=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=9D=BF
         */
        buildChartDescription: function(scope, element, component, $compile=
){
            //=E6=9E=84=E5=BB=BA[=E5=9B=BE=E5=BD=A2]=E9=85=8D=E7=BD=AE=E9=
=9D=A2=E6=9D=BF
            buildChartDescription(scope, element, component, $compile);
            //=E6=9E=84=E5=BB=BA[=E8=BD=B4=E7=BA=BF]=E9=85=8D=E7=BD=AE=E9=
=9D=A2=E6=9D=BF
            buildAxisDescription(scope, element, component, $compile);
            //=E6=9E=84=E5=BB=BA[=E5=BA=A6=E9=87=8F]=E9=85=8D=E7=BD=AE=E9=
=9D=A2=E6=9D=BF
            buildMeasureDescription(scope, element, component, $compile);
        }
    };
   =20
    //=E6=9E=84=E5=BB=BA[=E8=BD=B4=E7=BA=BF]=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=
=9D=BF
    var buildAxisDescription =3D function(scope, element, component, $compi=
le){
        var category =3D {
=09=09=09name: "axis",
=09=09=09title: "=E8=BD=B4=E7=BA=BF",
=09=09=09groups: []
=09=09};
        component.description.categories.push(category);
    }
   =20
    //=E6=9E=84=E5=BB=BA[=E5=BA=A6=E9=87=8F]=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=
=9D=BF
    var buildMeasureDescription =3D function(scope, element, component, $co=
mpile){
        var category =3D {
=09=09=09name: "measures",
=09=09=09title: "=E5=BA=A6=E9=87=8F",
=09=09=09groups: []
=09=09};
        component.description.categories.push(category);
    }

    //=E6=9E=84=E5=BB=BA[=E5=9B=BE=E5=BD=A2]=E9=85=8D=E7=BD=AE=E9=9D=A2=E6=
=9D=BF
    var buildChartDescription =3D function(scope, element, component, $comp=
ile){
        var category =3D {
=09=09=09name: "chart",
=09=09=09title: "=E5=9B=BE=E5=BD=A2",
=09=09=09groups: []
=09=09};
        component.description.categories.push(category);

        //=E5=9B=BE=E4=BE=8B
=09=09category.groups.push({
=09=09=09title: {
=09=09=09=09text: "=E5=9B=BE=E4=BE=8B"
=09=09=09},
=09=09=09elements: [{
=09=09=09=09title: "=E6=98=BE=E7=A4=BA",
=09=09=09=09type: "radio",
=09=09=09=09bind: "showLegend",
=09=09=09=09items: [{
=09=09=09=09=09name: "=E5=BC=80=E5=90=AF",
=09=09=09=09=09value: "show"
=09=09=09=09},{
=09=09=09=09=09name: "=E5=85=B3=E9=97=AD",
=09=09=09=09=09value: "hide"
=09=09=09=09}]
=09=09=09}, {
=09=09=09=09title: "=E6=96=B9=E5=90=91",
=09=09=09=09type: "radio-icon",
=09=09=09=09bind: "legendOrient",
=09=09=09=09items: [{
=09=09=09=09=09name: "=E5=9E=82=E7=9B=B4",
=09=09=09=09=09value: "vertical",
=09=09=09=09=09icon: "fa fa-ellipsis-v"
=09=09=09=09},{
=09=09=09=09=09name: "=E6=B0=B4=E5=B9=B3",
=09=09=09=09=09value: "horizontal",
=09=09=09=09=09icon: "fa fa-ellipsis-h"
=09=09=09=09}]
=09=09=09}, {
=09=09=09=09title: "=E5=9E=82=E7=9B=B4=E4=BD=8D=E7=BD=AE",
=09=09=09=09type: "radio-icon",
=09=09=09=09bind: "legendPosY",
=09=09=09=09items: [{
=09=09=09=09=09name: "=E9=A1=B6=E9=83=A8",
=09=09=09=09=09value: "top",
=09=09=09=09=09icon: "fa fa-minus",
=09=09=09=09=09pStyle: "padding-top:0;padding-bottom:12px;"
=09=09=09=09},{
=09=09=09=09=09name: "=E5=B1=85=E4=B8=AD",
=09=09=09=09=09value: "center",
=09=09=09=09=09icon: "fa fa-minus",
=09=09=09=09=09pStyle: "padding-top:6px;padding-bottom:6px;"
=09=09=09=09},{
=09=09=09=09=09name: "=E5=BA=95=E9=83=A8",
=09=09=09=09=09value: "bottom",
=09=09=09=09=09icon: "fa fa-minus",
=09=09=09=09=09pStyle: "padding-top:12px;padding-bottom:0px;"
=09=09=09=09}],
=09=09=09=09show: function(ele){
=09=09=09=09=09return scope.component.config.legendOrient !=3D null &&a=
mp; scope.component.config.legendOrient =3D=3D=3D "vertical";
=09=09=09=09}
=09=09=09}, {
=09=09=09=09title: "=E6=B0=B4=E5=B9=B3=E4=BD=8D=E7=BD=AE",
=09=09=09=09type: "radio-icon",
=09=09=09=09bind: "legendPosX",
=09=09=09=09items: [{
=09=09=09=09=09name: "=E5=B7=A6=E5=AF=B9=E9=BD=90",
=09=09=09=09=09value: "left",
=09=09=09=09=09icon: "fa fa-align-left"
=09=09=09=09},{
=09=09=09=09=09name: "=E5=B1=85=E4=B8=AD",
=09=09=09=09=09value: "center",
=09=09=09=09=09icon: "fa fa-align-center"
=09=09=09=09},{
=09=09=09=09=09name: "=E5=8F=B3=E5=AF=B9=E9=BD=90",
=09=09=09=09=09value: "right",
=09=09=09=09=09icon: "fa fa-align-right"
=09=09=09=09}],
=09=09=09=09show: function(ele){
=09=09=09=09=09return scope.component.config.legendOrient !=3D null &&a=
mp; scope.component.config.legendOrient =3D=3D=3D "horizontal";
=09=09=09=09}
=09=09=09}]
=09=09});
=09=09
=09=09//=E7=9B=91=E5=90=ACshowLegend=E5=B1=9E=E6=80=A7
=09=09scope.$watch('component.config.showLegend', function(newValue, oldVal=
ue){
=09=09=09if(newValue !=3D null && (oldValue =3D=3D null || oldValue=
 !=3D=3D newValue)){
=09=09=09=09var option =3D component.config.chartConfig;
=09=09=09=09if(option.legend =3D=3D null){
=09=09=09=09=09option.legend =3D {
=09=09=09        =09show: false,
=09=09=09            orient : 'horizontal',
=09=09=09            x : 'right',
=09=09=09            y : 'top',
=09=09=09            data:["=E9=94=80=E5=94=AE=E9=A2=9D"],
=09=09=09            textStyle: {
=09=09=09=09           color: "#999",
=09=09=09=09           fontSize: 12
=09=09=09=09        }
=09=09=09        };
=09=09=09        option.legend.show =3D newValue =3D=3D=3D "show";
=09=09=09        refreshChartView();
=09=09=09=09}else{
=09=09=09=09=09option.legend.show =3D newValue =3D=3D=3D "show";
=09=09=09=09=09scope.component.context.chart.setOption(option, true);
=09=09=09=09}
=09=09=09}
=09=09});
=09=09
    }

    //=E5=88=B7=E6=96=B0=E6=8E=A7=E4=BB=B6=E6=B8=B2=E6=9F=93
    var refreshChartView =3D function(scope, element, component, $compile){
        //=E9=85=8D=E7=BD=AE=E7=9A=84=E7=BB=B4=E5=BA=A6
        var dimensions =3D component.config.datasourceConfig.dimensions;
        //=E9=85=8D=E7=BD=AE=E7=9A=84=E5=BA=A6=E9=87=8F
        var measures =3D component.config.datasourceConfig.measures;
        //=E8=8E=B7=E5=8F=96echarts=E7=9A=84option=E9=85=8D=E7=BD=AE=E5=AF=
=B9=E8=B1=A1
        var option =3D component.config.chartConfig;
        //=E6=9C=8D=E5=8A=A1=E5=99=A8=E7=AB=AF=E8=BF=94=E5=9B=9E=E7=9A=84=
=E6=9F=A5=E8=AF=A2=E6=95=B0=E6=8D=AE
        var data =3D component.context.data;
        if(data =3D=3D null){
=09=09=09return;
=09=09}
=09=09
=09=09//=E5=88=A0=E6=8E=89=E5=A4=9A=E4=BD=99=E7=9A=84=E6=8C=87=E6=A0=87=E9=
=85=8D=E7=BD=AE
=09    if(option.series.length > measures.length){
=09    =09var newSeries =3D [];
=09    =09for(var i =3D 0; i < measures.length; i++){
=09    =09=09newSeries.push(option.series[i]);
=09    =09}
=09    =09option.series =3D newSeries;
=09    }
=09   =20
=09    //X=E8=BD=B4=E7=9A=84=E6=96=87=E5=AD=97
=09    var xAxisLabels =3D [];
=09    for(var i =3D 0; i < data.length; i++){
=09        xAxisLabels.push(data[i][dimensions[dimensions.length-1].name]);
=09    }
=09    if(xAxisLabels.length =3D=3D 0){
=09    =09xAxisLabels =3D [""];
=09    }
=09    //=E5=9B=BE=E4=BE=8B=E7=9A=84=E5=80=BC
=09    var legendData =3D [];
=09    for(var m =3D 0; m < measures.length; m++){
=09    =09var serieData =3D [];
=09=09    for(var i =3D 0; i < data.length; i++){
=09=09=09=09if(isNaN(data[i][measures[m].name])){
=09=09=09=09=09data[i][measures[m].name] =3D null;
=09=09=09=09}
=09=09        serieData.push(data[i][measures[m].name]);
=09=09    }
=09=09    if(serieData.length =3D=3D 0){
=09=09    =09serieData =3D [""];
=09=09    }
=09=09    if(option.series[m] =3D=3D null){
=09=09    =09var newOption =3D $.extend(true, {}, optionTemplate);
=09=09    =09option.series[m] =3D newOption.series[0];
=09=09    }
=09=09    option.series[m].data =3D serieData;
=09=09    option.series[m].name =3D measures[m].label;

            //=E5=BA=A6=E9=87=8F=E5=88=AB=E5=90=8D
            if(component.config["measureAlias_"+m] !=3D null){
                option.yAxis[0].name =3D component.config["measureAlias_"+m=
];
            }
=09=09    if(option.yAxis[0].name =3D=3D null || option.yAxis[0].name.lengt=
h =3D=3D 0){
=09=09=09=09option.yAxis[0].name =3D measures[m].label;
=09=09=09}

            //=E6=9F=B1=E5=AD=90=E7=9A=84=E9=A2=9C=E8=89=B2
=09    =09if(component.config["columnColor_"+m] =3D=3D null){
=09=09    =09option.series[m].itemStyle.normal.color =3D "#4c87b5";
=09=09    }else{
=09=09    =09option.series[m].itemStyle.normal.color=3Dcomponent.config["co=
lumnColor_"+m];
=09=09    }
=09=09    //=E5=A0=86=E7=A7=AF
=09=09    option.series[m].stack =3D component.config["stack_"+m];
=09=09=09if(VSUtils.isEmpty(option.series[m].stack) || !option.series[m].st=
ack){
=09=09=09=09delete option.series[m].stack;
=09=09=09}

            //=E5=9B=BE=E4=BE=8B
=09=09    var legendValue =3D measures[m].label;
=09=09    if(component.config["measureAlias_"+m] !=3D null && compo=
nent.config["measureAlias_"+m].length > 0){
=09=09    =09option.series[m].name =3D component.config["measureAlias_"+m];
=09=09    =09legendValue =3D component.config["measureAlias_"+m];
=09=09    }
=09=09    legendData.push(legendValue);

            //series=E7=9A=84name=E5=B1=9E=E6=80=A7
=09=09=09if(option.series[m].name =3D=3D null || option.series[m].name.leng=
th =3D=3D 0){
=09=09=09=09option.series[m].name =3D measures[m].label;
=09=09=09}
=09    }

=09    option.xAxis[0].data =3D xAxisLabels;
=09    if(option.legend !=3D null){
=09    =09option.legend.data =3D legendData;
=09    }

        //=E5=A6=82=E6=9E=9C=E5=BA=A6=E9=87=8F=E6=95=B0=E9=87=8F=E5=A4=A7=
=E4=BA=8E1=EF=BC=8C=E6=88=96=E8=80=85=E9=85=8D=E7=BD=AE=E4=BA=86=E5=9B=BE=
=E4=BE=8B=EF=BC=8C=E4=B8=8D=E6=98=BE=E7=A4=BAY=E8=BD=B4=E4=B8=8A=E9=9D=A2=
=E7=9A=84=E5=90=8D=E7=A7=B0
=09=09if(measures.length > 1 || option.legend.show =3D=3D=3D true){
=09=09=09option.yAxis[0].name=3D"";
=09=09}

=09=09setTimeout(function(){
=09=09=09component.context.chart.dispatchAction({
=09=09=09=09type: 'hideTip'
=09=09=09});
=09=09=09setTimeout(function(){
=09=09=09=09component.context.chart.setOption(option, true);
=09=09=09});
=09=09});

    };

    //=E8=AF=B7=E5=B0=86=E7=AC=AC=E4=B8=80=E4=B8=AA=E5=8F=82=E6=95=B0"demo"=
=E6=8D=A2=E6=88=90=E7=9B=B8=E5=BA=94=E7=9A=84=E5=88=86=E7=B1=BB=E6=A0=87=E8=
=AF=86
    $vsPluginRegister.register("demo", "demoEcharts", factory);

}]);
=20

 

 

 

=E3=80=90View=E8=84=9A=E6=9C=AC=E6=A8=A1=E6=9D=BF=E3=80=91


=20
var build=
_demoEcharts_component =3D function(scope, element, $compile, $timeout, $sc=
e){

    var component =3D scope.component;
   =20
    var myChart =3D echarts.init(element[0]);
    var option =3D component.config.chartConfig;
    if(option =3D=3D null){
        //=E5=88=9D=E5=A7=8B=E5=8C=96echarts=E7=9A=84option=E9=BB=98=E8=AE=
=A4=E5=80=BC
    =09option =3D optionTemplate;
    =09option.noDataLoadingOption =3D {};
    =09//=E5=B0=86option=E4=BF=9D=E5=AD=98=E5=88=B0chartConfig=E5=AF=B9=E8=
=B1=A1=E4=B8=AD
    =09component.config.chartConfig =3D option;
    =09component.config.legendOrient =3D "horizontal";
    }
   =20
    option.tooltip.position =3D function (pos, params, dom, rect, size) {
=09=09var obj =3D {top: 0};
=09=09obj['left'] =3D pos[0] < size.viewSize[0] / 2 ? pos[0] : pos[0]-si=
ze.contentSize[0];
=09=09return obj;
=09};

    //=E8=B0=83=E7=94=A8echarts=E7=9A=84setOption=E6=96=B9=E6=B3=95
=09try{
=09=09myChart.setOption(option);
=09}catch(e){
=09}
    //=E5=B0=86chart=E5=AF=B9=E8=B1=A1=E6=94=BE=E5=88=B0context=E4=B8=AD
    component.context.chart =3D myChart;
    //=E5=BD=93=E6=8E=A7=E4=BB=B6=E5=B0=BA=E5=AF=B8=E6=94=B9=E5=8F=98=E6=97=
=B6=EF=BC=8C=E6=94=B9=E5=8F=98echarts=E7=9A=84=E5=B0=BA=E5=AF=B8
    component.context.resize =3D function(){
    =09$timeout(function(){
    =09=09if(component.context.chart.resize){
    =09=09=09component.context.chart.resize();
    =09=09}
    =09}, 100);
    }

    //=E5=88=B7=E6=96=B0=E6=8E=A7=E4=BB=B6=E6=B8=B2=E6=9F=93=EF=BC=8C=E5=8F=
=AF=E7=9B=B4=E6=8E=A5=E5=B0=86designer.js=E4=B8=AD=E7=9A=84=E6=96=B9=E6=B3=
=95=E5=A4=8D=E5=88=B6=E8=BF=87=E6=9D=A5
    var refreshChartView =3D function(){
        //=E9=85=8D=E7=BD=AE=E7=9A=84=E7=BB=B4=E5=BA=A6
        var dimensions =3D component.config.datasourceConfig.dimensions;
        //=E9=85=8D=E7=BD=AE=E7=9A=84=E5=BA=A6=E9=87=8F
        var measures =3D component.config.datasourceConfig.measures;
        //=E8=8E=B7=E5=8F=96echarts=E7=9A=84option=E9=85=8D=E7=BD=AE=E5=AF=
=B9=E8=B1=A1
        var option =3D component.config.chartConfig;
        //=E6=9C=8D=E5=8A=A1=E5=99=A8=E7=AB=AF=E8=BF=94=E5=9B=9E=E7=9A=84=
=E6=9F=A5=E8=AF=A2=E6=95=B0=E6=8D=AE
        var data =3D component.context.data;
        if(data =3D=3D null){
=09=09=09return;
=09=09}
=09=09
=09=09//=E5=88=A0=E6=8E=89=E5=A4=9A=E4=BD=99=E7=9A=84=E6=8C=87=E6=A0=87=E9=
=85=8D=E7=BD=AE
=09    if(option.series.length > measures.length){
=09    =09var newSeries =3D [];
=09    =09for(var i =3D 0; i < measures.length; i++){
=09    =09=09newSeries.push(option.series[i]);
=09    =09}
=09    =09option.series =3D newSeries;
=09    }
=09   =20
=09    //X=E8=BD=B4=E7=9A=84=E6=96=87=E5=AD=97
=09    var xAxisLabels =3D [];
=09    for(var i =3D 0; i < data.length; i++){
=09        xAxisLabels.push(data[i][dimensions[dimensions.length-1].name]);
=09    }
=09    if(xAxisLabels.length =3D=3D 0){
=09    =09xAxisLabels =3D [""];
=09    }
=09    //=E5=9B=BE=E4=BE=8B=E7=9A=84=E5=80=BC
=09    var legendData =3D [];
=09    for(var m =3D 0; m < measures.length; m++){
=09    =09var serieData =3D [];
=09=09    for(var i =3D 0; i < data.length; i++){
=09=09=09=09if(isNaN(data[i][measures[m].name])){
=09=09=09=09=09data[i][measures[m].name] =3D null;
=09=09=09=09}
=09=09        serieData.push(data[i][measures[m].name]);
=09=09    }
=09=09    if(serieData.length =3D=3D 0){
=09=09    =09serieData =3D [""];
=09=09    }
=09=09    if(option.series[m] =3D=3D null){
=09=09    =09var newOption =3D $.extend(true, {}, optionTemplate);
=09=09    =09option.series[m] =3D newOption.series[0];
=09=09    }
=09=09    option.series[m].data =3D serieData;
=09=09    option.series[m].name =3D measures[m].label;

            //=E5=BA=A6=E9=87=8F=E5=88=AB=E5=90=8D
            if(component.config["measureAlias_"+m] !=3D null){
                option.yAxis[0].name =3D component.config["measureAlias_"+m=
];
            }
=09=09    if(option.yAxis[0].name =3D=3D null || option.yAxis[0].name.lengt=
h =3D=3D 0){
=09=09=09=09option.yAxis[0].name =3D measures[m].label;
=09=09=09}

            //=E6=9F=B1=E5=AD=90=E7=9A=84=E9=A2=9C=E8=89=B2
=09    =09if(component.config["columnColor_"+m] =3D=3D null){
=09=09    =09option.series[m].itemStyle.normal.color =3D "#4c87b5";
=09=09    }else{
=09=09    =09option.series[m].itemStyle.normal.color=3Dcomponent.config["co=
lumnColor_"+m];
=09=09    }
=09=09    //=E5=A0=86=E7=A7=AF
=09=09    option.series[m].stack =3D component.config["stack_"+m];
=09=09=09if(VSUtils.isEmpty(option.series[m].stack) || !option.series[m].st=
ack){
=09=09=09=09delete option.series[m].stack;
=09=09=09}

            //=E5=9B=BE=E4=BE=8B
=09=09    var legendValue =3D measures[m].label;
=09=09    if(component.config["measureAlias_"+m] !=3D null && compo=
nent.config["measureAlias_"+m].length > 0){
=09=09    =09option.series[m].name =3D component.config["measureAlias_"+m];
=09=09    =09legendValue =3D component.config["measureAlias_"+m];
=09=09    }
=09=09    legendData.push(legendValue);

            //series=E7=9A=84name=E5=B1=9E=E6=80=A7
=09=09=09if(option.series[m].name =3D=3D null || option.series[m].name.leng=
th =3D=3D 0){
=09=09=09=09option.series[m].name =3D measures[m].label;
=09=09=09}
=09    }

=09=09component.context.originalXAxisLabels =3D null;
=09=09if(!VSUtils.isEmpty(component.config.xAxisLabelScript)){
=09=09=09component.context.originalXAxisLabels =3D angular.copy(xAxisLabels=
);
=09=09=09try{
=09=09=09=09var f =3D eval("(function(labelData){ "+Base64.decode(component=
.config.xAxisLabelScript)+"})");
=09=09=09=09f.call(null, xAxisLabels);
=09=09=09}catch(e){
=09=09=09=09console.log(e);
=09=09=09}
=09=09}
=09    option.xAxis[0].data =3D xAxisLabels;
=09    if(option.legend !=3D null){
=09    =09option.legend.data =3D legendData;
=09    }

        //=E5=A6=82=E6=9E=9C=E5=BA=A6=E9=87=8F=E6=95=B0=E9=87=8F=E5=A4=A7=
=E4=BA=8E1=EF=BC=8C=E6=88=96=E8=80=85=E9=85=8D=E7=BD=AE=E4=BA=86=E5=9B=BE=
=E4=BE=8B=EF=BC=8C=E4=B8=8D=E6=98=BE=E7=A4=BAY=E8=BD=B4=E4=B8=8A=E9=9D=A2=
=E7=9A=84=E5=90=8D=E7=A7=B0
=09=09if(measures.length > 1 || option.legend.show =3D=3D=3D true){
=09=09=09option.yAxis[0].name=3D"";
=09=09}

=09=09setTimeout(function(){
=09=09=09component.context.chart.dispatchAction({
=09=09=09=09type: 'hideTip'
=09=09=09});
=09=09=09setTimeout(function(){
=09=09=09=09component.context.chart.setOption(option, true);
=09=09=09});
=09=09});
    };

    //=E6=8E=A5=E6=94=B6=E6=8E=A7=E4=BB=B6=E5=88=B7=E6=96=B0=E6=95=B0=E6=8D=
=AE=E7=9A=84=E4=BA=8B=E4=BB=B6
    scope.$on(event_refreshComponentData, function(target, param){
        scope.queryComponentData(param, {
            onSuccess: function(){
                refreshChartView(scope, element, component, $compile);
            }
        });
    });

    //=E6=8E=A5=E6=94=B6=E8=81=94=E5=8A=A8=E4=BA=8B=E4=BB=B6=EF=BC=8C=E5=8F=
=AF=E7=9B=B4=E6=8E=A5=E5=B0=86designer.js=E4=B8=AD=E7=9A=84=E6=96=B9=E6=B3=
=95=E5=A4=8D=E5=88=B6=E8=BF=87=E6=9D=A5
    scope.$on(event_chartDimensionValueChange, function(s, event){
        var dataIndex =3D -1;
=09=09var axisLabels =3D component.config.chartConfig.xAxis[0].data;
=09=09for(var i =3D 0; i < axisLabels.length; i++){
=09=09=09if(""+axisLabels[i] =3D=3D=3D ""+event.source.value){
=09=09=09=09dataIndex =3D i;
=09=09=09=09break;
=09=09=09}
=09=09}
=09=09if(dataIndex < 0){
=09=09=09component.context.chart.dispatchAction({
=09=09=09=09type: 'hideTip'
=09=09=09});
=09=09=09return;
=09=09}
=09=09if(dataIndex > -1){
=09=09=09component.context.chart.dispatchAction({
=09=09=09=09type: 'showTip',
=09=09=09=09dataIndex:dataIndex,
=09=09=09=09seriesIndex: 0
=09=09=09});
=09=09}
    });

}
=20
------=_Part_75708_416370443.1711678880224--