Two HiCharts in a Fragment Only one chart is rendering

[santhoshpr]

Hi am facing rendering issue also am getting exception while i try to render hicharts in Fragments

java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first.

` HIChartView hiChartView = binding.lineChart;

    HIOptions options = new HIOptions();

    HIExporting exporting = new HIExporting();
    exporting.setEnabled(false);
    options.setExporting(exporting);

    HIChart chart = new HIChart();
    chart.setIgnoreHiddenSeries(false);
    options.setChart(chart);

    HITitle title = new HITitle();
    title.setText("");
    options.setTitle(title);

    HIYAxis yAxis = new HIYAxis();
    yAxis.setTitle(title);
    yAxis.getTitle().setText("");
    yAxis.setAccessibility(new HIAccessibility());
    yAxis.getAccessibility().setRangeDescription("Range: 0% to 100%");
    yAxis.setMin(0);

    options.setYAxis(new ArrayList<>(Arrays.asList(yAxis)));

    ArrayList<MeetingTrend> sevenDayTrends = get7DaysData(index);
    ArrayList<String> dates = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        dates.add(sevenDayTrends.get(i).getMeeting_date());
    }
    HIXAxis xAxis = new HIXAxis();
    xAxis.setCategories(dates);
    options.setXAxis(new ArrayList<>(Arrays.asList(xAxis)));

    HILegend legend = new HILegend();
    legend.setEnabled(false);
    options.setLegend(legend);

    HIPlotOptions plotOptions = new HIPlotOptions();
    plotOptions.setSeries(new HISeries());
    plotOptions.getSeries().setLabel(new HILabel());
    plotOptions.getSeries().getLabel().setConnectorAllowed(true);
    plotOptions.getSeries().setPointStart(0);
    options.setPlotOptions(plotOptions);

    HISeries adheranceSeries = new HISeries();
    adheranceSeries.setName("Adherance");
    adheranceSeries.setColor(HIColor.initWithRGB(148, 135, 254));
    ArrayList<Integer> adheranceSeriesData = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        adheranceSeriesData.add(sevenDayTrends.get(i).getAdherance());
    }
    adheranceSeries.setData(adheranceSeriesData);

    HISeries scoreSeries = new HISeries();
    scoreSeries.setName("Score");
    scoreSeries.setColor(HIColor.initWithRGB(255, 166, 123));
    ArrayList<Integer> scoreSeriesData = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        scoreSeriesData.add(sevenDayTrends.get(i).getScore());
    }
    scoreSeries.setData(scoreSeriesData);

    options.setSeries(new ArrayList<>(Arrays.asList(adheranceSeries, scoreSeries)));
    hiChartView.setOptions(options);

    binding.lineChart.addView(hiChartView);`

[soommy12]

Hi @santhoshpr ! Thank you for the question. Please, remove the last line binding.lineChart.addView(hiChartView); - you are trying to add view to itself. hiChartView.setOptions(options) will be enough. You don't event need to allocate separate object. Also you do not need to assing binding.linechart to separate variable. You could do binding.lineChart.setOptions(options) in the end and that would do also. According to the issue title - if you want to have multiple charts you will need to add multiple HIChartView views in your xml layout file.

[santhoshpr]

Hi @soommy12 i tried it by removing both these lines HIChartView hiChartView = binding.lineChart; binding.lineChart.addView(hiChartView); and replaced this hiChartView.setOptions(options) with this binding.lineChart.setOptions(options); i have used only one chartview in the xml but still it is not showing up

this is my whole code actually

` HIOptions options = new HIOptions();

    HIExporting exporting = new HIExporting();
    exporting.setEnabled(false);
    options.setExporting(exporting);

    HIChart chart = new HIChart();
    chart.setIgnoreHiddenSeries(false);
    options.setChart(chart);

    HITitle title = new HITitle();
    title.setText("");
    options.setTitle(title);

    HIYAxis yAxis = new HIYAxis();
    yAxis.setTitle(title);
    yAxis.getTitle().setText("");
    yAxis.setAccessibility(new HIAccessibility());
    yAxis.getAccessibility().setRangeDescription("Range: 0% to 100%");
    yAxis.setMin(0);

    options.setYAxis(new ArrayList<>(Arrays.asList(yAxis)));

    ArrayList<MeetingTrend> sevenDayTrends = get7DaysData(index);
    ArrayList<String> dates = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        dates.add(sevenDayTrends.get(i).getMeeting_date());
    }
    HIXAxis xAxis = new HIXAxis();
    xAxis.setCategories(dates);
    options.setXAxis(new ArrayList<>(Arrays.asList(xAxis)));

    HILegend legend = new HILegend();
    legend.setEnabled(false);
    options.setLegend(legend);

    HIPlotOptions plotOptions = new HIPlotOptions();
    plotOptions.setSeries(new HISeries());
    plotOptions.getSeries().setLabel(new HILabel());
    plotOptions.getSeries().getLabel().setConnectorAllowed(true);
    plotOptions.getSeries().setPointStart(0);
    options.setPlotOptions(plotOptions);

    HISeries adheranceSeries = new HISeries();
    adheranceSeries.setName("Adherance");
    adheranceSeries.setColor(HIColor.initWithRGB(148, 135, 254));
    ArrayList<Integer> adheranceSeriesData = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        adheranceSeriesData.add(sevenDayTrends.get(i).getAdherance());
    }
    adheranceSeries.setData(adheranceSeriesData);

    HISeries scoreSeries = new HISeries();
    scoreSeries.setName("Score");
    scoreSeries.setColor(HIColor.initWithRGB(255, 166, 123));
    ArrayList<Integer> scoreSeriesData = new ArrayList<>();
    for (int i = 0; i < sevenDayTrends.size(); i++) {
        scoreSeriesData.add(sevenDayTrends.get(i).getScore());
    }
    scoreSeries.setData(scoreSeriesData);

    options.setSeries(new ArrayList<>(Arrays.asList(adheranceSeries, scoreSeries)));
    binding.lineChart.setOptions(options);`

[soommy12]

@santhoshpr Hmm, to be honest I copied your options, and used it along with android view binding and the code is working. Since I do not have access to your sevenDayTrends data I put some random integers as series data and did not set categories on x axis. My guess it's something wrong with those. Can you please share sample data you fill your series with (along with your x axis categories list)?

[santhoshpr]

@soommy12 Did u try it in a fragment coz am trying inside fragments actually

[soommy12]

@santhoshpr Yes, I did this in a fragment :)

[santhoshpr]

@soommy12 Am not sure why it is not working on my end even i tried to set the sample data and show the chart but still it is not showing :(

[soommy12]

@santhoshpr As I said, you can share with me sevenDayTrends data set so I can try to create the same example. Also, you can create proof of concept app, share it on github and link it here (or you can just share the code of this app here, it would be one activity, one fragment and fragment layout would have single HIChartView view in it).

[santhoshpr]

@soommy12 Ok i will try to create a sample app of what i have and will share you the github link

Actually what i have is an Activity -> Fragment -> Inside that Fragment I have a tablayout with 3 tabs each with a separate fragments

All the three tabLayout fragments have Charts

I will try to create similiar to what i have and will share you the github project.

[soommy12]

@santhoshpr Great, that would be awesome! I'm waiting then. From what you said I can suggest this: if your tabs in tab layout have height/width set to wrap_content that could be an issue. Try to use a fixed value for one of the dimension (for example: if tabs are set vertically use fixed height for them).

[santhoshpr]

@soommy12 Sure will try with fixed height and will update you thanks for your help it means alot

[MikolajMichalczak]

Closing due to inactivity. Please feel free to reopen the ticket if you have any further questions.