MPAndroidChartlele蜘蛛网图详细使用（四）

一 布局文件的编写

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_marginTop="7dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#fff"

    android:paddingTop="12dp"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingLeft="12dp"
        >
        <View
            android:layout_width="2dp"
            android:layout_height="10dp"
            android:layout_marginTop="4dp"
            android:background="#4a6def"></View>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:textSize="14sp"
            android:layout_marginLeft="8dp"
            android:text="当前交通综合指数"
            android:textColor="#222222"/>
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="12dp"
        android:layout_height="0.4dp"
        android:background="#a1a1a1" />


    <com.github.mikephil.charting.charts.RadarChart
        android:id="@+id/readerChart"
        android:layout_width="match_parent"
        android:layout_height="210dp"
        ></com.github.mikephil.charting.charts.RadarChart>


</LinearLayout>

二 .显示蜘蛛网Activity

package com.phone.mpandroid;

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;

import com.github.mikephil.charting.charts.RadarChart;

import java.util.ArrayList;
import java.util.List;

public class MRadarChart extends AppCompatActivity {
    RadarChart radarChart;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_mradar_chart);
        initView();
    }

    private void initView() {
        radarChart=(RadarChart)findViewById(R.id.readerChart);

        RadarChartManager radarChartManager = new RadarChartManager(this, radarChart);
        List<String> xData = new ArrayList<>();
        List<List<Float>> yDatas = new ArrayList<>();
        List<String> names = new ArrayList<>();
        names.add("东城区");
        names.add("朝阳区");
        names.add("西城");
        names.add("丰台区");
        names.add("石景山");
        names.add("房山区");

        xData.add("总体");
        xData.add("交通设施");
        xData.add("评价");
        xData.add("平均");
        xData.add("交通治理");
        xData.add("交通需求");
        xData.add("交通拥堵指数");
        List<Integer> colors = new ArrayList<>();

        for (int i = 0; i < 6; i++) {
            List<Float> nData = new ArrayList<>();
            for (int j = 0; j < 7; j++) {
                nData.add((float) (Math.random() * 20));
            }
            yDatas.add(nData);
        }

        colors.add(Color.parseColor("#fbd06a"));
        colors.add(Color.parseColor("#f69a40"));
        colors.add(Color.parseColor("#ff5d52"));
        colors.add(Color.parseColor("#e71f19"));
        colors.add(Color.parseColor("#ff9b43"));
        colors.add(Color.parseColor("#8eb9fb"));
        radarChartManager.showRadarChart(xData, yDatas, names, colors);
    }
}

三 .显示蜘蛛网图的管理类

package com.phone.mpandroid;

import android.content.Context;
import android.graphics.Color;

import com.github.mikephil.charting.charts.RadarChart;
import com.github.mikephil.charting.components.AxisBase;
import com.github.mikephil.charting.components.Description;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.RadarData;
import com.github.mikephil.charting.data.RadarDataSet;
import com.github.mikephil.charting.data.RadarEntry;
import com.github.mikephil.charting.formatter.IAxisValueFormatter;
import com.github.mikephil.charting.interfaces.datasets.IRadarDataSet;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by zhang on 2018/7/9.
 * �蜘蛛网
 */

public class RadarChartManager {
    private RadarChart mRadarChart;
    private Context mContext;
    private YAxis yAxis;
    private XAxis xAxis;

    public RadarChartManager(Context context, RadarChart radarChart) {
        this.mContext = context;
        this.mRadarChart = radarChart;
        yAxis = mRadarChart.getYAxis();
        xAxis = mRadarChart.getXAxis();
    }

    private void initRadarChart() {
        // 绘制线条宽度，圆形向外辐射的线条
        mRadarChart.setWebLineWidth(1f);
//        线条的颜色
        mRadarChart.setWebColor(Color.parseColor("#d5d5d5"));
        mRadarChart.setWebColorInner(Color.parseColor("#d5d5d5"));
        // 内部线条宽度，外面的环状线条
        mRadarChart.setWebLineWidthInner(0.4f);
        // 所有线条WebLine透明度
        mRadarChart.setWebAlpha(100);
        //取消图标右下角的描述
        mRadarChart.getDescription().setEnabled(false);
//        图显示的位置
        mRadarChart.setExtraOffsets(0, 2, 110, 0);
        //点击点弹出的标签
//        RadarMarkerView mv = new RadarMarkerView(mContext, R.layout.radar_marker_view);
//        mRadarChart.setMarkerView(mv);
        XAxis xAxis = mRadarChart.getXAxis();
        // X坐标值字体大小
        xAxis.setTextSize(8f);
        xAxis.setGridColor(Color.parseColor("#a1a1a1"));
        xAxis.setTextColor(Color.parseColor("#a1a1a1"));
        xAxis.setAxisLineColor(Color.parseColor("#a1a1a1"));
        // Y坐标值字体样式

        // Y坐标值标签个数
        yAxis.setLabelCount(6, false);
        // Y坐标值字体大小
        yAxis.setTextSize(15f);
        yAxis.setTextColor(Color.parseColor("#a1a1a1"));
        yAxis.setAxisLineColor(Color.parseColor("#a1a1a1"));
        // Y坐标值是否从0开始
        yAxis.setStartAtZero(true);
        yAxis.setEnabled(false);
        yAxis.setDrawLabels(false);
        yAxis.setDrawTopYLabelEntry(false);
        yAxis.setGridColor(Color.parseColor("#a1a1a1"));
        xAxis.setDrawLimitLinesBehindData(false);
        //设置X上的显示labal
        xAxis.setDrawLabels(true);
        Legend l = mRadarChart.getLegend();
        // 图例位置
//        l.setPosition(Legend.LegendPosition.RIGHT_OF_CHART);
        l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.RIGHT);
        l.setOrientation(Legend.LegendOrientation.VERTICAL);
        // 图例X间距
        l.setXEntrySpace(1f);
        // 图例Y间距
        l.setYEntrySpace(1f);
//        图例文字的大小
        l.setTextSize(12f);
//        图例文字颜色
        l.setTextColor(Color.parseColor("#a1a1a1"));
//        图例相对于Y的偏移
        l.setYOffset(1f);
//        图例相对于X的偏移
        l.setXOffset(20f);
    }

    public void showRadarChart(final List<String> xData, List<List<Float>> yDatas, List<String> names, List<Integer> colors) {
        initRadarChart();
        xAxis.setValueFormatter(new IAxisValueFormatter() {
            @Override
            public String getFormattedValue(float value, AxisBase axis) {
                return xData.get((int) value % xData.size());
            }
        });
        //Y轴字体颜色
        yAxis.setTextColor(Color.parseColor("#a1a1a1"));
//        是否绘制
        yAxis.setDrawLabels(false);
        List<IRadarDataSet> sets = new ArrayList<>();
        for (int i = 0; i < yDatas.size(); i++) {
            ArrayList<RadarEntry> yValues = new ArrayList<>();
            for (int j = 0; j < yDatas.get(i).size(); j++) {
                yValues.add(new RadarEntry(yDatas.get(i).get(j), j));
            }
            RadarDataSet radarDataSet = new RadarDataSet(yValues, names.get(i));
            radarDataSet.setColor(colors.get(i));
            //设置是否填充区域
            radarDataSet.setDrawFilled(true);
            //填充区域的颜色
            radarDataSet.setFillColor(colors.get(i));
            //填充区域同颜色的alpha值
            radarDataSet.setFillAlpha(255);
            // 数据线条宽度
            radarDataSet.setLineWidth(1f);
            sets.add(radarDataSet);
        }

        RadarData data = new RadarData(sets);
        // 数据字体大小
        data.setValueTextSize(8f);
        // 是否绘制Y值到图表
        data.setDrawValues(false);
        mRadarChart.setData(data);
        mRadarChart.invalidate();
    }

    /**
     * 设置描述信息
     *
     * @param str
     */
    public void setDescription(String str) {
        Description description = new Description();
        description.setText(str);
        mRadarChart.setDescription(description);
        mRadarChart.invalidate();
    }

    public void setYscale(float max, float min, int labelCount) {
        yAxis.setLabelCount(labelCount, false);
        yAxis.setAxisMinimum(min);
        yAxis.setAxisMaximum(max);
        mRadarChart.invalidate();
    }
}