7

I am using MPAndroidChart library.

I wanted to use the CombinedChart to create a Chart like that:

enter image description here

Is that possible? I tried it out but it doesnt seem to work because the entries arent working as i expected. You cant say an entry has value 2 on the x-axis and value 300 on the y-axis. Also i cant create two different y-axis, one for the bars and one for the lines.

Some curious thing is that MPAndroidChart first adds all x-values and after that all y-values and you have no possibility to controll which y-value belongs to which x-value because its just inserting the y-values in order of their appearing and relates it to the next x-value.

Is there some way how i can create such a diagram with MPAndroidChart. I actually dont want to be forced to use Google Charts because of the required internet connection (but creating that kind of diagram would work perfectly with Google Charts).

Philipp Jahoda
  • 50,880
  • 24
  • 180
  • 187
Mulgard
  • 9,877
  • 34
  • 129
  • 232

3 Answers3

5
  • you can have 2 different axes
  • you have control which y-value belongs to which x-value (of course!)
  • check out the combined-chart-example
  • it looks like this:

enter image description here

UPDATE: v3.0.0+

The example for the CombinedChart has been extended, now allowing stacked bars and grouped bars together with other chart types.

The essence of setting data for a CombinedChart is the CombinedData class. It can be populated with various other data, such as LineData, BarData etc:

    CombinedData data = new CombinedData();

    data.setData(generateLineData()); // set LineData...
    data.setData(generateBarData()); // set BarData...
    data.setData(generateBubbleData());
    data.setData(generateScatterData());
    data.setData(generateCandleData());

    chart.setData(data);
    chart.invalidate();

How to create e.g. LineData can be found in the setting data documentation.

Philipp Jahoda
  • 50,880
  • 24
  • 180
  • 187
  • yes i found that. but that just works because you have 12 values for the line diagram and 12 for the bars. if you just have for example 4 for the bars they will be set to jan, feb, mar and apr. even if they belong to jul, sep or okt. do you know what i mean? I guess the big problem with MPAndroidChart is that you cant build a grid and simply set your values using x and y coordinates. – Mulgard Jun 26 '15 at 07:53
  • 2
    That is not correct. If you only have 4 bar-values, they will appear wherever you set their x-index to be. If you set the x index to 0-1-2-3 then yes, they will appear in jan-feb-mar-apr. If you set the x-index to 1-3-7-11 the will appear in feb-apr-aug-dec. – Philipp Jahoda Jun 26 '15 at 08:03
  • oh gosh you are right. i can just put the bar and line data into a list and sort it and take the index in the list. thx – Mulgard Jun 26 '15 at 08:06
  • 2
    There is no content in the **CombinedChart** section: https://github.com/PhilJay/MPAndroidChart/wiki/Setting-Data#combinedchart – ban-geoengineering Jan 04 '17 at 13:05
  • @PhilippJahoda Is it possible to set two different y-axis scales? For instance if the barchart values were between `0-2` vs the values in the picture above the barchart would look very small as compared to the line chart. – Nick Jan 12 '17 at 18:28
  • 6
    As @ban-geoengineering mentioned, the "documentation" you linked to is blank. It has the headline for Combined Chart, but there is nothing in that section. – Bourne Feb 01 '17 at 18:08
  • @PhilippJahoda Is it possible to have the line chart as straight lines in the combined chart? In your example, the line chart is curved as arcs. – Bob Jun 07 '17 at 10:22
  • Thats why links on stackoverflow are a bad idea... Documentation about comnined chart is no more in your links – Waza_Be Apr 23 '19 at 17:12
1

You can create a custom class that extends View and in onDraw method create Rectangles of the required height, width and position for bars. As for the lines well that's obvious, set the stroke to make it more visible.

I have used a custom View to create bars in my app WhiteMarker and lines in Chron.

Mayank
  • 1,364
  • 1
  • 15
  • 29
1

As the accepted aswer has broken links, you should use:

<com.github.mikephil.charting.charts.CombinedChart
        android:id="@+id/chart"/>

In your XML

and then here is some code:

        LineData linearData = new LineData(set1);
        // Set you LinearData

        BarData barData = new BarData(set2);
        // Set you LinearData

        CombinedData data=new CombinedData();
        data.setData(linearData);
        data.setData(barData);

EDIT: Original answer has been modified to reflect what I just wrote. Links have been updated and some code has been added.

Waza_Be
  • 39,407
  • 49
  • 186
  • 260