entronad / graphic

A grammar of data visualization and Flutter charting library.
https://pub.dev/packages/graphic
MIT License
1.61k stars 172 forks source link

Funnel resize not working #225

Closed alhajsidd closed 1 year ago

alhajsidd commented 1 year ago
Chart(
        data: list,
        variables: {
          'key': Variable(
            accessor: (Map map) => map['key'].toString(),
          ),
          'index': Variable(
            accessor: (Map map) => flag--,
            scale: LinearScale(
                max: list.length == 2
                    ? -list.length * 1
                    : list.length == 3
                        ? -list.length * 0.8
                        : -list.length * 0.9,
                min: list.length == 2
                    ? list.length * 0.9
                    : list.length == 3
                        ? list.length * 0.7
                        : list.length * 0.7),
          ),
          'count': Variable(
            accessor: (Map map) => map['count'] as num,
          ),
          'label': Variable(
            accessor: (Map map) => map['label'].toString(),
          ),
        },
        transforms: [
          Sort(
            compare: (a, b) =>
                ((b['index'] as num) - (a['index'] as num)).toInt(),
          ),
        ],
        marks: [
          IntervalMark(
              selected: {
                'tap': {touchedindex}
              },
              label: LabelEncode(encoder: (tuple) {
                return Label(
                  tuple['key'].toString(),
                  LabelStyle(textStyle: TextStyle(color: Colors.transparent)),
                );
              }),
              elevation: ElevationEncode(
                value: 0,
                updaters: {
                  'tap': {true: (_) => 0}
                },
              ),
              shape: ShapeEncode(
                value: list.length != 1
                    ? FunnelShape(labelPosition: 0.5, pyramid: false)
                    : RectShape(
                        labelPosition: 0.5,
                        borderRadius: BorderRadius.all(Radius.zero)),
              ),
              color: ColorEncode(
                variable: 'key',
                updaters: {
                  'tap': {
                    true: (initialValue) => initialValue.withOpacity(0.55)
                  }
                },
                values: widget.colorList ?? Defaults.colors10,
              ),
              modifiers: [SymmetricModifier()],
              size: SizeEncode(
                value: 0,
                updaters: {
                  'tap': {true: (initialValue) => 10}
                },
              ))
        ],
        rebuild: true,
        coord: RectCoord(transposed: true, verticalRange: [1, 0]),
        tooltip: TooltipGuide(
          layer: 1,
          multiTuples: false,
          align: Alignment.center,
          offset: Offset(-38, 0),
          backgroundColor: "#FFFFFF".toColor(0),
          followPointer: [true, false],
          variables: ["count"],
          // renderer: simpleTooltip,
          textStyle: const TextStyle(
              color: AppColors.primaryBlack,
              shadows: [Shadow(color: AppColors.primaryBlack)]),
        ),
        selections: {
          'tap': PointSelection(on: {
            GestureType.scroll,
            GestureType.scaleUpdate,
            GestureType.tapDown,
            GestureType.longPressMoveUpdate
          }, dim: Dim.x)
        },
      )

as you can see I added resize code on this chart but resize is not wokking

size: SizeEncode(
                value: 0,
                updaters: {
                  'tap': {true: (initialValue) => 10}
                },
              )
entronad commented 1 year ago

The size of a funnel bar is always "fulfilling the gap", so that it will looks like a funnel. The size encoding won't work in a funnel shape.