1

Good morning,

I was trying to implement an AnyChart polar plot in android (https://github.com/AnyChart/AnyChart-Android) which should look something similar to this (https://playground.anychart.com/gallery/Polar_Charts/Line_Polar_Chart). I know this example is in javascript and I am developping it within Android, which is not exactly the same, but to keep a reference of the result I want to achieve is fine.

From that example, I have been struggling to change the xAxis Labels (0°, 30°, ...) to custom made strings, such as ("Zero", "Thirty",...). I didn't manage to find a xAxis label getter which returns the label string (https://api.anychart.com/v8/anychart.core.ui.LabelsFactory#getLabel) but haven't been able to find a label setter...

My aim would be to keep the numerical functionallity of a Anychart polar plot, where a line could be plotted from (45°, value 1) to (45°, value 5) and having displayed chars at the xlabel of the plot, so instead of seeing "45°" to the label, it should say "fourty-five"

Do anyone have any idea if this is achievable? Thank you very much!

Kasım Özdemir
  • 5,414
  • 3
  • 18
  • 35
Ignasi
  • 601
  • 2
  • 10
  • 23

1 Answers1

0

You can achieve that using format() function of the xAxis labels. In the callback function you can implement your own logic on how to translate numbers to words (if, case, hashmap, etc). The snippet describes how to achieve that.

        AnyChartView anyChartView = findViewById(R.id.any_chart_view);

        Polar polar = AnyChart.polar();

        List<DataEntry> data = new ArrayList<>();
        data.add(new ValueDataEntry(0, 10));
        data.add(new ValueDataEntry(15, 8));
        data.add(new ValueDataEntry(30, 12));
        data.add(new ValueDataEntry(45, 11));

        Set set = Set.instantiate();
        set.data(data);
        Mapping series1Data = set.mapAs("{ x: 'x', value: 'value' }");

        polar.line(series1Data);

        Linear scale = Linear.instantiate();
        scale.minimum(0).maximum(360);
        scale.ticks().interval(30);
        polar.xScale(scale);

        polar.xAxis().labels().format("function() {" +
                "if (this.tickValue == 60) return 'sixty';" +
                "if (this.tickValue == 90) return 'ninety';" +
                "if (this.tickValue == 120) return 'hundred twenty';" +
                "return this.tickValue;" +
                "}");

        anyChartView.setChart(polar);

Below is the result: enter image description here

AnyChart Support
  • 3,770
  • 1
  • 10
  • 16
  • Thank you very much AnyChart Support! It worked! May you tell me where could I have found such information in your website support? I searched in multiple places but I couldn't find the appropiate example resource from which to guide myself to achieve it and not "annoy" you in the coding websides. Could it be that Anychart has plenty of examples for "javascript" which might not have been translated to the "android-java" environment? Anyway, as said before, thank you very much for your fast reply and for the solution, which worked charmingly – Ignasi Apr 16 '20 at 09:18
  • All approaches you can check in the official Documentation - https://docs.anychart.com/Quick_Start/Quick_Start Originally, AnyChart library is JS based, but 95% of API is absolutely the same for Android version of the library. It means that you can use absolutely the same tricks, approaches, settings and API. Regarding formatting labels you can check the following guide - https://docs.anychart.com/Common_Settings/Text_Formatters It describes how to format labels using string tokens or callback functions. – AnyChart Support Apr 17 '20 at 02:23