MPAndroidChart中k线图自定义x轴标签。

作者: 想要去远方的人 | 来源:发表于2019-10-24 11:49 被阅读0次

    本文链接:https://www.jianshu.com/p/65fcc31b1f5f

    首先上效果图,避免大家走错地方了。

    效果图

    前言

    由于该库获取X轴顶部和底部只能显示相同的数据,不能改变数据和加图标,而需求又需要加其他数据和图标变化显示,X轴上下都需要显示数据和图标。该库没有提供,搜了一些资料都没有,所以就自己动手,记录一下。


    1.在XAxisRenderer这个类中找到了renderAxisLabels(Canvas c) 绘制X轴的方法

    找到了在哪里绘制的这就好办了,然后顺腾摸瓜找到绘制每一个数据的方法

    发现在红圈标注的地方设置了Paint

    找到了这些我们就可以动手试着去改了,上代码

    自定义了它的XAxisRenderer

    ,

    下面付带完整MyXAxisRenderer的代码



    public class MyXAxisRenderer extends XAxisRenderer {

        public MyXAxisRenderer(ViewPortHandler viewPortHandler, XAxis xAxis, Transformer trans) {

            super(viewPortHandler, xAxis, trans);

        }

    //    renderAxisLabels

        @Override

        public void renderAxisLabels(Canvas c) {

            super.renderAxisLabels(c);

            if (isDrawTop) {

                float yoffset = mXAxis.getYOffset() + ScreenTool.dip2px(10);

                MPPointF pointF = MPPointF.getInstance(0, 0);

                drawOtherLabel(c, mViewPortHandler.contentTop() - yoffset, pointF);

            }

    }

        //画其他的x  轴数字

        private void drawOtherLabel(Canvas c, float pos, MPPointF anchor) {

            final float labelRotationAngleDegrees = mXAxis.getLabelRotationAngle();

            boolean centeringEnabled = mXAxis.isCenterAxisLabelsEnabled();

            float[] positions = new float[mXAxis.mEntryCount* 2];

            for (int i= 0; i< positions.length; i+= 2) {

                // only fill x values

                if (centeringEnabled) {

                    positions[i] = mXAxis.mCenteredEntries[i/ 2];

                } else {

                    positions[i] = mXAxis.mEntries[i/ 2];

                }

    }

            mTrans.pointValuesToPixel(positions);

            for (int i= 0; i< positions.length; i+= 2) {

                float x= positions[i];

                if (mViewPortHandler.isInBoundsX(x)) {

                    String val = mXAxis.getValueFormatter().getFormattedValue(mXAxis.mEntries[i/ 2], mXAxis);

                    if (mAxis.mEntries[i/ 2] < lineData.size()) {

                        if ((int) mXAxis.mEntries[i/ 2] != 0) {

                            String label= lineData.get((int) mXAxis.mEntries[i/ 2]).getWendu();

                            if (label== null || label.equals("")) {

                                label= "";

                            } else {

                                label+= "°C";

                            }

                            if (mXAxis.isAvoidFirstLastClippingEnabled()) {

                                // avoid clipping of the last

                                if (i== mXAxis.mEntryCount- 1 && mXAxis.mEntryCount> 1) {

                                    float width = Utils.calcTextWidth(mAxisLabelPaint, label);

                                    if (width > mViewPortHandler.offsetRight() * 2

                                            && x+ width > mViewPortHandler.getChartWidth())

                                        x-= width / 2;

                                    // avoid clipping of the first

                                } else if (i== 0) {

                                    float width = Utils.calcTextWidth(mAxisLabelPaint, label);

                                    x+= width / 2;

                                }

    }

                            mAxisLabelPaint.setColor(mXAxis.getTextColor());

                            int mBitWidth = ScreenTool.dip2px(20);

                            int mBitHeight = mBitWidth;

                            Paint mBitPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

                            mBitPaint.setFilterBitmap(true);

                            mBitPaint.setDither(true);

                            if (weatherIcons.containsKey(lineData.get((int) mXAxis.mEntries[i/ 2]).getTianqi())) {

                                int res = weatherIcons.get(lineData.get((int) mXAxis.mEntries[i/ 2]).getTianqi());

                                Bitmap mBitmap = ((BitmapDrawable) MyApp.getInstance().getResources().getDrawable(res)).getBitmap();

                                Bitmap bi = Bitmap.createScaledBitmap(mBitmap, mBitWidth, mBitHeight, true);

                                float bitmapX= x- mBitWidth - ScreenTool.dip2px(3);

                                if (label.equals("")) {

                                    bitmapX= x;

                                }

                                c.drawBitmap(bi, bitmapX, pos -ScreenTool.dip2px(5) , null);

                            }

                            String wendu = lineData.get((int) mXAxis.mEntries[i/ 2]).getWendu();

                            if (wendu != null && !wendu.equals("")) {

                                int temp = Integer.valueOf(wendu);

                                if (temp <= 18) {

                                    mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_blue));

                                } else if (temp > 18 && temp < 22) {

                                    mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_green));

                                } else if (temp >= 22 && temp < 25) {

                                    mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.main_orange_color));

                                } else {

                                    mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_red));

                                }

    }

                            if (label!= null) {

                                drawLabel(c, label, x, pos, anchor, labelRotationAngleDegrees);

                            }

    }

    }

    }

    }

    }

        public void setWeatherTemp(List<HistoryGradeInfo> lineData) {

            weatherIcons.put("晴", R.drawable.ic_weather_sunny);

            weatherIcons.put("阴", R.drawable.ic_weather_blue_yin_day);

            weatherIcons.put("雨", R.drawable.ic_weather_blue_rain_day);

            weatherIcons.put("雪", R.drawable.ic_weather_blue_snow_day);

            this.lineData= new ArrayList<>();

            HistoryGradeInfo hi = new HistoryGradeInfo();

            hi.setTianqi("");

            hi.setWendu("");

            this.lineData.add(hi);

            for (HistoryGradeInfo item : lineData) {

                this.lineData.add(item);

            }

    }

        public void setDrawTop(boolean isDrawTop) {

            this.isDrawTop= isDrawTop;

        }

        private boolean isDrawTop= false;

        private List<HistoryGradeInfo> lineData;

        private HashMap<String, Integer> weatherIcons= new HashMap<>();

    }


    在LineChart中使用MyXAxisRenderer


    public class MyLineChart extends LineChart {

        public MyLineChart(Context context) {

            super(context);

        }

        public MyLineChart(Context context, AttributeSet attrs) {

            super(context, attrs);

        }

        public MyLineChart(Context context, AttributeSet attrs, int defStyle) {

            super(context, attrs, defStyle);

        }

        @Override

        protected void init() {

            super.init();

            mXAxisRenderer= new MyXAxisRenderer(mViewPortHandler, mXAxis, mLeftAxisTransformer);

        }

      public MyXAxisRenderer getMyXAxisRenderer(){

            return (MyXAxisRenderer) mXAxisRenderer;

      }

    }

    在项目中引用自己修改过的MyLineChart

            获取lineChart对象开启绘制顶部数据和设置顶部的数据 和修改里面的颜色

    参考  daio_odai 的帖子: https://blog.csdn.net/daio_odai/article/details/84106099 

         终于写完了,这是我第一次写文章,有的还不知道怎么使用,可能读起来会很吃力,有什么好的建议希望能提出来,我会尽快去提示自己表述和编辑这方面的能力,最后,希望这篇文章能帮到有需要的小伙伴。

      如有什么疑问大家可以加我qq:549813516 或邮箱私信我:im.wyu@qq.com

    相关文章

      网友评论

        本文标题:MPAndroidChart中k线图自定义x轴标签。

        本文链接:https://www.haomeiwen.com/subject/mutisctx.html