MPAndroidChart自動變焦BARCHART在x軸上

Question

我期待在mpAndroidChart庫畫一些圖表和我這個代碼（對於條形圖）：

chart.setDescription(""); 
chart.setDrawVerticalGrid(false); 
chart.setDrawGridBackground(false); 
chart.setDrawBarShadow(false); 
chart.setDrawLegend(false); 

XLabels xl = holder.chart.getXLabels(); 
xl.setCenterXLabelText(true); 
xl.setPosition(XLabelPosition.BOTTOM); 
xl.setTextSize(20f); 

YLabels yl = holder.chart.getYLabels(); 
yl.setLabelCount(5); 
yl.setTextSize(20f); 

// set data 
chart.setData((BarData) mChartData); 
holder.chart.setScaleMinima(2f, 0f); 

chart.animateY(700); 

現在當圖表顯示，酒吧放大，但他們放大太多。 事實上，我可以縮小（直到zoom適合x的setScaleMinima值）。 我會說，當顯示圖表時，縮放正是我在setScaleMinima中聲明的。我怎樣才能做到這一點？

Answer 1

將縮放比例設置爲0f意味着您可以縮小太無限。將其設置爲1f意味着您可以完全縮小以查看整個圖表。

所以，你應該叫：

setScaleMinima(2f, 1f)

只設置了變焦範圍，但並沒有實際的縮放。

然後使用方法

zoom(...)放大到任何你想要的。

Answer 2

我不知道BarChart庫，但它很容易實現一個自己的。 我會粘貼一個，我最近做的，希望這有助於片段。

package com.example.preferencestest.util; 

import com.example.preferencestest.R; 

import android.content.Context; 
import android.content.res.Resources; 
import android.content.res.TypedArray; 
import android.graphics.Canvas; 
import android.graphics.Paint; 
import android.util.AttributeSet; 
import android.view.View; 

public class MyCustomChartView extends View { 
    private int width=0, height=0; 

    public MyCustomChartView(Context context) { 
     super(context); 
     setup(null); 
    } 

    public MyCustomChartView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
     setup(attrs); 
    } 
    public MyCustomChartView(Context context, AttributeSet attrs) { 
     super(context, attrs); 
     setup(attrs); 
    } 

    private int firstValue=0, secondValue=0, thirdValue=0, horizontalPadding=20, verticalPadding=40; 
    private String title=""; 
    private Paint outerLine, grid, other; 
    private Resources res; 

    private void setup(AttributeSet attrs) { 
     if (attrs != null) { 
      Context ctx = getContext(); 
      TypedArray ta = ctx.obtainStyledAttributes(attrs, R.styleable.MyCustomCharView); 
      firstValue = ta.getInt(R.styleable.MyCustomCharView_Plot_First_Value, firstValue); 
      secondValue = ta.getInt(R.styleable.MyCustomCharView_Plot_Second_Value, secondValue); 
      thirdValue = ta.getInt(R.styleable.MyCustomCharView_Plot_Third_Value, thirdValue); 
      ta.recycle(); 
     } 
     res = getResources(); 
     outerLine = new Paint(Paint.ANTI_ALIAS_FLAG); 
     outerLine.setColor(res.getColor(R.color.plot_outer_line)); 
     outerLine.setStrokeWidth(3); 
     grid = new Paint(Paint.ANTI_ALIAS_FLAG); 
     grid.setColor(res.getColor(R.color.plot_grid)); 
     grid.setStrokeWidth(2); 
     other = new Paint(Paint.ANTI_ALIAS_FLAG); 
    } 

    @Override 
    protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
     super.onSizeChanged(w, h, oldw, oldh); 
     width = w; height = h; 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 
     super.onDraw(canvas); 
     //float width = canvas.getWidth(), height = canvas.getHeight(); 
     int limit = Math.max(6, Math.max(firstValue, Math.max(secondValue, thirdValue))); 
     canvas.drawLine(horizontalPadding, verticalPadding, 
       horizontalPadding, height-verticalPadding, outerLine); 
     canvas.drawLine(horizontalPadding, height-verticalPadding, 
       width-horizontalPadding, height-verticalPadding, outerLine); 

     int gridVertMargin = Math.round((height-(verticalPadding*2))/7); 
     for (int i=0; i<7; i++) { 
      canvas.drawLine(horizontalPadding+1, 
        verticalPadding+(i*gridVertMargin), 
        width-horizontalPadding, 
        verticalPadding+(i*gridVertMargin), grid); 
     } 

     int gridHoriMargin = Math.round((width-(horizontalPadding*2))/limit); 
     for (int i = 0; i < limit; i++) { 
      canvas.drawLine(horizontalPadding+((i+1)*gridHoriMargin), 
        verticalPadding+1, 
        horizontalPadding+((i+1)*gridHoriMargin), 
        height-verticalPadding, grid); 
      canvas.drawText(String.valueOf(i+1), horizontalPadding+((i+1)*gridHoriMargin)-2, height-(verticalPadding/2), outerLine); 
     } 

     other.setColor(res.getColor(R.color.plot_first_color)); 
     if (this.firstValue > 0) { 
      canvas.drawRect(horizontalPadding+1, 
        verticalPadding+(gridVertMargin*1)+1, 
        this.firstValue*gridHoriMargin+horizontalPadding-1, 
        verticalPadding+(gridVertMargin*2)-1, other); 
     } 

     other.setColor(res.getColor(R.color.plot_second_color)); 
     if (this.secondValue > 0) { 
      canvas.drawRect(horizontalPadding+1, 
        verticalPadding+(gridVertMargin*3)+1, 
        this.secondValue*gridHoriMargin+horizontalPadding-1, 
        verticalPadding+(gridVertMargin*4)-1, other); 
     } 

     other.setColor(res.getColor(R.color.plot_third_color)); 
     if (this.thirdValue > 0) { 
      canvas.drawRect(horizontalPadding+1, 
        verticalPadding+(gridVertMargin*5)+1, 
        this.thirdValue*gridHoriMargin+horizontalPadding-1, 
        verticalPadding+(gridVertMargin*6)-1, other); 
     } 
    } 

    public int getFirstValue() { 
     return firstValue; 
    } 

    public void setFirstValue(int first) { 
     if (this.firstValue != first) { 
      this.firstValue = first; 
      invalidate(); 
     } 
    } 

    public int getSecondValue() { 
     return secondValue; 
    } 

    public void setSecondValue(int second) { 
     if (this.secondValue != second) { 
      this.secondValue = second; 
      invalidate(); 
     } 
    } 

    public int getThirdValue() { 
     return thirdValue; 
    } 

    public void setThirdValue(int third) { 
     if (this.thirdValue != third) { 
      this.thirdValue = third; 
      invalidate(); 
     } 
    } 

    public String getTitle() { 
     return title; 
    } 

    public void setTitle(String title) { 
     if (! this.title.equals(title)) { 
      this.title = title; 
      invalidate(); 
     } 
    } 
} 

您需要的XML設置樣式值（第一，在這種情況下，第二和第三條）這樣的xml文件：

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
    <declare-styleable name="MyCustomCharView"> 
     <attr name="Plot_First_Value" format="integer" /> 
     <attr name="Plot_Second_Value" format="integer" /> 
     <attr name="Plot_Third_Value" format="integer" /> 
    </declare-styleable> 

    <color name="plot_outer_line">#330000</color> 
    <color name="plot_grid">#dd0000</color> 
    <color name="plot_first_color">#99aa00</color> 
    <color name="plot_second_color">#770000</color> 
    <color name="plot_third_color">#00ee77</color> 
</resources> 

最後，你可以像這樣添加新BARCHART到您的佈局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/RelativeLayout1" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" xmlns:app="http://schemas.android.com/apk/res/[yourpackage]"> 

     <[yourpackage].MyCustomChartView 
      android:id="@+id/row_plot" 
      style="@style/ListItem" 
      android:layout_width="match_parent" 
      android:layout_height="150dp" 
      title="" 
      app:Plot_First_Value="15" 
      app:Plot_Second_Value="1" 
      app:Plot_Third_Value="3" /> 
{...}