Как нарисовать круговую диаграмму в android

Я хотел бы нарисовать круговую диаграмму в приложении для Android. Не могли бы вы предложить мне способ сделать это простым способом? Я написал класс представления для этой цели, но это не удовлетворительно. Поэтому я был бы признателен, если бы вы сказали мне хорошую и высокопроизводительную графическую библиотеку.

Ответ 1

Загрузите банку из

http://www.achartengine.org/content/download.html

Добавьте банку в папку проектов lib. Существует также образец, предоставленный разработчиками. Вы можете проверить это и изменить то же, что и вы.

Существует также демонстрация @

http://www.achartengine.org/content/demo.html

Документы

http://www.achartengine.org/content/javadoc/org/achartengine/chart/PieChart.html

Пример:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/chart"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal" >
    </LinearLayout>

</LinearLayout>

Класс Activity

public class AChartEnginePieChartActivity extends Activity { 

    private static int[] COLORS = new int[] { Color.GREEN, Color.BLUE,Color.MAGENTA, Color.CYAN };

    private static double[] VALUES = new double[] { 10, 11, 12, 13 };

    private static String[] NAME_LIST = new String[] { "A", "B", "C", "D" };

    private CategorySeries mSeries = new CategorySeries("");

    private DefaultRenderer mRenderer = new DefaultRenderer();

    private GraphicalView mChartView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        mRenderer.setApplyBackgroundColor(true);
        mRenderer.setBackgroundColor(Color.argb(100, 50, 50, 50));
        mRenderer.setChartTitleTextSize(20);
        mRenderer.setLabelsTextSize(15);
        mRenderer.setLegendTextSize(15);
        mRenderer.setMargins(new int[] { 20, 30, 15, 0 });
        mRenderer.setZoomButtonsVisible(true);
        mRenderer.setStartAngle(90);

        for (int i = 0; i < VALUES.length; i++) {
            mSeries.add(NAME_LIST[i] + " " + VALUES[i], VALUES[i]);
            SimpleSeriesRenderer renderer = new SimpleSeriesRenderer();
            renderer.setColor(COLORS[(mSeries.getItemCount() - 1) % COLORS.length]);
            mRenderer.addSeriesRenderer(renderer);
        }

        if (mChartView != null) {
            mChartView.repaint();
        }

    }

    @Override
    protected void onResume() {
        super.onResume();
        if (mChartView == null) {
            LinearLayout layout = (LinearLayout) findViewById(R.id.chart);
            mChartView = ChartFactory.getPieChartView(this, mSeries, mRenderer);
            mRenderer.setClickEnabled(true);
            mRenderer.setSelectableBuffer(10);

            mChartView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    SeriesSelection seriesSelection = mChartView.getCurrentSeriesAndPoint();

                    if (seriesSelection == null) {
                        Toast.makeText(AChartEnginePieChartActivity.this,"No chart element was clicked",Toast.LENGTH_SHORT).show();
                    }
                    else {
                        Toast.makeText(AChartEnginePieChartActivity.this,"Chart element data point index "+ (seriesSelection.getPointIndex()+1) + " was clicked" + " point value="+ seriesSelection.getValue(), Toast.LENGTH_SHORT).show();
                    }
                }
            });

            mChartView.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    SeriesSelection seriesSelection = mChartView.getCurrentSeriesAndPoint();
                    if (seriesSelection == null) {
                        Toast.makeText(AChartEnginePieChartActivity.this,"No chart element was long pressed", Toast.LENGTH_SHORT);
                        return false; 
                    }
                    else {
                        Toast.makeText(AChartEnginePieChartActivity.this,"Chart element data point index "+ seriesSelection.getPointIndex()+ " was long pressed",Toast.LENGTH_SHORT);
                        return true;       
                    }
                }
            });
            layout.addView(mChartView, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
        }
        else {
        mChartView.repaint();
        }
    }
}

Ответ 2

В качестве альтернативы, если вы не хотите использовать библиотеки thrid-party, вы можете использовать эту формулу для получения точек на круге, учитывая радиус r:

x = r * Math.cos(2 * Math.PI) //This will give you r
y = r * Math.sin(2 * Math.PI) //This will give you 0

Для других точек круга вам нужно изменить аргумент вашего косинуса, например:

x = r * Math.cos(2 * Math.PI / 6) //This will give you r/2
y = r * Math.sin(2 * Math.PI / 6) //This will give you r*sqrt(3/2)

Если вы хотите заполнить весь круг фиксированным шагом n:

for(int i=0;i<n;i++) {
    x = r * Math.cos(2 * Math.PI * i / n)
    y = r * Math.sin(2 * Math.PI * i / n)
    //Draw PointF(x,y)
}

Ответ 4

Я думаю, что ваш лучший друг aChartEngine.
Он прост в использовании и предоставляет широкий спектр графиков для отображения.

Пример круговой диаграммы:

enter image description here

Ответ 5

Если вы хотите получить лучшую круговую диаграмму, сделайте следующее: 1. Откройте build.gradle (Модуль: приложение), добавьте зависимость implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3'

2. Создайте Your_Layout как:

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_gravity="center_vertical"
        android:orientation="vertical">

        <com.github.mikephil.charting.charts.PieChart
            android:id="@+id/piechart_1"
            android:layout_width="match_parent"
            android:layout_height="300sp">
        </com.github.mikephil.charting.charts.PieChart>
    </LinearLayout>
  1. Откройте файл активности и вставьте следующие коды:

    public class YourActivity extends AppCompatActivity{
    
            protected void onCreate(Bundle saveInstanceState)
    {
              super.onCreate(saveInstanceState);
              setContentView(R.layout.Your_layout);
              setPieChart(); }
    
             public void setPieChart() {
                        this.pieChart = pieChart;
                        pieChart.setUsePercentValues(true);
                        pieChart.getDescription().setEnabled(true);
                        pieChart.setExtraOffsets(5,10,5,5);
                        pieChart.setDragDecelerationFrictionCoef(0.9f);
                        pieChart.setTransparentCircleRadius(61f);
                        pieChart.setHoleColor(Color.WHITE);
                        pieChart.animateY(1000, Easing.EasingOption.EaseInOutCubic);
                        ArrayList<PieEntry> yValues = new ArrayList<>();
                        yValues.add(new PieEntry(34f,"Ilala"));
                        yValues.add(new PieEntry(56f,"Temeke"));
                        yValues.add(new PieEntry(66f,"Kinondoni"));
                        yValues.add(new PieEntry(45f,"Kigamboni"));
    
                        PieDataSet dataSet = new PieDataSet(yValues, "Desease Per 
                         Regions");
                        dataSet.setSliceSpace(3f);
                        dataSet.setSelectionShift(5f);
                        dataSet.setColors(ColorTemplate.COLORFUL_COLORS);
                        PieData pieData = new PieData((dataSet));
                        pieData.setValueTextSize(10f);
                        pieData.setValueTextColor(Color.YELLOW);
                        pieChart.setData(pieData);
                        //PieChart Ends Here
                    }
    }
    

Это даст вам круговую диаграмму, показанную ниже; enter image description here

Библиотека также может быть использована для рисования гистограмм, линейных графиков, горизонтальных гистограмм и т.д.

Ответ 6

Откройте build.gradle(module: app) и добавьте библиотеку в зависимости.

implementation 'com.github.lecho:hellocharts-library:[email protected]'

Затем вам нужно открыть build.gradle(Project) и добавить Jcenter, потому что эта библиотека доступна через него.

allprojects {
repositories {
    google()
    jcenter()
}

}

Теперь синхронизируйте ваш проект, нажав Синхронизировать сейчас.

Откройте файл activity_main.xml и добавьте следующий код для представления круговой диаграммы Android.

< ?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
 tools:context="com.codingdemos.codingdemos.MainActivity">
<lecho.lib.hellocharts.view.PieChartView
android:id="@+id/chart"
android:layout_width="match_parent"
android:layout_height="match_parent" />
< /LinearLayout>

Вот код для файла MainActivity.java.

public class MainActivity extends AppCompatActivity {
    PieChartView pieChartView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    pieChartView = findViewById(R.id.chart);

    List pieData = new ArrayList<>();
    pieData.add(new SliceValue(15, Color.BLUE).setLabel("Q1: $10"));
    pieData.add(new SliceValue(25, Color.GRAY).setLabel("Q2: $4"));
    pieData.add(new SliceValue(10, Color.RED).setLabel("Q3: $18"));
    pieData.add(new SliceValue(60, Color.MAGENTA).setLabel("Q4: $28"));

    PieChartData pieChartData = new PieChartData(pieData);
    pieChartData.setHasLabels(true).setValueLabelTextSize(14);
    pieChartData.setHasCenterCircle(true).setCenterText1("Sales in million").setCenterText1FontSize(20).setCenterText1Color(Color.parseColor("#0097A7"));
    pieChartView.setPieChartData(pieChartData);
}
}

вы можете увидеть https://www.codingdemos.com/android-pie-chart-tutorial/ для более подробного описания.

Ответ 7

Если вы не хотите использовать стороннюю библиотеку, попробуйте образец формы Google. Они предоставляют образец для рисования круговой диаграммы в своей документации по пользовательскому чертежу.

Документация и пример кода можно найти здесь

Ответ 8

GraphView - это библиотека для Android, позволяющая программно создавать гибкие и красивые диаграммы. Легко понять, интегрировать и настроить.

tellmehow.co

Поддерживаемые типы графов:

  • Линейные графики
  • Гистограммы
  • Точечные графики
  • или реализовать свои собственные пользовательские типы.

Добавить gradle зависимость:

compile 'com.jjoe64:graphview:4.2.1'

Добавить представление в макет:

<com.jjoe64.graphview.GraphView
    android:layout_width="match_parent"
    android:layout_height="200dip"
    android:id="@+id/graph" />

Добавьте некоторые данные:

GraphView graph = (GraphView) findViewById(R.id.graph);
LineGraphSeries<DataPoint> series = new LineGraphSeries<DataPoint>(new DataPoint[] {
          new DataPoint(0, 1),
          new DataPoint(1, 5),
          new DataPoint(2, 3),
          new DataPoint(3, 2),
          new DataPoint(4, 6)
});
graph.addSeries(series);