Как динамически отображать текст на круговой диаграмме в Android?

Question

Я работал на круговой диаграмме в Android.Я нашел отличное решение из http://tutorials -android.blogspot.in / 2011/05 / how-create-pie-chart-in-android.html и работал над этим.Я могу отображать круговую диаграмму с цветами, но в моем приложении помимо цветов мне нужно также динамически отображать текст на этой круговой диаграмме. Как я могу динамически отображать текст на этих кусочках круговой диаграммы?

Пожалуйста, помогите мне с этим ... Буду благодарен ...

Answer 1

Вы можете использовать библиотеку под названием MPAndroidChart , которая очень проста и удобна в использовании. Просто импортируйте это

 compile 'com.github.PhilJay:MPAndroidChart:v3.0.1'

и добавьте эту строку в свой файл Gradle

allprojects {
repositories {
    maven { url "https://jitpack.io" }
}
}

Надеюсь, это поможет вам.

Answer 2

Чтобы нарисовать круговую диаграмму, вы использовали очень длинный процесс ..... Надеюсь, это поможет вам ..

public class Demo extends Activity {
    /** Called when the activity is first created. */
    float values[]={500,400,300,200,100};
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    LinearLayout linear=(LinearLayout) findViewById(R.id.linear);
    values=calculateData(values);
    linear.addView(new MyGraphview(this,values));

}
private float[] calculateData(float[] data) {
    // TODO Auto-generated method stub
    float total=0;
    for(int i=0;i<data.length;i++)
    {
        total+=data[i];
    }
    for(int i=0;i<data.length;i++)
    {
    data[i]=360*(data[i]/total);            
    }
    return data;

}
public class MyGraphview extends View
{
    private Paint paint=new Paint(Paint.ANTI_ALIAS_FLAG);
    private float[] value_degree;
    private int[] COLORS={Color.BLUE,Color.GREEN,Color.GRAY,Color.CYAN,Color.RED};
    RectF rectf = new RectF (10, 10, 200, 200);
    int temp=0;
    public MyGraphview(Context context, float[] values) {

        super(context);
        value_degree=new float[values.length];
        for(int i=0;i<values.length;i++)
        {
            value_degree[i]=values[i];
        }
    }
    @Override
    protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub
        super.onDraw(canvas);

        for (int i = 0; i < value_degree.length; i++) {//values2.length; i++) {
            if (i == 0) {
                paint.setColor(COLORS[i]);
                canvas.drawArc(rectf, 0, value_degree[i], true, paint);
            } 
            else
            {
                    temp += (int) value_degree[i - 1];
                    paint.setColor(COLORS[i]);
                    canvas.drawArc(rectf, temp, value_degree[i], true, paint);
            }
        }
    }

}

}

, который устанавливает цвет в соответствии со значениями в порядке убывания...И для текста, вы можете установить динамический текст отдельно и дать квадрат цвета перед текстом:)

Answer 3

Чтобы нарисовать текст в центре каждого сегмента круговой диаграммы, необходимо рассчитать центр каждого сегмента. Центр каждого текстового элемента для рисования на этом сегменте должен быть выровнен с этой центральной точкой - что достигается путем вычитания половины ширины текстовых границ из центральной координаты x (или использования paint.setTextAlign (Align.CENTER);) и половины текста высота границы от центральной координаты y.

Что касается нахождения центра сегмента, он требует немного больше внимания, чем использование простой геометрии.

Центральные координаты сегмента можно найти по:

x = (/* radius of pie chart */ /2)*cos(/*angle in RADIANS */) [angle in radians = Math.toRadians(/*half the sweep angle in degrees*/)

y = (/* radius of pie chart */ /2)*sin(/*angle in RADIANS */)

Почти там ... не забудьте добавить координаты x и y центра вашей круговой диаграммы к указанным выше значениям x и y, в противном случае вы пытаетесь нарисовать круг с центром в (0,0) в Ваш пользовательский вид!

Скажем, ваша круговая диаграмма центрирована в фактическом центре вашего представления, которое вы хотите добавить:

x += getWidth()/2; y += getHeight()/2;

И последнее, но не менее важное, учитывая длину текста, который нужно нарисовать - получите границы вашего текста, используя, например:

Paint paint = new Paint(); paint.setColor(Color.WHITE); paint.setTextAlign(Align.CENTER); // This centres the text horizontally

String labelText = "TEST"; Rect textBounds = new Rect(); paint.getTextBounds(labelText, 0, labelText.length(), textBounds);

y -= textBounds.height()/2;

Тогда ваш текст должен отображаться правильно.

Answer 4

 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  if (mState != IS_READY_TO_DRAW) {
   return;
  }
  canvas.drawColor(mBgcolor);
  mBagpaints.setAntiAlias(true);
  mBagpaints.setStyle(Paint.Style.FILL);
  mBagpaints.setColor(0x88FF0000);
  mBagpaints.setStrokeWidth(0.0f);
  mLinePaints.setAntiAlias(true);
  mLinePaints.setColor(0xff000000);
  mLinePaints.setStrokeWidth(3.0f);
  mLinePaints.setStyle(Paint.Style.STROKE);
  RectF mOvals = new RectF(mGapleft, mGapTop, mWidth - mGapright, mHeight
    - mGapBottm);
  mStart = START_INC;
  PieDetailsItem item;
  for (int i = 0; i < mdataArray.size(); i++) {
   item = (PieDetailsItem) mdataArray.get(i);
   mBagpaints.setColor(item.color);
   mSweep = (float) 360* ((float) item.count / (float) mMaxConnection);
   canvas.drawArc(mOvals, mStart, mSweep, true, mBagpaints);
   canvas.drawArc(mOvals, mStart, mSweep, true, mLinePaints);
   mStart = mStart + mSweep;


  // set your text here
  canvas.drawText("here is some text", mStart, someYvalue, mLinePaints);
  }

  mState = IS_DRAW;
 }

Просто некоторые вызовы drawText () должны работать нормально.Вы должны будете сделать небольшую математику, чтобы решить, где ваша координата Y должна быть