如何在弹出窗口上显示x和y轴的值

时间:2016-03-07 10:54:11

标签: java android mpandroidchart

如此折线图image所示。如何在弹出窗口上显示x和y轴的值。当我触摸折线图中的节点时,我希望在相应位置上显示具有相应X,Y值的弹出窗口。喜欢上面的图片链接。

final LineChart lineChart = (LineChart) findViewById(R.id.chart);

    XAxis xl = lineChart.getXAxis();
    xl.setPosition(XAxis.XAxisPosition.BOTTOM);
    ArrayList<Entry> entries = new ArrayList<>();
    entries.add(new Entry(4f, 0));
    entries.add(new Entry(8f, 1));
    entries.add(new Entry(6f, 2));
    entries.add(new Entry(2f, 3));
    entries.add(new Entry(18f, 4));
    entries.add(new Entry(9f, 5));

    final LineDataSet dataset = new LineDataSet(entries , "y-axies");
    // creating labels
    final ArrayList<String> labels = new ArrayList<String>();
    labels.add("January");
    labels.add("February");
    labels.add("March");
    labels.add("April");
    labels.add("May");
    labels.add("June");

    LineData data = new LineData(labels, dataset);
    lineChart.setData(data); // set the data and list of lables into chart
    lineChart.setDescription("Description");  // set the description
    dataset.setDrawCubic(true);
    dataset.setDrawFilled(true);
    dataset.setHighlightEnabled(true);
    lineChart.setTouchEnabled(true);
    dataset.setColors(ColorTemplate.COLORFUL_COLORS);
    lineChart.animateY(5000);

1 个答案:

答案 0 :(得分:-1)

如果使用MPAndroidChart库,则可以使用本机MarkerView类实现此目的。您可以在Wiki上找到Github托管项目的描述。

编辑: 我添加了一些信息,我们如何实现这一点: 1.您必须实现MarkerView类,在图表上启用绘制弹出窗口。示例类:

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();
}

2。如果你有这个,接下来你必须定义带有弹出窗口布局的xml文件。示例xml:

<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>

  1. 之后,您只能将自定义类附加到chartView:
  2. CustomMarkerView mv = new CustomMarkerView(Context, R.layout.custom_marker_view_layout); chart.setMarkerView(mv);

    之后,您将在图表上显示完整的功能弹出窗口。链接到网站并提供更多信息:https://github.com/PhilJay/MPAndroidChart/wiki/MarkerView