CODEWITHSUNDEEP
mpandroidchart
A P R
A P R

Reputation: 31

How to highLight the selected value in MPAndroid Line Chart

I have disabled all the values in LineChart using setDrawValues(false). Now I want specific value in Line Chart to be enabled when a user touches on that point. I tried it using highLightVales(), but it didn't work for me.

@Override
    public void onValueSelected(Entry entry, int i, Highlight highlight) { 
        //mchart.setHighlightEnabled(true);
        //mchart.highlightValue(1,1);
        Highlight[] highlights=mchart.getHighlighted();
        mchart.highlightValues(highlights);
    }

Upvotes: 3

Views: 14358

Answers (3)

Khyati Vara
Khyati Vara

Reputation: 1060

To Highlight, selected value in Chart

    @Override
        public void onValueSelected(Entry e, Highlight h) {
            fragmentHomeBinding.lineChart.highlightValue(h);
            Log.d("Highlight", "onValueSelected: " + h.getY());
        }

You can set marker in chart and show selected value in it.

Upvotes: 0

Madhu
Madhu

Reputation: 583

You need to add MarkerView to the LineChart

First create a CustomMarkerView class.

public class CustomMarkerView extends MarkerView {

private TextView tvContent;

public CustomMarkerView (Context context, int layoutResource) {
    super(context, layoutResource);
    // this markerview only displays a textview
    tvContent = (TextView) findViewById(R.id.tvContent);
}

// callbacks everytime the MarkerView is redrawn, can be used to update the
// content (user-interface)
@Override
public void refreshContent(Entry e, Highlight highlight) {
    tvContent.setText("" + e.getVal()); // set the entry-value as the display text
}

@Override
public int getXOffset(float xpos) {
    // this will center the marker-view horizontally
    return -(getWidth() / 2);
}

@Override
public int getYOffset(float ypos) {
    // this will cause the marker-view to be above the selected value
    return -getHeight();
} }

Create a layout in .xml that will represent your marker.

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="40dp"
  android:background="@drawable/markerImage" >

<TextView
    android:id="@+id/tvContent"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:text=""
    android:textSize="12dp"
    android:textColor="@android:color/white"
    android:ellipsize="end"
    android:singleLine="true"
    android:textAppearance="?android:attr/textAppearanceSmall" />

</RelativeLayout>

Finally, set it to the chart

    lineChart.setDrawMarkerViews(true);
    CustomMarkerView customMarkerView = new CustomMarkerView(context, R.layout.custom_marker_view_layout);
    lineChart.setMarkerView(customMarkerView);

And make sure touch is enabled on the chart.

lineChart.setTouchEnabled(true);

And you will get the desired result.

enter image description here

Upvotes: 9

Dantalian
Dantalian

Reputation: 581

I do it like this

@Override public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
    mChart.highlightValue(e.getXIndex(), 0);
}

Upvotes: 1

Related Questions