Echarts2.0雷达图tooltip单轴数据

简介: Echarts2.0雷达图tooltip单轴数据


option = {
    title : {
        text: '消防训练量化评分',
        show:true,
      x:'center'
    },
    tooltip : {
        trigger: 'axis',
        formatter: function (params, ticket, callback) {
            var showHtm="";
            for(var i=0;i<params.length;i++){
                //x轴名称
                var name = params[i][1];
                //名称
                var text = params[i][3];
                //值
                var value = params[i][2];
              //提示框显示
                showHtm+= name +':' + value +'<br>'
            }
            return text +'<br>'+showHtm;
        }
    },
    legend: {
        x : '3%',
        y : '10%',
        orient: 'vertical',
        align: 'left',
        data:['60米肩梯量化评分','3000米量化评分'],
        show: true
    },
    toolbox: {
        show : false,
        feature : {
            mark : {show: false},
            dataView : {show: false, readOnly: false},
            restore : {show: false},
            saveAsImage : {show: false}
        }
    },
    calculable : false,
    polar : [
        {
            indicator : [
                {text : '赵', max  : 15},
                {text : '钱', max  : 35},
                {text : '孙', max  : 30},
                {text : '周', max  : 15},
                {text : '吴', max  : 25},
                {text : '郑', max  : 30},
                {text : '王', max  : 15},
                {text : '冯', max  : 15},
                {text : '陈', max  : 20}
            ],
            radius : 130,
          shape: 'circle',  
        }
    ],
    series : [
        {
            name: '消防训练量化评分',
            type: 'radar',
           // itemStyle: {
              //  normal: {
                  //  areaStyle: {
                        //type: 'default'
                   // }
                //}
         //   },
            data : [
                {
                    value : [10,22,20,10,16,15,6,8,15],
                    name : '60米肩梯量化评分',
                    itemStyle: {
                        normal: {
                            color: '#87CEFF',
                            label: {
                               show: true,
                                formatter:function(params) {
                                    return params.value;
                                }
                            },
                           // areaStyle: {
                               // color: '#87CEFF'
                          //  }
                        }
                    }
                },
                {
                    value : [12,12,24,8,7,17,9,10,17],
                    name : '3000米量化评分',
                    itemStyle: {
                        normal: {
                           //color: '#CDB5CD',
                            label: {
                                show: true,
                                formatter:function(params) {
                                    return params.value;
                                }
                            }
                        }
                    }
                }
            ]
        }
    ]
};
相关文章
|
19天前
|
前端开发 算法 数据可视化
怎么在echarts图上左右滑动切换数据区间
怎么在echarts图上左右滑动切换数据区间
73 0
|
19天前
|
数据可视化
echarts图表坐标轴数据标签添加下划线
echarts图表坐标轴数据标签添加下划线
79 0
|
19天前
|
前端开发 JavaScript BI
Django教程第5章 | Web开发实战-数据统计图表(echarts、highchart)
使用echarts和highcharts图表库实现折线图、柱状图、饼图和数据集图
80 2
|
19天前
|
新零售 分布式计算 数据可视化
数据分享|基于Python、Hadoop零售交易数据的Spark数据处理与Echarts可视化分析
数据分享|基于Python、Hadoop零售交易数据的Spark数据处理与Echarts可视化分析
|
19天前
|
数据可视化 前端开发 JavaScript
react+datav+echarts实现可视化数据大屏
最近有点闲,就学习了下react,没想到就把react学完了,觉得还不错,就打算出一把react+datav的简易版可视化数据大屏供大家做个参考
192 2
react+datav+echarts实现可视化数据大屏
echarts设置暂无数据
echarts设置暂无数据
|
19天前
设置echarts的grid、tooltip、柱状图渐变色、折线图渐变色
设置echarts的grid、tooltip、柱状图渐变色、折线图渐变色
|
6月前
Echarts 设置数据条颜色 宽度
Echarts 设置数据条颜色 宽度
|
19天前
|
数据可视化 JavaScript 前端开发
Echarts是一个开源的JavaScript可视化库,用于创建各种类型的图表
Echarts是JavaScript的开源可视化库,Python通过Pyecharts库可调用它来绘制图表。示例展示了如何用Pyecharts创建柱状图:定义图表对象,设置标题和坐标轴,添加X轴、Y轴数据,最后渲染展示。Pyecharts还支持折线图、散点图、饼图等多种图表类型,更多详情可查阅官方文档。
37 0
|
19天前
|
前端开发 JavaScript 定位技术
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
35 0