FAQ中心
页面树结构

版本比较

旧版本 1

changes.mady.by.user 甘雅君

保存于

比较

新版本 2

changes.mady.by.user 甘雅君

保存于

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。

...

然后使用扩展属性实现，如下：

代码块
languagejs

	{
	    //不显示y轴
	    "yAxis": {
	        "show": false
	    },
	    //不显示x轴	
	    "xAxis": {
	        "show": false
	    },
	    "radiusAxis": {
	        //"data": [],
	        "data": ['点心', '饮料', '调味品', '酱料', '水果', '海鲜'],
	        //  不显示上面的横线，极坐标系的径向轴
	        // "axisLine": {
	        //     "show": false
	        // },
	        "axisLabel": {
	            "interval": 0,
	            "color": "blue",
	            "fontSize": 12,

	        }
	    },
	    //显示极坐标系的角度轴
	    "angleAxis": {
	        "show": true
	    },
	    "series": [{
//只有一个指标销售量，写一个即可控制所有，对动态数据友好
	        //类型为柱图
	        "type": "bar",
	        //转换为极坐标
	        "coordinateSystem": "polar",
	    }],
	    "polar": {},

	}

效果图如下：
Image Added

问题2：

如上面的极坐标柱图，如果我是有一个并列轴需要怎么实现?
Image Added

解决方案：

使用扩展属性实现，如下：

代码块
languagejs
 {

    "yAxis": {
        "show": false
    },
    "xAxis": {
        "show": false
    },
    "radiusAxis": {
        "data": [],
        "axisLine": {
            "show": false
        },
    },
    "angleAxis": {
        "show": false
    },
    "series": [{
//如果是并列轴存在的情况下，这个就是控制条数柱图转换为极坐标图的，有多少条就写多少个，这个在动态数据情况下可能不太友好
        "type": "bar",
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }],
	    "polar": {},

	}

效果图如下：

...

Image Added

...

问题3：

如上面的极坐标柱图，如果我是有一个并列轴需要怎么实现如上面的极坐标柱图，如果我是有多个指标怎么实现?Image Removed

Image Added

解决方案：

使用扩展属性实现，如下：

代码块
languagejs

	{
	    //不显示y轴
	    "yAxis": {
	        "show": false
	    },
	    //不显示x轴	
	    "xAxis": {
	        "show": false
	    },
	    "radiusAxis": {
	 //  不显示上面的横线，极坐标系的径向轴     //"radiusAxisdata": {[],
	        "data": ['点心', '饮料', '调味品', '酱料', '水果'],
	        //  不显示上面的横线，极坐标系的径向轴
	        // "axisLine": {
	        //     "show": false
	        },
   // },
 	   //不显示极坐标系的角度轴     "angleAxisaxisLabel": {
	            "showinterval": 0,
	  false     },     "seriescolor": [{ "blue",
	          //类型为柱图  "fontSize": 12,

	    "type": "bar",   }
	    },
//转换为极坐标	    //显示极坐标系的角度轴
	    "coordinateSystemangleAxis": "polar", {
	        }, {
"show": true
	    },
	    "typeseries": "bar", [{
       //三个指标，这里需要写三次
	 "coordinateSystem": "polar",     }, {//类型为柱图
	        "type": "bar",
	        //转换为极坐标
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }, {
	        "type": "bar",
	        "coordinateSystem": "polar",
	    }],
	    "polar": {},

	}


效果图如下：Image Removed

Image Added


如果上面的series部分只写了两个，如下写法，那会出现有一个没有转换过来，所以需要按指标（我上面销售量，销售额，指标1三个指标）个数写

Image Added

Image Added