饼状图--只有一个指标echarts-带面积的折线图echarts柱状图圆角实现echarts中饼状图数据太多进行翻页echarts给每个柱状图配置不同的颜色echarts中x轴文字太长换行的几种方式echarts-中的事件-- demo1.on('事件类型', function (params) {}echarts控制柱状图柱条的宽度在地图上--给经纬度--展示任何一个点可以展示地名echarts 设置legend样式echarts饼状图不要中间的文字提示echasrts定义折线图legend的样式-优化echarts轮训展示某个echarts设置标题样式vue中如何使用echarts,使用axios获取数据echarts更改x和y轴的颜色echarts在左下角添加单位echarts的初始化和销毁dispose多个饼状图echarts第二次渲染不出来的原因echarts中坐标与标签刻度对齐echarts饼图中央自定义文字echarts多条折线图添加单位设置echarts线的样式echarts饼状图自定义legend的样式付费echarts去除坐标轴上的x和y轴国庆总结:echarts自定义颜色主题,保证你看的明明白白echarts饼图的配置 封装组件的注意点echarts之--柱状图-%显示ECharts 简介ECharts 安装ECharts 自定义构建ECharts 创建图表ECharts 图表组成ECharts 文本样式ECharts 区域样式ECharts 事件系统ECharts action 交互ECharts 数据异步加载ECharts 标题组件ECharts 提示框ECharts 图例组件ECharts 工具栏ECharts 数据缩放组件ECharts 极坐标系ECharts 地图坐标系ECharts 折线图ECharts 柱状图ECharts 饼图ECharts 散点图ECharts K 线图

echarts轮训展示某个

 //学校资产占比的配置
    function schollAssets() {
        var myChart = window.$echarts.init(
            document.getElementById('schollproportion')
        )
        var index = 0
        var preindex = 0
        function fun() {
            secondData.timerSet = setInterval(function () {
                // // 显示提示框,如果后期需要可以
                // myChart.dispatchAction({
                //     type: 'showTip',//     seriesIndex: 0,//     dataIndex: index,// })
                // 取消高亮指定的数据图形
                myChart.dispatchAction({
                    type: 'downplay',seriesIndex: 0,dataIndex: preindex,})

                // 让图像凸出来
                myChart.dispatchAction({
                    type: 'highlight',dataIndex: index,})
                // 视图赋值,展示当前显示的是那一个
                if (
                    secondData.schollZhan &&
                    secondData.schollZhan[index] &&
                    secondData.schollZhan[index].value
                ) {
                    secondData.assestNumPro = secondData.schollZhan[index].value
                } else {
                    secondData.assestNumPro = 0
                }

                if (
                    secondData.schollZhan &&
                    secondData.schollZhan[index] &&
                    secondData.schollZhan[index].name
                ) {
                    secondData.assetsNamePro = secondData.schollZhan[index].name
                } else {
                    secondData.assetsNamePro = ''
                }

                if (
                    secondData.schollZhan &&
                    secondData.schollZhan[index] &&
                    secondData.schollZhan[index].totalCount
                ) {
                    secondData.assetsProPercent =
                        (
                            (secondData.schollZhan[index].value /
                                secondData.schollZhan[index].totalCount) *
                            100
                        ).toFixed(2) + '%'
                } else {
                    secondData.assetsProPercent = '0%'
                }

                preindex = index

                index++
                if (index > secondData.schollZhan.length - 1) {
                    index = 0
                }
            },3000)
        }
        // 只有一条数据的的时候就不循环展示了
        if (secondData.schollZhan.length > 1) {
            fun()
        }

        // 指定图表的配置项和数据
        var option = {
            tooltip: {
                trigger: 'item',formatter: function (params) {
                    return (
                        params.marker +
                        params.name +
                        '<span style="display:inline-block;margin-right:8px;border-radius:10px;width:10px;height:10px;"></span>' +
                        params.value +
                        '个'
                    )
                },},series: [
                {
                    type: 'pie',radius: ['50%','70%'],center: ['30%','50%'],itemStyle: {
                        borderRadius: 0,borderColor: '#fff',borderWidth: 2,label: {
                        show: false,formatter: function (arg) {
                            return arg.name + ':' + arg.percent + '%'
                        },data: secondData.schollZhan,],}

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option)

        // 第一次默认第一条数据高亮
        myChart.dispatchAction({ type: 'highlight',dataIndex: index })

        function showInfoNumBaifen(myorIndex) {
            secondData.assestNumPro = secondData.schollZhan[myorIndex].value //资产数量
            secondData.assetsProPercent =
                (
                    (secondData.schollZhan[myorIndex].value /
                        secondData.schollZhan[myorIndex].totalCount) *
                    100
                ).toFixed(2) + '%' //占比
            secondData.assetsNamePro = secondData.schollZhan[myorIndex].name //名称
        }
        // 最初一开始就展示第一个小板块的数据
        showInfoNumBaifen(0)

        // 点击的时候,让某一个图案高亮,右侧显示对应的信息数据
        myChart.on('click',function (param) {
            myChart.dispatchAction({ type: 'downplay',dataIndex: preindex })
            myChart.dispatchAction({
                type: 'highlight',dataIndex: param.dataIndex,})
            // 循环下一次的小板块
            preindex = param.dataIndex
            index = param.dataIndex
            // 点击的哪一个展示哪一个
            showInfoNumBaifen(param.dataIndex)
        })
    }

    return { overviewLeftassets,schollAssets }
}