仪表图onSelectionChanged不在最后一段的后半段返回原点

时间:2019-06-29 11:19:39

标签: charts flutter gauge

我设法在我的仪表/饼图的每个分段上触发选择点,但是似乎无法弄清楚为什么如果该分段被红色标记所触及,则最终分段仅返回selectedDatum的原因段的区域(请参见屏幕截图)。触摸标记区域之外的最后一段会触发回调,但是返回的数据列表为空。

我已经阅读了Google Charts软件包的文档(数量有限),而且似乎找不到我在做错什么,因此,如果有人能够指出我的错误,那将会是很好。

class GaugeChart extends StatefulWidget {
  final List<charts.Series> seriesList;
  final bool animate;
  final int pos;
  final List<GaugeSegment> segmentList;
  final Function onSegmentTap;

  GaugeChart(this.seriesList, {this.animate, this.pos, this.segmentList, this.onSegmentTap});

  factory GaugeChart.withSegmentData(List<GaugeSegment> list, Function onTap) {

    return new GaugeChart(
      _createSegmentData(list),
      animate: true,
      onSegmentTap: onTap,
    );
  }


  @override
  _GaugeChartState createState() => _GaugeChartState();

  static List<charts.Series<GaugeSegment, String>> _createSegmentData(List<GaugeSegment> list) {
    return [
      new charts.Series<GaugeSegment, String>(
        id: 'Segments',
        domainFn: (GaugeSegment segment, _) => segment.segment,
        measureFn: (GaugeSegment segment, _) => segment.size,
        data: list,
        colorFn: (GaugeSegment segment, _) => charts.Color.fromHex(code: segment.color),
      )
    ];
  }
}

class _GaugeChartState extends State<GaugeChart> {
  @override
  Widget build(BuildContext context) {
    return new charts.PieChart(widget.seriesList,
        animate: widget.animate,
        defaultInteractions: false,
        behaviors: [
          new charts.SelectNearest(
            expandToDomain: true,
            selectClosestSeries: false,
            eventTrigger: charts.SelectionTrigger.tap,
          ),
        ],
        selectionModels: [
          new charts.SelectionModelConfig(
            type: charts.SelectionModelType.info,
            changedListener: _onSelectionChanged,
          )
        ],

        defaultRenderer: new charts.ArcRendererConfig(
          arcWidth: 120, startAngle: 4 / 5 * pi, arcLength: 7 / 5 * pi,
          strokeWidthPx: 0,

          arcRendererDecorators: [
            new charts.ArcLabelDecorator(
                insideLabelStyleSpec: charts.TextStyleSpec(
                  color: charts.Color.fromHex(code: '#FFFFFF'),
                  fontSize: 14,
                )
            )
          ],
        )
    );
  }

  _onSelectionChanged(charts.SelectionModel model) {

    final selectedDatum = model.selectedDatum;

    if (selectedDatum.isNotEmpty) {

      setState(() {
        widget.onSegmentTap(selectedDatum.first.datum.segment, selectedDatum.first.datum.setID);
      });
    }
  }
}




class GaugeSegment {
  final String segment;
  final int size;
  final String color;
  final int setID;

  GaugeSegment(this.segment, this.size, this.color, this.setID);
} 

My score isn't high enough to embed images yet, see it here

0 个答案:

没有答案