如何在水平条形图中设置标签和值? [英] How to set labels and values in horizontal bar charts?
本文介绍了如何在水平条形图中设置标签和值?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在使用 MPAndroidChart .请检查我的以下代码
I am using MPAndroidChart. Please check my below code
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.graphs.graphs2.MainActivity">
<com.github.mikephil.charting.charts.HorizontalBarChart
android:id="@+id/chart"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
MainActivity.java
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
HorizontalBarChart chart = (HorizontalBarChart) findViewById(R.id.chart);
BarData data = new BarData(getDataSet(Color.rgb(115,115,115),4,6,"Low","lowSet"),
getDataSet(Color.rgb(71,209,71),3,44,"Normal","normalSet"),
getDataSet(Color.rgb(255,204,0),2,44,"High","highSet"),
getDataSet(Color.rgb(255,51,0),1,6,"Very High","veryHighSet"));
chart.setData(data);
chart.setDragEnabled(true); // on by default
//chart.setVisibleXRange(0,3); // sets the viewport to show 3 bars
chart.animateXY(2000, 2000);
chart.invalidate();
}
private BarDataSet getDataSet(int color, float position, float value, String entryLabel, String datasetLabel) {
ArrayList<BarEntry> entries = new ArrayList();
entries.add(new BarEntry(position, value,entryLabel));
BarDataSet dataset = new BarDataSet(entries,datasetLabel);
dataset.setColor(color);
return dataset;
}
这给了我下面的看法
但是我想要的是下面的东西
But what I want is something like below
现在，在我的图表中，
1.如何在带有百分比标记的小节末尾显示小节的值?我当前的图表不会显示任何值！
2.如何在条形图的左侧设置labels?我通过使用BarEntry构造函数进行了尝试，但是没有用.
3.如何删除所有网格线?
Now, in my chart,
1. How can I display the value of bar at the end of bar with a percentage mark? My current chart won't display any value!
2. How can I set the labels at the left side of the bars? I tried it by using BarEntry constructor, but it didn't work.
3. How can I remove all grid lines?
更新
我尝试了PPartasian的解决方案，它产生了以下错误.
I tried the solution by PPartasian, it generated the below error.
01-11 10:51:10.402 26974-26974/com.example.graphs.viewchart E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.example.graphs.viewchart, PID: 26974
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.example.graphs.viewchart/com.example.graphs.viewchart.MainActivity}: android.view.InflateException: Binary XML file line #36: Error inflating class com.github.ppartisan.graphish.view.BarView
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2656)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2721)
at android.app.ActivityThread.access$900(ActivityThread.java:168)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1393)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5753)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1405)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1200)
Caused by: android.view.InflateException: Binary XML file line #36: Error inflating class com.github.ppartisan.graphish.view.BarView
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:757)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
at android.view.LayoutInflater.inflate(LayoutInflater.java:414)
at android.view.LayoutInflater.inflate(LayoutInflater.java:365)
at android.support.v7.app.AppCompatDelegateImplV9.setContentView(AppCompatDelegateImplV9.java:284)
at android.support.v7.app.AppCompatActivity.setContentView(AppCompatActivity.java:140)
at com.example.graphs.viewchart.MainActivity.onCreate(MainActivity.java:21)
at android.app.Activity.performCreate(Activity.java:6112)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1117)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2609)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2721)
at android.app.ActivityThread.access$900(ActivityThread.java:168)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1393)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5753)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1405)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1200)
Caused by: java.lang.ClassNotFoundException: Didn't find class "com.github.ppartisan.graphish.view.BarView" on path: DexPathList[[zip file "/data/app/com.example.graphs.viewchart-1/base.apk"],nativeLibraryDirectories=[/vendor/lib, /system/lib]]
at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
at android.view.LayoutInflater.createView(LayoutInflater.java:571)
at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:743)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
at android.view.LayoutInflater.inflate(LayoutInflater.java:414)
at android.view.LayoutInflater.inflate(LayoutInflater.java:365)
at android.support.v7.app.AppCompatDelegateImplV9.setContentView(AppCompatDelegateImplV9.java:284)
at android.support.v7.app.AppCompatActivity.setContentView(AppCompatActivity.java:140)
at com.example.graphs.viewchart.MainActivity.onCreate(MainActivity.java:21)
at android.app.Activity.performCreate(Activity.java:6112)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1117)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2609)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2721)
at android.app.ActivityThread.access$900(ActivityThread.java:168)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1393)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5753)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1405)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1200)
Suppressed: java.lang.ClassNotFoundException: Didn't find class "com.github.ppartisan.graphish.view.BarView" on path: DexPathList[[dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-support-annotations-24.2.1_ee83e15951f6e098dcf8d5c7289233f29c08ba29-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_9-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_8-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_7-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_6-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_5-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_4-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_3-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_2-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_1-classes.dex", dex file "/data/data/com.example.graphs.viewchart/files/instant-run/dex/slice-slice_0-classes.dex", dex file "/data/data/com.exam
更新
问题已解决. BarView用户界面必须进行如下更改
Issue sorted out. The BarView UI has to be changed as below
<com.example.graphs.viewchart.BarView
android:id="@+id/low_bar"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="8dp" />
推荐答案
通过查看所需输出的图像，应该可以在不使用第三方库的情况下创建这种简单的条形图. 条"可以由简单的View组成，这些c3可以根据以总可用宽度的百分比计算得出的数字来加长或缩短.这是一个如何实现此目的的示例:
From looking at the image of desired output, it should be possible to create a simple bar graph of this sort without using third party libraries. The "bars" could be composed of simple Views which can lengthen or shorten based on a figure calculated by taking a percentage of the total available width. Here is an example of how you could achieve this:
1)创建一个长度可调的自定义View以用作栏"
1) Create a custom View with an adjustable length to act as a "bar"
public final class BarView extends View {
private final Paint mPaint = new Paint();
private int percent = 0;
public BarView(Context context) {
super(context);
init();
}
public BarView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public BarView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
mPaint.setStyle(Paint.Style.FILL);
mPaint.setAntiAlias(true);
}
public void set(int color, int percent) {
if(percent < 0 || percent > 100) {
throw new IllegalArgumentException("Percent value must range from 0 to 100");
}
mPaint.setColor(color);
this.percent = percent;
invalidate();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
final float width = MeasureSpec.getSize(widthMeasureSpec);
final float adjWidth = (width*((float)percent/100));
setMeasuredDimension((int)adjWidth, heightMeasureSpec);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawRect(0,0,getWidth(),getHeight(),mPaint);
}
}
2)使用百分比值设置宽度
2) Use a percentage value to set the width
public class MainActivity extends AppCompatActivity {
private TextView mLowLabel, mMidLabel, mHighLabel;
private BarView mLowBar, mMidBar, mHighBar;
//Some sample percentage values
private final int low = 17;
private final int mid = 90;
private final int high = 34;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mLowBar = (BarView) findViewById(R.id.low_bar);
mMidBar = (BarView) findViewById(R.id.mid_bar);
mHighBar = (BarView) findViewById(R.id.high_bar);
mLowLabel = (TextView) findViewById(R.id.low_text);
mMidLabel = (TextView) findViewById(R.id.mid_text);
mHighLabel = (TextView) findViewById(R.id.high_text);
mLowBar.set(Color.BLUE, low);
mMidBar.set(Color.RED, mid);
mHighBar.set(Color.GREEN, high);
mLowLabel.setText(getPercentage(low));
mMidLabel.setText(getPercentage(mid));
mHighLabel.setText(getPercentage(high));
}
private String getPercentage(int per) {
return per + "%";
}
}
3)在XML中进行设置.条形图的weight设置为1，因此它们填充了所有可用空间，将构成"100％"读数.
3) Set it up in XML. The weights of the bars are set to 1 so they fill all available space, which will constitute the "100%" reading.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.github.ppartisan.graphish.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="horizontal"
android:gravity="center_vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Low"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:minEms="3"
android:textStyle="bold"/>
<com.github.ppartisan.graphish.view.BarView
android:id="@+id/low_bar"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="8dp" />
<TextView
android:id="@+id/low_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="horizontal"
android:gravity="center_vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mid"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:minEms="3"
android:textStyle="bold"/>
<com.github.ppartisan.graphish.view.BarView
android:id="@+id/mid_bar"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="8dp" />
<TextView
android:id="@+id/mid_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="horizontal"
android:gravity="center_vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="High"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:minEms="3"
android:textStyle="bold"/>
<com.github.ppartisan.graphish.view.BarView
android:id="@+id/high_bar"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="8dp" />
<TextView
android:id="@+id/high_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
这是输出的图像:
这篇关于如何在水平条形图中设置标签和值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
