Message-ID: <583522836.76009.1711722206951.JavaMail.root@iZbp18oy7vkjyb4wkosfi9Z> Subject: Exported From Confluence MIME-Version: 1.0 Content-Type: multipart/related; boundary="----=_Part_76008_565075125.1711722206951" ------=_Part_76008_565075125.1711722206951 Content-Type: text/html; charset=UTF-8 Content-Transfer-Encoding: quoted-printable Content-Location: file:///C:/exported.html
//=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
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