How to reload chart with new data? about anychart-android HOT 19 CLOSED

@trungdn0401
We are glad to notify you that we have updated the library.
Now you can update your data like this using the latest version:

private Set set;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_chart_common);

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

        Cartesian3d column3d = AnyChart.column3d();

        column3d.yScale().stackMode(ScaleStackMode.VALUE);

        column3d.title("Types of Coffee");
        column3d.title().padding(0d, 0d, 15d, 0d);

        List<DataEntry> seriesData = new ArrayList<>();
        seriesData.add(new CustomDataEntry("Espresso", 1, null, null, null, null, null));

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

        Column3d series1 = column3d.column(series1Data);
        series1.name("Espresso");
        series1.fill(new SolidFill("#3e2723", 1d));
        series1.stroke("1 #f7f3f3");
        series1.hovered().stroke("3 #f7f3f3");

        column3d.legend().enabled(true);
        column3d.legend().fontSize(13d);
        column3d.legend().padding(0d, 0d, 20d, 0d);

        column3d.yScale().ticks("[0, 1, 2, 3, 4, 5]");
        column3d.xAxis(0).stroke("1 #a18b7e");
        column3d.xAxis(0).labels().fontSize("#a18b7e");
        column3d.yAxis(0).stroke("1 #a18b7e");
        column3d.yAxis(0).labels().fontColor("#a18b7e");
        column3d.yAxis(0).labels().format("{%Value}{groupsSeparator: }");

        column3d.yAxis(0).title().enabled(true);
        column3d.yAxis(0).title().text("Portions of Ingredients");
        column3d.yAxis(0).title().fontColor("#a18b7e");

        column3d.interactivity().hoverMode(HoverMode.BY_X);

        column3d.tooltip()
               .displayMode(TooltipDisplayMode.UNION)
               .format("{%Value} {%SeriesName}");

        column3d.yGrid(0).stroke("#a18b7e", 1d, null, null, null);
        column3d.xGrid(0).stroke("#a18b7e", 1d, null, null, null);

        anyChartView.setChart(column3d);

        
      Button btnAbc = findViewById(R.id.btnAbc);
      btnAbc.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              List<DataEntry> seriesData = new ArrayList<>();
              seriesData.add(new CustomDataEntry("Espresso", new Random().nextInt(10), new Random().nextInt(10), new Random().nextInt(10), null, null, null));
              set.data(seriesData);
          }
      });
   }

from anychart-android.

@trungdn0401
You can implement a similar chart like this:

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_chart_common);

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

        Cartesian column = AnyChart.column();

        List<DataEntry> seriesData = new ArrayList<>();
        seriesData.add(new CustomDataEntry("1990", 10, 40, 10));
        seriesData.add(new CustomDataEntry("1991", 40, 5, 50));
        seriesData.add(new CustomDataEntry("1992", 80, 50, 30));
        seriesData.add(new CustomDataEntry("1993", 80, 20, 90));
        seriesData.add(new CustomDataEntry("1994", 40, 80, 85));
        seriesData.add(new CustomDataEntry("1995", 15, 50, 60));

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

        Column series1 = column.column(series1Data);
        series1.name("Company 1")
                .color("#00ff00");

        Column series2 = column.column(series2Data);
        series2.name("Company 2")
                .color("#0000ff");

        Column series3 = column.column(series3Data);
        series3.name("Company 3")
                .color("#ffff00");

        column.xAxis(0).orientation(Orientation.TOP)
                .stroke(null)
                .ticks(false);
        column.xGrid(0).enabled(true);

        column.legend(true);
        column.legend()
                .position(Orientation.RIGHT)
                .itemsLayout(LegendLayout.VERTICAL);

        anyChartView.setChart(column);
    }

private class CustomDataEntry extends ValueDataEntry {
    CustomDataEntry(String x, Number value, Number value2, Number value3) {
        super(x, value);
        setValue("value2", value2);
        setValue("value3", value3);
    }
}

from anychart-android.

@trungdn0401
There's no need in recreating chart to apply new data. You can add new data using its API. Please, check this sample, you can use the same approach for your charts.

from anychart-android.

@trungdn0401
Thank you for the screenshot! Now I see all your requirements. Unfortunately, in the current version of the library multi-series chart can be updated with new data only by recreating the chart. The single series chart like Pie and Gauges can be updated without recreating.
Soon we will release a major update of the Android library which will allow updating chart and series data without recreating the chart and many other features and improvements.

from anychart-android.

@trungdn0401
Yes, you can adjust column width by the following line:
column3d.barGroupsPadding(0);

Padding is measured as a ratio to the width of columns (the width is calculated automatically). So, if it is < 1, the space between columns or column groups is less than the width of columns, and vice versa. If padding is set to 0, there is no space between columns/groups, and a negative parameter makes columns overlap each other.

from anychart-android.

@Shestac92
I tried to change all data of chart, but it show wrong result. My code like this (tried from Column3DChartActivity sample).

//test new data
Button btnAbc = findViewById(R.id.btnAbc);
btnAbc.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        List<DataEntry> test = new ArrayList<>();
        test.add(new CustomDataEntry("Espresso", 1, 2, 3, null, null, null));
        test.add(new CustomDataEntry("Doppio", 2, null, null, null, null, null));
        test.add(new CustomDataEntry("Trippio", 3, null, null, null, null, null));
        test.add(new CustomDataEntry("Americano", 1, 3, null, null, null, null));
        test.add(new CustomDataEntry("Cappuchino", 1, null, 1, 2, null, null));
        test.add(new CustomDataEntry("Macchiato", 2.5, null, null, 1, null, null));
        test.add(new CustomDataEntry("Latte", 1, null, 2, 1, null, null));
        test.add(new CustomDataEntry("Latte Macchiato", 1, null, 2, null, 1, null));
        test.add(new CustomDataEntry("Vienna Coffee", 1, null, null, null, 2, null));
        test.add(new CustomDataEntry("Mocco", 1, null, 1, null, 1, 1));
        column3d.setData(test);
    }
});

from anychart-android.

@Shestac92
Thanks in advance!

And, Is there any ways to fixed column width of chart above pls?

from anychart-android.

Hello @Shestac92 ,
How to dismiss progress_bar after update data to chart by above way, or after chart is rendered?

from anychart-android.

@trungdn0401
The progress bar is shown only once when the chart was rendered at the first time.
Do you want to show the progress bar when the chart's data is updating and hide the bar when the chart has been updated?

from anychart-android.

@trungdn0401
The progress bar is shown only once when the chart was rendered at the first time.
Do you want to show the progress bar when the chart's data is updating and hide the bar when the chart has been updated?
@Shestac92
Q1: Yes, hide the bar when the chart has been updated.
Q2: I have 2 charts (3D column and Line) on same layout. I used anyChartView.setChart(column3d) and anyChartView.setChart(line) to change the chart, but it doesn't work, it show white blank on screen? How to change the chart in my case?

from anychart-android.

@trungdn0401

1. Can you provide us with an example or gif how should the progress act?
2. We have just updated the library to handle this issue. Please, update you library and use the following approach:

// remove old chart
anyChartView.clear();

// and only than create a new chart and add to the view
Pie pie = AnyChart.pie();

List<DataEntry> data = new ArrayList<>();
data.add(new ValueDataEntry("Apples", 6371664));
data.add(new ValueDataEntry("Pears", 789622));

pie.data(data);

anyChartView.setChart(pie);

from anychart-android.

@Shestac92
It's show me double charts at 2nd drawing (the 1st drawing is ok) after apply your code: clear -> setChart

Hi @Shestac92 , It's OK if I does not clear, just setChart. Thank you!

from anychart-android.

Hi @Shestac92 ,

Are there anychart like this?

from anychart-android.

@trungdn0401

1. Can you provide us with an example or gif how should the progress act?
2. We have just updated the library to handle this issue. Please, update you library and use the following approach:

// remove old chart
anyChartView.clear();

// and only than create a new chart and add to the view
Pie pie = AnyChart.pie();

List<DataEntry> data = new ArrayList<>();
data.add(new ValueDataEntry("Apples", 6371664));
data.add(new ValueDataEntry("Pears", 789622));

pie.data(data);

anyChartView.setChart(pie);

Hi,
I am using this approach in my chart. but after using it. chart is not showing.
Here is my code

  anyChartView.clear();
    APIlib.getInstance().setActiveAnyChartView(anyChartView);
    
    Cartesian areaChart = AnyChart.area();

    areaChart.animation(true);

    Crosshair crosshair = areaChart.crosshair();
    crosshair.enabled(true);
    // TODO yStroke xStroke in crosshair
    crosshair.yStroke((Stroke) null, null, null, (String) null, (String) null)
            .xStroke("#fff", 1d, null, (String) null, (String) null)
            .zIndex(39d);
    crosshair.yLabel(0).enabled(true);

    areaChart.yScale().stackMode(ScaleStackMode.VALUE);

    List<DataEntry> seriesData = new ArrayList<>();
    for (int i = 0; i < reinsuranceGraphPojo.getChart().size(); i++) {
        seriesData.add(new CustomDataEntry(reinsuranceGraphPojo.getChart().get(i).getYear(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayM1(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayM2(),reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayM3(),reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayM4(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayB1(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayB2(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayB3(), reinsuranceGraphPojo.getChart().get(i).getLimitReducedByPrepayB4(),reinsuranceGraphPojo.getChart().get(i).getCumloss()));

    }



    Set set = Set.instantiate();
    set.data(seriesData);

    Mapping series1Data = set.mapAs("{ x: 'x', value: 'value' }");
    Mapping series2Data = set.mapAs("{ x: 'x', value: 'value2' }");
    Mapping series3Data = set.mapAs("{ x: 'x', value: 'value3' }");
    Mapping series4Data = set.mapAs("{ x: 'x', value: 'value4' }");
    Mapping series5Data = set.mapAs("{ x: 'x', value: 'value5' }");
    Mapping series6Data = set.mapAs("{ x: 'x', value: 'value6' }");
    Mapping series7Data = set.mapAs("{ x: 'x', value: 'value7' }");
    Mapping series8Data = set.mapAs("{ x: 'x', value: 'value8' }");
    Mapping jumpLineData = set.mapAs("{ x: 'x', value: 'jumpLine' }");

    Line jumpLine = areaChart.line(jumpLineData);
    jumpLine.stroke("2 #7700ce");
    jumpLine.labels().enabled(false);

    Area series1 = areaChart.area(series1Data);
    series1.name("M1");
    series1.normal().fill("#11e200", 0.3);
    series1.markers().zIndex(100d);

    Area series2 = areaChart.area(series2Data);
    series2.name("M2");
    series2.stroke("3 #fff");
    series2.hovered().stroke("3 #fff");
    series2.hovered().markers().enabled(true);
    series2.hovered().markers().type(MarkerType.CIRCLE).size(4d).stroke("1.5 #fff");
    series2.normal().fill("#18a5d2", 0.3);
    series2.markers().zIndex(100d);

    Area series3 = areaChart.area(series3Data);
    series3.name("M3");
    series3.stroke("3 #fff");
    series3.hovered().stroke("3 #fff");
    series3.hovered().markers().enabled(true);
    series3.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series3.normal().fill("#e91c73", 0.3);

    series3.markers().zIndex(100d);

    Area series4 = areaChart.area(series4Data);
    series4.name("M4");
    series4.stroke("3 #fff");
    series4.hovered().stroke("3 #fff");
    series4.hovered().markers().enabled(true);
    series4.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series4.normal().fill("#ffae0b", 0.3);
    series4.markers().zIndex(100d);

    Area series5 = areaChart.area(series5Data);
    series5.name("M5");
    series5.stroke("3 #fff");
    series5.hovered().stroke("3 #fff");
    series5.hovered().markers().enabled(true);
    series5.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series5.normal().fill("#11e200", 0.3);
    series5.markers().zIndex(100d);
    Area series6 = areaChart.area(series6Data);
    series6.name("M6");
    series6.stroke("3 #fff");
    series6.hovered().stroke("3 #fff");
    series6.hovered().markers().enabled(true);
    series6.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series6.normal().fill("#18a5d2", 0.3);
    series6.markers().zIndex(100d);

    Area series7 = areaChart.area(series7Data);
    series7.name("M7");
    series7.stroke("3 #fff");
    series7.hovered().stroke("3 #fff");
    series7.hovered().markers().enabled(true);
    series7.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series7.normal().fill("#e91c73", 0.3);
    series7.markers().zIndex(100d);

    Area series8 = areaChart.area(series8Data);
    series8.name("M8");
    series8.stroke("3 #fff");
    series8.hovered().stroke("3 #fff");
    series8.hovered().markers().enabled(true);
    series8.hovered().markers()
            .type(MarkerType.CIRCLE)
            .size(4d)
            .stroke("1.5 #fff");
    series8.normal().fill("#ffae0b", 0.3);
    series8.markers().zIndex(100d);




    areaChart.legend().enabled(false);
    areaChart.legend().fontSize(13d);
    areaChart.legend().padding(0d, 0d, 20d, 0d);

    areaChart.xAxis(0).title(false);
    areaChart.interactivity().hoverMode(HoverMode.BY_X);

    anyChartView.setChart(areaChart);

from anychart-android.

@trungdn0401
We are glad to notify you that we have updated the library.
Now you can update your data like this using the latest version:

private Set set;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_chart_common);

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

        Cartesian3d column3d = AnyChart.column3d();

        column3d.yScale().stackMode(ScaleStackMode.VALUE);

        column3d.title("Types of Coffee");
        column3d.title().padding(0d, 0d, 15d, 0d);

        List<DataEntry> seriesData = new ArrayList<>();
        seriesData.add(new CustomDataEntry("Espresso", 1, null, null, null, null, null));

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

        Column3d series1 = column3d.column(series1Data);
        series1.name("Espresso");
        series1.fill(new SolidFill("#3e2723", 1d));
        series1.stroke("1 #f7f3f3");
        series1.hovered().stroke("3 #f7f3f3");

        column3d.legend().enabled(true);
        column3d.legend().fontSize(13d);
        column3d.legend().padding(0d, 0d, 20d, 0d);

        column3d.yScale().ticks("[0, 1, 2, 3, 4, 5]");
        column3d.xAxis(0).stroke("1 #a18b7e");
        column3d.xAxis(0).labels().fontSize("#a18b7e");
        column3d.yAxis(0).stroke("1 #a18b7e");
        column3d.yAxis(0).labels().fontColor("#a18b7e");
        column3d.yAxis(0).labels().format("{%Value}{groupsSeparator: }");

        column3d.yAxis(0).title().enabled(true);
        column3d.yAxis(0).title().text("Portions of Ingredients");
        column3d.yAxis(0).title().fontColor("#a18b7e");

        column3d.interactivity().hoverMode(HoverMode.BY_X);

        column3d.tooltip()
               .displayMode(TooltipDisplayMode.UNION)
               .format("{%Value} {%SeriesName}");

        column3d.yGrid(0).stroke("#a18b7e", 1d, null, null, null);
        column3d.xGrid(0).stroke("#a18b7e", 1d, null, null, null);

        anyChartView.setChart(column3d);

        
      Button btnAbc = findViewById(R.id.btnAbc);
      btnAbc.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              List<DataEntry> seriesData = new ArrayList<>();
              seriesData.add(new CustomDataEntry("Espresso", new Random().nextInt(10), new Random().nextInt(10), new Random().nextInt(10), null, null, null));
              set.data(seriesData);
          }
      });
   }

Hi everybody. When I use the code in fragment then It's not working when the add new data

from anychart-android.

@Shestac92 I can't reload new data when it's action in fragment class. please help me. thanks so much

from anychart-android.

@trungdn0401
We are glad to notify you that we have updated the library.
Now you can update your data like this using the latest version:

private Set set;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_chart_common);

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

        Cartesian3d column3d = AnyChart.column3d();

        column3d.yScale().stackMode(ScaleStackMode.VALUE);

        column3d.title("Types of Coffee");
        column3d.title().padding(0d, 0d, 15d, 0d);

        List<DataEntry> seriesData = new ArrayList<>();
        seriesData.add(new CustomDataEntry("Espresso", 1, null, null, null, null, null));

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

        Column3d series1 = column3d.column(series1Data);
        series1.name("Espresso");
        series1.fill(new SolidFill("#3e2723", 1d));
        series1.stroke("1 #f7f3f3");
        series1.hovered().stroke("3 #f7f3f3");

        column3d.legend().enabled(true);
        column3d.legend().fontSize(13d);
        column3d.legend().padding(0d, 0d, 20d, 0d);

        column3d.yScale().ticks("[0, 1, 2, 3, 4, 5]");
        column3d.xAxis(0).stroke("1 #a18b7e");
        column3d.xAxis(0).labels().fontSize("#a18b7e");
        column3d.yAxis(0).stroke("1 #a18b7e");
        column3d.yAxis(0).labels().fontColor("#a18b7e");
        column3d.yAxis(0).labels().format("{%Value}{groupsSeparator: }");

        column3d.yAxis(0).title().enabled(true);
        column3d.yAxis(0).title().text("Portions of Ingredients");
        column3d.yAxis(0).title().fontColor("#a18b7e");

        column3d.interactivity().hoverMode(HoverMode.BY_X);

        column3d.tooltip()
               .displayMode(TooltipDisplayMode.UNION)
               .format("{%Value} {%SeriesName}");

        column3d.yGrid(0).stroke("#a18b7e", 1d, null, null, null);
        column3d.xGrid(0).stroke("#a18b7e", 1d, null, null, null);

        anyChartView.setChart(column3d);

        
      Button btnAbc = findViewById(R.id.btnAbc);
      btnAbc.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              List<DataEntry> seriesData = new ArrayList<>();
              seriesData.add(new CustomDataEntry("Espresso", new Random().nextInt(10), new Random().nextInt(10), new Random().nextInt(10), null, null, null));
              set.data(seriesData);
          }
      });
   }

It does not work for me.

from anychart-android.

Hi, i'm using vertical chart. the data doesn't update after changing from API. Thanks

from anychart-android.

Same issue

from anychart-android.