MPAndroidChart折线图自定义高亮显示可绘制

我正在使用MPAndroid图表库在我的Android应用程序中绘制折线图。图形的状态如下所示：

我想这样改变它：

Bitmap starBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.star);
mChart.setRenderer(new ImageLineChartRenderer(mChart, mChart.getAnimator(), mChart.getViewPortHandler(), starBitmap));

所以我想改变MPAnroid折线图的点，在图库中称为“圆孔”。我想把这个洞换成可拉拔的。我有办法做到吗

圆孔更改代码如下所示：

LineDataSet set1 = new LineDataSet(yVals, "DataSet 1");
set1.setDrawCircleHole( true );
set1.setCircleColor( Color.BLACK );

---

这里有库参考：

自3.0版以来，您可以提供自己的自定义图像，该图像将在选择图表上的给定点时显示。以下说明按照

LineDataSet set1 = new LineDataSet(yVals, "DataSet 1");
set1.setDrawCircleHole( true );
set1.setCircleColor( Color.BLACK );

总之，现在可以使用名为

MarkerImage

的类：

MarkerImage myMarkerImage = new MarkerImage(this, R.drawable.my_drawable);

然后：

要调整图像的位置，可以调用：

setOffset(float x, float y);

如果您不想使用

MarkerView

，您可能需要创建自己的子类，并添加逻辑来绘制自定义高亮显示可绘制

以下是一个非常基本的概念证明：

import android.graphics.Bitmap;
import android.graphics.Canvas;

import com.github.mikephil.charting.animation.ChartAnimator;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.highlight.Highlight;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.renderer.LineChartRenderer;
import com.github.mikephil.charting.utils.Transformer;
import com.github.mikephil.charting.utils.ViewPortHandler;

import java.util.List;

/**
 * Created by David on 3/01/2017.
 */

public class ImageLineChartRenderer extends LineChartRenderer {

    private final LineChart lineChart;
    private final Bitmap image;

    public ImageLineChartRenderer(LineChart chart, ChartAnimator animator, ViewPortHandler viewPortHandler, Bitmap image) {
        super(chart, animator, viewPortHandler);
        this.lineChart = chart;
        this.image = image;
    }

    @Override
    public void drawExtras(Canvas c) {
        super.drawExtras(c);

        Highlight[] highlighted = lineChart.getHighlighted();
        if (highlighted == null) return;

        float phaseY = mAnimator.getPhaseY();

        float[] imageBuffer = new float[2];
        imageBuffer[0] = 0;
        imageBuffer[1] = 0;
        LineData lineData = mChart.getLineData();
        List<ILineDataSet> dataSets = mChart.getLineData().getDataSets();

        Bitmap[] scaledBitmaps = new Bitmap[dataSets.size()];
        float[] scaledBitmapOffsets = new float[dataSets.size()];
        for (int i = 0; i < dataSets.size(); i++) {
            float imageSize = dataSets.get(i).getCircleRadius() * 10;
            scaledBitmapOffsets[i] = imageSize / 2f;
            scaledBitmaps[i] = scaleImage((int) imageSize);
        }

        for (Highlight high : highlighted) {
            int dataSetIndex = high.getDataSetIndex();
            ILineDataSet set = lineData.getDataSetByIndex(dataSetIndex);
            Transformer trans = lineChart.getTransformer(set.getAxisDependency());

            if (set == null || !set.isHighlightEnabled())
                continue;

            Entry e = set.getEntryForXValue(high.getX(), high.getY());

            if (!isInBoundsX(e, set))
                continue;

            imageBuffer[0] = e.getX();
            imageBuffer[1] = e.getY() * phaseY;
            trans.pointValuesToPixel(imageBuffer);

            c.drawBitmap(scaledBitmaps[dataSetIndex],
                    imageBuffer[0] - scaledBitmapOffsets[dataSetIndex],
                    imageBuffer[1] - scaledBitmapOffsets[dataSetIndex],
                    mRenderPaint);
        }
    }

    private Bitmap scaleImage(int radius) {
        return Bitmap.createScaledBitmap(image, radius, radius, false);
    }
}

说明：

LineChartRenderer

中的

drawerxtras

绘制圆。我们仍然需要这些，因此在我们的

drawerxtras

override中，我们首先调用super。然后，我们为每个数据集生成一个缩放位图（数据集可能具有不同的圆半径）。我们将位图缩放到任意大小（圆半径的10倍）。然后，我们迭代通过渲染器的线条图字段显示的高光，并绘制适当的位图

这是一个屏幕截图-您可以看到“星形”位图，而不是突出显示索引上的圆圈：

---

您所说的“将此孔切换为可拉伸”是什么意思？你想要你自己的可绘制而不是圆形孔吗？你找到改变突出显示可绘制的解决方案了吗？@Massimo请查看我的更新答案，其中包括示例代码谢谢@David Rawson，你救了我！myChart.setMarker（myMarkerImage）；它对我不起作用，它会覆盖我的MarkerView，我尝试你的基本概念证明，它起作用，尽管对我来说很难。谢谢。有关如何编写自定义渲染器的更多信息，请回答这个问题：已经很长时间了，您仍然可以共享信息，谢谢@徐博俊 不客气！我很高兴它有帮助-只是链接了关于自定义渲染器的问题