MpAndroidChart實(shí)現(xiàn)多點(diǎn)的特殊標(biāo)記

最近在開發(fā)時遇到這樣一種需求两残,為一些特殊點(diǎn)顯示標(biāo)簽忌栅,類似默認(rèn)顯示多個markview。如下圖(demo):

image

在網(wǎng)上并沒有相關(guān)資料,在此做下記錄分享

下面上代碼:

首先創(chuàng)建一個類繼承LineChart,重寫init()方法:

@Override
protected void init() {
    super.init();
    //獲取屏幕寬度,上圖最邊上標(biāo)簽跳仿,會根據(jù)屏幕寬度適配
    WindowManager wm = (WindowManager) getContext().getSystemService(Context.WINDOW_SERVICE);
    DisplayMetrics metrics = new DisplayMetrics();
    wm.getDefaultDisplay().getMetrics(metrics);
    mRenderer = new HbFundLineChartRenderer(this, mAnimator, mViewPortHandler, metrics.widthPixels);
}

接下來是主要內(nèi)容,也就是自己實(shí)現(xiàn)的LineChartRenderer即渲染器,用來畫點(diǎn)捐晶、線等.
首先是一些變量,分別是標(biāo)記控件的寬高邊距等,這里寫的是一些根據(jù)我們需求來的默認(rèn)值:

private int mWidth;//屏幕寬度,在構(gòu)造方法中傳進(jìn)來賦值
private float hViewLength = Utils.convertDpToPixel(30f);//vie寬30dp
private float vViewLength = Utils.convertDpToPixel(20f);//view高20dp
private float viewRect= Utils.convertDpToPixel(4f);//矩形高低差

然后,在LineChartRenderer中有一個drawValues,它是主要負(fù)責(zé)根據(jù)值來畫點(diǎn)的,我們要做的就是在super()之后加上我們自己的東西:

@Override
public void drawValues(Canvas c) {
    super.drawValues(c);
    if (isShowLabel) {
        LineDataSet dataSetByIndex = (LineDataSet) mChart.getLineData().getDataSetByIndex(0);
        Transformer trans = mChart.getTransformer(dataSetByIndex.getAxisDependency());
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);//抗鋸齒畫筆
        paint.setTextSize(Utils.convertDpToPixel(textSixe));//設(shè)置字體大小

        //畫首中尾三個label
        float[] firstFloat = getFloat(dataSetByIndex.getValues(), 0);//根據(jù)數(shù)據(jù)集獲取點(diǎn)
        drawPointLabel(trans, paint, c, firstFloat);
        float[] middleFloat = getFloat(dataSetByIndex.getValues(), (dataSetByIndex.getValues().size() - 1) / 2);
        drawPointLabel(trans, paint, c, middleFloat);
        float[] endFloat = getFloat(dataSetByIndex.getValues(), dataSetByIndex.getValues().size() - 1);
        drawPointLabel(trans, paint, c, endFloat);
    }
}

首先獲取點(diǎn)的數(shù)據(jù)集,然后得到Transformer,它可以根據(jù)點(diǎn)數(shù)據(jù)集里的某一點(diǎn)來得到這個點(diǎn)在屏幕中的位置
然后分別傳入transformer惑灵、畫筆、畫布對象佩憾、點(diǎn),進(jìn)行繪制:

private void drawPointLabel(Transformer trans, Paint paint, Canvas c, float[] floatPosition) {
    MPPointD maxPoint = trans.getPixelForValues(floatPosition[0], floatPosition[1]);
    float highX = (float) maxPoint.x;
    float highY = (float) maxPoint.y;
    TextView view = (TextView) LayoutInflater.from(mContext).inflate(R.layout.mark_view, null, false);
    if (highX > mWidth - mWidth / 4) {//標(biāo)識朝左
        view.setBackgroundResource(R.mipmap.sm_lable_bg_buy_r);
        Bitmap bitmap = createBitmap(view, (int) hViewLength, (int) vViewLength);
        c.drawBitmap(bitmap, (int) (highX - hViewLength), (int) (highY - vViewLength - viewRect), paint);
    } else if (highX < mWidth / 4) {//標(biāo)識朝右
        view.setBackgroundResource(R.mipmap.sm_lable_bg_buy_l);
        Bitmap bitmap = createBitmap(view, (int) hViewLength, (int) vViewLength);
        c.drawBitmap(bitmap, (int) (highX), (int) (highY - vViewLength - viewRect), paint);
    } else {//標(biāo)識居中
        view.setBackgroundResource(R.mipmap.sm_lable_bg_buy_c);
        Bitmap bitmap = createBitmap(view, (int) hViewLength, (int) vViewLength);
        c.drawBitmap(bitmap, (int) (highX - hViewLength / 2), (int) (highY - vViewLength - viewRect), paint);
    }
}

此處鸯屿,我們隨意定義幾個點(diǎn),可以根據(jù)實(shí)際需求進(jìn)行設(shè)置:

private float[] getFloat(List<Entry> lists, int index) {
    float[] maxEntry = new float[2];
    maxEntry[0] = lists.get(index).getX();
    maxEntry[1] = lists.get(index).getY();
    return maxEntry;
}

view轉(zhuǎn)bitmap方法如下:

private Bitmap createBitmap(View v, int width, int height) {
    //測量使得view指定大小
    int measuredWidth = View.MeasureSpec.makeMeasureSpec(width, View.MeasureSpec.EXACTLY);
    int measuredHeight = View.MeasureSpec.makeMeasureSpec(height, View.MeasureSpec.EXACTLY);
    v.measure(measuredWidth, measuredHeight);
    //調(diào)用layout方法布局后谅辣,可以得到view的尺寸大小
    v.layout(0, 0, v.getMeasuredWidth(), v.getMeasuredHeight());
    Bitmap bmp = Bitmap.createBitmap(v.getWidth(), v.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas c = new Canvas(bmp);
    v.draw(c);
    return bmp;
}

最后附上原文鏈接及代碼

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末桑阶,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子割择,更是在濱河造成了極大的恐慌,老刑警劉巖荔泳,帶你破解...
    沈念sama閱讀 222,590評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件虐杯,死亡現(xiàn)場離奇詭異,居然都是意外死亡支子,警方通過查閱死者的電腦和手機(jī)达舒,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,157評論 3 399
  • 文/潘曉璐 我一進(jìn)店門叹侄,熙熙樓的掌柜王于貴愁眉苦臉地迎上來吞歼,“玉大人,你說我怎么就攤上這事篙骡。” “怎么了尿褪?”我有些...
    開封第一講書人閱讀 169,301評論 0 362
  • 文/不壞的土叔 我叫張陵得湘,是天一觀的道長。 經(jīng)常有香客問我淘正,道長,這世上最難降的妖魔是什么囤采? 我笑而不...
    開封第一講書人閱讀 60,078評論 1 300
  • 正文 為了忘掉前任惩淳,我火速辦了婚禮,結(jié)果婚禮上代虾,老公的妹妹穿的比我還像新娘。我一直安慰自己棉磨,他們只是感情好学辱,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,082評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著馅扣,像睡著了一般着降。 火紅的嫁衣襯著肌膚如雪差油。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,682評論 1 312
  • 那天发侵,我揣著相機(jī)與錄音妆偏,去河邊找鬼。 笑死叔锐,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的愉烙。 我是一名探鬼主播解取,決...
    沈念sama閱讀 41,155評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼蔓肯!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起蔗包,我...
    開封第一講書人閱讀 40,098評論 0 277
  • 序言:老撾萬榮一對情侶失蹤昆码,失蹤者是張志新(化名)和其女友劉穎邻储,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體脓匿,經(jīng)...
    沈念sama閱讀 46,638評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡宦赠,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,701評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了毡琉。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片妙色。...
    茶點(diǎn)故事閱讀 40,852評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出芍碧,到底是詐尸還是另有隱情号俐,我是刑警寧澤泌豆,帶...
    沈念sama閱讀 36,520評論 5 351
  • 正文 年R本政府宣布踪危,位于F島的核電站猪落,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏许布。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,181評論 3 335
  • 文/蒙蒙 一杂曲、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧擎勘,春花似錦颖榜、人聲如沸棚饵。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,674評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽欣硼。三九已至恶阴,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間冯事,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,788評論 1 274
  • 我被黑心中介騙來泰國打工缓熟, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人荚虚。 一個月前我還...
    沈念sama閱讀 49,279評論 3 379
  • 正文 我出身青樓版述,卻偏偏與公主長得像梯澜,于是被迫代替她去往敵國和親渴析。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,851評論 2 361