Flutter Charts - 标记颜色与系列颜色不匹配答案

【问题标题】：Flutter Charts - marker color not matching series colorFlutter Charts - 标记颜色与系列颜色不匹配
【发布时间】：2021-01-11 04:13:02
【问题描述】：

我正在使用来自 flutter_charts 包的 TimeSeriesChart，并且所选标记的颜色与其对应的线条颜色不匹配。这些数据点后面也没有其他系列的数据。

由于系列是动态的，我设置为 colorFn 使用 math.Random 为每个系列生成随机颜色。

Color((math.Random().nextDouble() * 0xFFFFFF).toInt()).withOpacity(1.0))

不过，我不确定这会如何影响标记，因为该系列是在使用标记之前编译的。这是我用来构建系列的函数以及图表

List<charts.Series<ResultSummary, DateTime>> _createChartData() {
    // create chart map
    Map<String, List<ResultSummary>> chartMap = {};
    ConsumerTargetResults selectedTargetResults = getConsumerTargetResults(resultsPool, [selectedTarget])[0];
    Map<String, Color> promptColorMap = {};
    promptColorMap['Independent'] = Color((math.Random().nextDouble() * 0xFFFFFF).toInt()).withOpacity(1.0);
    promptColorMap.addAll(Map.fromIterable(selectedTargetResults.target.prompts, key: (p) =>
      p.title, value: (p) => Color((math.Random().nextDouble() * 0xFFFFFF).toInt()).withOpacity(1.0))
    );
    promptColorMap.forEach((key, value) {
      List<ResultSummary> resultSummaries = [];
      for (Session s in selectedTargetResults.sessions) {
        ResultSummary tResultSummary = ResultSummary(s.date, 0, value);
        if (s.promptStatsMap[key] != null) tResultSummary.measure = s.promptStatsMap[key];
        resultSummaries.add(tResultSummary);
      }
      chartMap[key] = resultSummaries;
    });

    // implement to chart
    List<charts.Series<ResultSummary, DateTime>> chartDataList = [];
    chartMap.forEach((key, value) {
      chartDataList.add(
        charts.Series<ResultSummary, DateTime>(
        id: key,
        data: value,
        domainFn: (ResultSummary r, _) => r.domain,
        measureFn: (ResultSummary r, _) => r.measure,
        fillColorFn: (ResultSummary r, _) => r.color,
      ));
    });
    return chartDataList;
  }

    Expanded(
      child: Container(
          padding: EdgeInsets.fromLTRB(40.0, 10.0, 40.0, 10.0),
          child: charts.TimeSeriesChart(
            widget.seriesList,
            // animate: widget.animate,
            animate: false,
            behaviors: [ charts.SeriesLegend(
              position: charts.BehaviorPosition.end,
              outsideJustification: charts.OutsideJustification.endDrawArea,
              horizontalFirst: false,
              desiredMaxColumns: 1,
              cellPadding: EdgeInsets.only(right: 4.0, bottom: 4.0),
              entryTextStyle: charts.TextStyleSpec(
                  color: charts.MaterialPalette.purple.shadeDefault,
                  fontFamily: 'Georgia',
                  fontSize: 11),
            )],
            selectionModels: [
              charts.SelectionModelConfig(
                type: charts.SelectionModelType.info,
                changedListener: _onSelectionChanged,
                updatedListener: _onSelectionChanged,
              )
            ],
          )),
    ),

【问题讨论】：

标签： flutter charts

【解决方案1】：

我从图表中删除了 colorFn 字段，这似乎成功了

// implement to chart series
List<charts.Series<ResultSummary, DateTime>> chartDataList = [];
chartMap.forEach((key, value) {
  chartDataList.add(
    charts.Series<ResultSummary, DateTime>(
    id: key,
    data: value,
    domainFn: (ResultSummary r, _) => r.domain,
    measureFn: (ResultSummary r, _) => r.measure,
    // fillColorFn: (ResultSummary r, _) => r.color,
  ));
});

【讨论】：