Incubator-echarts: [feature] Support barBorderRadius on the polar bar chart

Created on 4 Jan 2017  ·  32Comments  ·  Source: apache/incubator-echarts

One-line summary [问题简述]

想给环形图进度条两端设置圆角,但是好像只有柱状图有barBorderRadius属性。

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]:
  • Browser version [浏览器类型和版本]:
  • OS Version [操作系统类型和版本]:

Expected behaviour [期望结果]

image

ECharts option [ECharts配置项]


option = {

}

Other comments [其他信息]


enhancement

Most helpful comment

和 #9085 相似,都需要扇形图支持圆角。既然要求都人多,这个需求就高优支持一下。

All 32 comments

不支持,后面可能会推出单独的环形图扩展

请问现在支持了吗?

我实现了一下,请看地址:http://www.haorooms.com/post/canvas_yuanjiaohuanx

@confidence68 你这个跟echarts没关系

请问现在支持了吗?

同问

和 #9085 相似,都需要扇形图支持圆角。既然要求都人多,这个需求就高优支持一下。

@Ovilia 请问现在支持了吗?啥情况了呀

@Ovilia zrender这个是不是应该调用圆环的api啊,这样的就可以加圆角。
但现在是调用的扇形的api,就没办法去画圆角了

@cuijian-dexter 是的,需要 zrender 扇形支持圆角。这个需求会高优一下。

强烈要求或者需求 这个功能的实现,或者单独出一个圆环的type吧,因为用graphic或者custom的时候,入场动画啥的都不好弄 ;
即使在极坐标下的柱形图,圆角设置也没有作用~~~

@AaronAlphabet 强烈支持。

现在还没支持?

@Ovilia @AaronAlphabet 在 polar bar 里面支持

itemStyle: {
    barBorderRadius: '50%'
}

能解决这个问题么?
(polar bar 是指的类似:http://echarts.baidu.com/examples/editor.html?c=bar-polar-stack

仪表盘、环形能支持吗?楼上说的polar bar好像现在还不支持

@100pah ,下面是我测试的option,你可以看看,应该是不支持,如果支持,请把你的option 贴一下,谢谢 ^_^,有时候很需要这个功能。

app.title = '极坐标系下的堆叠柱状图';

option = {
    angleAxis: {
    },
    radiusAxis: {
        type: 'category',
        data: ['周一', '周二', '周三', '周四'],
        z: 10
    },
    polar: {
    },
    series: [{
        type: 'bar',
        data: [1, 2, 3, 4],
        coordinateSystem: 'polar',
        name: 'A',
        itemStyle:{
            barBorderRadius:'50%'
        }
    }],
    legend: {
        show: true,
        data: ['A']
    }
};

@Ovilia 请问现在支持了吗?

还没有,这个功能不是很好实现。

最近项目也用到了,然后用d3.js画圆形图+圆角很容易,难度是折线对应文字的实现

有任何进展?

同问有何进展吗?

还没出吗?难受~这个能不能自己画个 canvas集成到ECharts里面~~

不支持,后面可能会推出单独的环形图扩展

什么时候推出环形图???

请问最近有进展吗?

进展如何?

进展如何?

@gaoqiang19514 #11393

还不支持吗?

额,还不支持啊

关心进度

option = {

    title:{
        text:'hhh'
    },
    angleAxis: {
        max: 10,
        axisLine:{
            show:false
        },
        axisLabel:{
            show:false
        },
        splitLine:{
            show:false
        },
        axisTick:{
            show:false
        }
    },
    radiusAxis: {
        type: 'category',
        axisLine:{
            show:false
        }
    },
    polar: {
    },
    series: [{
        type: 'bar',
        data: [, , , 10],
        coordinateSystem: 'polar',
        roundCap: true,
        silent:true,
        legendHoverLink: false,
        name: 'A',
        stack: 'a'
    }, {
        type: 'bar',
        data: [, , , 6],
        roundCap: true,
        silent:true,
        legendHoverLink: false,
        coordinateSystem: 'polar',
        name: 'B',
        stack: 'a'
    }],
    legend: {
        show: true,
        data: ['A', 'B']
    }
};

可以试下,最新echarts-4.5.0版本以上新增roundCap属性

同求

你们楼上还在问的就不看下close的link的吗?
https://github.com/apache/incubator-echarts/pull/11393
请不要只做伸手党

Was this page helpful?
0 / 5 - 0 ratings