Add custom style to Flutter graph lines and points

Question

I am using google flutter charts in my application.

I am trying to get a slightly more styled lines and dots in the graphs. Right now, in my series I can only modify single colors and strokes for a given line or point using colorFn or strokeWidthPxFn like so:

List<ChartData> dataToChart) {
    return [
      new charts.Series<ChartData, int>(

        id: 'Line',
        strokeWidthPxFn: (ChartData data, __) => 3,
        colorFn: (ChartData data, __) => _getLineColor(data.axisY),
        domainFn: (ChartData data, _) => data.axisX,
        measureFn: (ChartData data, _) => data.axisY,
        data: dataToChart,
      ),
      new charts.Series<ChartData, int>(
          id: 'Points',
          fillColorFn: (ChartData data, __) => _getPointColor(data.axisY),
          colorFn: (_, __) => charts.MaterialPalette.green.shadeDefault,
          domainFn: (ChartData data, _) => data.axisX,
          measureFn: (ChartData data, _) => data.axisY,
          data: dataToChart)
    ];

But I cannot seem to be able to get some other styles like:

Answer 1

In the case of building graph, you can make a custom graph by using custom painter, For example check out this repo , I built graph using custom painter without using external packages

Link:https://github.com/shashiben/flutter_custom_graph,

I think this repo will be useful

Answer 2

use this SymbolRenderer class, it have paint() function. Or you can refer class SelectionScatterPlotHighlight in the example

UI sample here: https://google.github.io/charts/flutter/example/combo_charts/date_time_line_point although it is basic one.