Question

我正试图通过波动实现这种饼图设计。正在使用以下颤振软件包：fl_chart。但是，我有一些挑战。

这是我当前的输出：

我在这里无法实现项目间距，就像在预期输出上一样。
如何在显示的项目的底部获得底部？
如何获得图2中所示的指示线？

如果以前有人使用过此软件包，请帮帮我，因为我找不到更好的软件包来满足我的需求。

代码

class _DefaultChartState extends State<DefaultChart> {
  int touchedIndex;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: AspectRatio(
        aspectRatio: 1.2,
        child: PieChart(
          PieChartData(
              pieTouchData: PieTouchData(touchCallback: (pieTouchResponse) {
                setState(() {
                  if (pieTouchResponse.touchInput is FlLongPressEnd ||
                      pieTouchResponse.touchInput is FlPanEnd) {
                    touchedIndex = -1;
                  } else {
                    touchedIndex = pieTouchResponse.touchedSectionIndex;
                  }
                });
              }),
              borderData: FlBorderData(
                show: false,
              ),
              sectionsSpace: 0,
              centerSpaceRadius: 40,
              sections: showingSections()),
        ),
      ),
    );
  }
}

更新尝试设置设置sectionsSpace: 2，但出现编译错误

错误

D/skia    (13421): Shader compilation error
D/skia    (13421): ------------------------
D/skia    (13421):    1 #version 300 es
D/skia    (13421):    2 
D/skia    (13421):    3 #extension GL_EXT_shader_framebuffer_fetch : require
D/skia    (13421):    4 precision mediump float;
D/skia    (13421):    5 precision mediump sampler2D;
D/skia    (13421):    6 inout mediump vec4 sk_FragColor;
D/skia    (13421):    7 flat in mediump vec4 vcolor_Stage0;
D/skia    (13421):    8 in highp float vcoverage_Stage0;
D/skia    (13421):    9 mediump vec4 blend_src_out(mediump vec4 src, mediump vec4 dst) {
D/skia    (13421):   10     return (1.0 - dst.w) * src;
D/skia    (13421):   11 }
D/skia    (13421):   12 void main() {
D/skia    (13421):   13     mediump vec4 outputColor_Stage0;
D/skia    (13421):   14     mediump vec4 outputCoverage_Stage0;
D/skia    (13421):   15     {
D/skia    (13421):   16         outputColor_Stage0 = vcolor_Stage0;
D/skia    (13421):   17         highp float coverage = vcoverage_Stage0;
D/skia    (13421):   18         outputCoverage_Stage0 = vec4(coverage);
D/skia    (13421):   19     }
D/skia    (13421):   20     {
D/skia    (13421):   21         mediump vec4 _dstColor = sk_FragColor;
D/skia    (13421):   22         sk_FragColor = blend_src_out(outputColor_Stage0, _dstColor);
D/skia    (13421):   23         sk_FragColor = outputCoverage_Stage0 * sk_FragColor + (vec4(1.0) - outputCoverage_Stage0) * _dstColor;
D/skia    (13421):   24     }
D/skia    (13421):   25 }
D/skia    (13421):   26 
D/skia    (13421): Errors:
D/skia    (13421): ERROR: 0:3: 'GL_EXT_shader_framebuffer_fetch' : extension is not supported
D/skia    (13421): ERROR: 0:6: 'inout' : syntax error 
D/skia    (13421):

Answer 1

您设置了sectionsSpace: 0，但您想在各个部分之间留出空间。尝试2（默认）或1.5。更多就是更多空间。
在我阅读文档时，fl_chart会告诉您用户所按下的内容（请参见the docs），但不提供这种风格的指标。您将必须自己编写小部件来编写它，或者找到另一个提供它的库。

我可以用颤振实现这种饼图设计吗？

1 个答案: