indratrisnar/d_chart

DChartPieO not show labels

Closed this issue · 14 comments

Paroca72 commented

Hi,

Unfortunately if I try to open the documentation (https://flutterdlux.netlify.app/d_chart/widgets/pie/) I got a "Privacy Error" and the browser not let me go further unless I not disable all the protection.

So, kindly I'm asking here how to show the labels on DChartPieO because by default I not seen them and also using customLabel.
My code:

     List<OrdinalData> ordinalList = widget.data
        .map((e) => OrdinalData(
              domain: e["name"] ?? "",
              measure: (e["value"] ?? "").toString().toDouble("en_UK") ?? 0.0,
            ))
        .toList(growable: false);

    return DChartPieO(
            data: ordinalList,
          );

Thanks for your help

indratrisnar commented
indratrisnar commented
Paroca72 commented

Thanks for the quick reply but as I wrote before I cannot access also to https://dchart.netlify.app/docs/properties/custom-label.
I got always a "Privacy Error" and the browser not let go further.

image
indratrisnar commented
indratrisnar commented
Paroca72 commented

I seen.. very thanks

indratrisnar commented
Paroca72 commented

I tried also in incognito but the issue persists.

      List<OrdinalData> ordinalList = widget.data
        .map((e) => OrdinalData(
              domain: e["name"] ?? "",
              measure: (e["value"] ?? "").toString().toDouble("en_UK") ?? 0.0,
            ))
        .toList(growable: false);

    return DChartPieO(
            data: ordinalList,
            customLabel: (ordinalData, index) {
              return '${ordinalData.domain}: ${ordinalData.measure}';
            },
          );

Still no see any labels.
I already checked the data and "domain" contains text and "measure" a number.
I'm in web.. maybe the issue is only on web.

Thanks

indratrisnar commented

Thanks for the quick reply but as I wrote before I cannot access also to https://dchart.netlify.app/docs/properties/custom-label. I got always a "Privacy Error" and the browser not let go further.

image

usually, u can enter mode advance

Paroca72 commented

Cannot

image

Anyway also using customLabel in web (on mobile idk) labels are not shown.

Thanks

indratrisnar commented

try use this property:

configRenderPie: ConfigRenderPie( arcLabelDecorator: ArcLabelDecorator(), ),

indratrisnar commented

that proeprty is alternatively for show label on Pie. also for style the label.

indratrisnar commented

Tutorial about DChartPie: https://youtu.be/E6E1T_GzlUU

Mapk26 commented

The label problem is connected with various paramters. For example the inner label is not shown if you have high labelPadding. Try this configuration:

final List<OrdinalData> ordinalDataList = [
    OrdinalData(domain: 'Mon', measure: 5, color: AppColors.secondary),
    OrdinalData(domain: 'Tue', measure: 2, color: AppColors.pink),
    OrdinalData(domain: 'Wed', measure: 9, color: AppColors.grey),
    OrdinalData(domain: 'Thu', measure: 15, color: AppColors.blue),
  ];

AspectRatio(
    aspectRatio: 16 / 9,
    child: DChartPieO(
        data: ordinalDataList,
        animate: true,
        animationDuration: const Duration(milliseconds: 1000),
        customLabel: (ordinalData, index) {
          return 'Test';
        },
        configRenderPie: ConfigRenderPie(
          arcWidth: 40,
          arcLength: 2 * pi,
          startAngle: 1 * pi,
          strokeWidthPx: 4,
          arcLabelDecorator: ArcLabelDecorator(
            labelPosition: ArcLabelPosition.auto,
            insideLabelStyle: const LabelStyle(
              color: Colors.white,
              fontSize: 18,
            ),
            outsideLabelStyle: const LabelStyle(
              color: Colors.white,
              fontSize: 16,
            ),
            labelPadding: 2,
            leaderLineStyle: const ArcLabelLeaderLineStyle(
              color: Colors.blue,
              length: 20,
              thickness: 2,
            ),
            showLeaderLines: true,
          ),
        ),
    ),
  ),