Multiple Charts in one fragment not plotting data

[evivar]

Hi,

I'm using AnyChart into my android app and I have a fragment with three area charts, one for temperature, other for pressure and other for humidity. I have the three into a linear layout and I followed the code snipset of Area chart from this git but when I go to this fragment and wait untill the data is readed from an API using Retrofit2, the only chart which is plotted is the last chart, and I don't know why.

This is my layout:

` <?xml version="1.0" encoding="utf-8" standalone="no"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#00FFFFFF" android:backgroundTint="#00FFFFFF" app:layout_anchorGravity="center_horizontal" tools:context=".presentation.fragments.patientFragments.PatientChartFragment">

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="vertical"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <com.github.florent37.diagonallayout.DiagonalLayout
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:background="#00000000"
        android:elevation="30dp"
        app:diagonal_angle="10"
        app:diagonal_direction="left"
        app:diagonal_position="bottom">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/background"
            android:clipChildren="false"
            android:gravity="center_vertical"
            android:orientation="vertical"
            android:padding="15dp">

            <TextView
                android:id="@+id/chartLbl_Chart"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/muli"
                android:text="@string/fragment_patient_chart_chartLbl_Chart_text"
                android:textColor="#ffffff"
                android:textSize="48sp"
                android:textStyle="bold" />

        </LinearLayout>

    </com.github.florent37.diagonallayout.DiagonalLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <com.anychart.AnyChartView
                android:id="@+id/temperatureGraph_Chart"
                android:layout_width="match_parent"
                android:layout_height="249dp" />

            <ProgressBar
                android:id="@+id/Tprogress_bar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center|center_horizontal|center_vertical"
                android:progressTint="#63B6E2" />

            <Space
                android:layout_width="match_parent"
                android:layout_height="50dp" />

            <com.anychart.AnyChartView
                android:id="@+id/pressureGraph_Chart"
                android:layout_width="match_parent"
                android:layout_height="249dp" />

            <ProgressBar
                android:id="@+id/Pprogress_bar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center|center_horizontal|center_vertical"
                android:progressTint="#63B6E2" />

            <Space
                android:layout_width="match_parent"
                android:layout_height="50dp" />

            <com.anychart.AnyChartView
                android:id="@+id/humidityGraph_Chart"
                android:layout_width="match_parent"
                android:layout_height="249dp" />

            <ProgressBar
                android:id="@+id/Hprogress_bar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center|center_horizontal|center_vertical"
                android:progressTint="#63B6E2" />

            <Space
                android:layout_width="match_parent"
                android:layout_height="50dp" />

        </LinearLayout>
    </ScrollView>

</LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>`

And this is the Java code from the fragment, I read the data with Retrofit2 using AsyncTasks

` public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View v = inflater.inflate(R.layout.fragment_patient_chart, container, false); temperature = new ArrayList<>(); temperatureData = new ArrayList<>(); pressure = new ArrayList<>(); pressureData = new ArrayList<>(); humidity = new ArrayList<>(); humidityData = new ArrayList<>();

    try {
        temperature = new ReadLast48ValuesByIdAndTypeAT(SharedPreferencesManager.getInstance(getContext()).getPatient().getPatientId(), "TMP").execute().get();<-- **This is the AsyncTask for the temperature**
        temperatureAreaGraph = v.findViewById(R.id.temperatureGraph_Chart);
        temperatureAreaGraph.setProgressBar(v.findViewById(R.id.Tprogress_bar));
        plotTemperature(temperatureAreaGraph, temperature, "Temperatura", "ºC");
    } catch (ExecutionException | InterruptedException e) {
        e.printStackTrace();
    }

    try {
        humidity = new ReadLast48ValuesByIdAndTypeAT(SharedPreferencesManager.getInstance(getContext()).getPatient().getPatientId(), "HR").execute().get(); // <-- **This is the AsyncTask for the humidity**
        humidityAreaGraph = v.findViewById(R.id.humidityGraph_Chart);
        humidityAreaGraph.setProgressBar(v.findViewById(R.id.Hprogress_bar));
        plotHumidity(humidityAreaGraph, humidity, "Humedad relativa", "%");
    } catch (ExecutionException | InterruptedException e) {
        e.printStackTrace();
    }
    try {
        pressure = new ReadLast48ValuesByIdAndTypeAT(SharedPreferencesManager.getInstance(getContext()).getPatient().getPatientId(), "PRE").execute().get();<-- **This is the AsyncTask for the pressure**
        pressureAreaGraph = v.findViewById(R.id.pressureGraph_Chart);
        pressureAreaGraph.setProgressBar(v.findViewById(R.id.Pprogress_bar));
        plotPressure(pressureAreaGraph, pressure, "Presión", "hPa");
    } catch (ExecutionException | InterruptedException e) {
        e.printStackTrace();
    }
    return v;
}

// ** This function is the same for the temperature, humidity and pressure, changing only the valueData assignation **
private void plotTemperature(AnyChartView graph, List<Double> values, String name, String units) {
    Cartesian areaChart = AnyChart.area();
    areaChart.animation(true);
    Crosshair crosshair = areaChart.crosshair();
    crosshair.enabled(true);
    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);

    areaChart.title(name);
    if (!values.isEmpty()) {
        List<DataEntry> valueData = new ArrayList<>();
        valueData = temperatureData;
        for (int i = values.size() - 1; i > 0; i--) {
            valueData.add(new CustomDataEntry("-" + i + "H", values.get(i)));
        }
        Set set = Set.instantiate();
        set.data(valueData);
        Mapping series1Map = set.mapAs("{ x: 'x', valuse: 'value' }");
        Area series1 = areaChart.area(series1Map);
        series1.name(name);
        series1.stroke("3 #fff");
        series1.hovered().stroke("3 #fff");
        series1.hovered().markers().enabled(true);
        series1.hovered().markers()
                .type(MarkerType.CIRCLE)
                .size(4d)
                .stroke("1.5 #fff");
        series1.markers().zIndex(100d);
        areaChart.legend().enabled(true);
        areaChart.legend().fontSize(13d);
        areaChart.legend().padding(0d, 0d, 20d, 0d);

        areaChart.xAxis(0).title(false);
        areaChart.yAxis(0).title(name + " " + units);

        areaChart.tooltip()
                .valuePrefix("")
                .valuePostfix(" " + units)
                .displayMode(TooltipDisplayMode.UNION);

        graph.setChart(areaChart);
    }
}`

Thanks

[Shestac92]

@evivar Unfortunately, the only supported approach of showing multiple charts in a single layout is described in the wiki article. We do not guarantee that any other approaches will work.