MPAndroidChart 全宽,Y 轴标签位于内部
MPAndroidChart Full Width with Y-Axis Labels Positioned Inside
我在将图表设置为全宽时遇到问题;使 Y 轴位于 x 坐标 0 且图形右侧为全宽。
设置图表时,我执行以下操作:
setDrawGridBackground(false);
setDrawBorders(false);
getLegend().setEnabled(false);
setAutoScaleMinMaxEnabled(true);
setTouchEnabled(true);
setDragEnabled(true);
setScaleEnabled(true);
setPinchZoom(true);
setDoubleTapToZoomEnabled(false);
setBackgroundColor(Color.TRANSPARENT);
getAxisRight().setEnabled(false);
getDescription().setEnabled(false);
final YAxis yAxis = getAxisLeft();
yAxis.setLabelCount(4,true);
yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
yAxis.setValueFormatter(new TemperatureValueFormatter());
yAxis.setTextColor(Color.WHITE);
yAxis.setGridColor(Color.argb(102,255,255,255));
yAxis.setAxisLineColor(Color.TRANSPARENT);
final XAxis xAxis = getXAxis();
xAxis.setDrawLimitLinesBehindData(true);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
xAxis.setTextColor(Color.WHITE);
xAxis.disableGridDashedLine();
xAxis.setDrawGridLines(false);
xAxis.setGridColor(Color.argb(204,255,255,255));
xAxis.setAxisLineColor(Color.TRANSPARENT);
xAxis.setValueFormatter(new TimestampValueFormatter());
xAxis.setLabelCount(4);
xAxis.setAvoidFirstLastClipping(true);
xAxis.setSpaceMin(10f);
添加初始数据或使用动态数据更新后,我调用以下命令:
invalidate();
fitScreen();
在 yaxis 和我的视图左侧以及右边距和我的视图右侧之间仍然存在边距。这个边距需要消失。
我试过使用 setExtraOffsets
但不幸的是它似乎限制了我看到的边距,因为我尝试设置负值但没有成功。
任何父项或图表本身均未设置填充或边距。将 Y 轴标签位置更改为外部时,它们看起来就像在使用视图的边缘,并且不受限于与将它们定位在内部时相同的边距。
我做错了什么?
编辑截图
使用 MPAndroidChart 3.0.1
通过从您在问题中提供的代码中删除这一行,我能够实现您想要的:
xAxis.setSpaceMin(10f); //DON'T NEED THIS!!
并添加以下代码:
mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
float xMin = 0;
xAxis.setAxisMaximum(xMax);
xAxis.setAxisMinimum(xMin);
Before:(注意左侧 xAxis 线与第一条 x-value 之间的边距为 0 - 这是不需要的)
After:(注意我们现在已经修复它所以没有边距并且第一个 x-value 根据 OP 与屏幕左侧齐平要求)
如果您有任何其他 UI 要求,您没有在问题中提及它们,所以这个答案似乎已经解决了您的问题。您可能还想考虑:
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your screenshot
完整的概念证明:
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v4.content.ContextCompat;
import android.view.Menu;
import android.view.WindowManager;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.formatter.DefaultAxisValueFormatter;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.utils.Utils;
import java.util.ArrayList;
public class LineChartActivity5 extends Activity {
private LineChart mChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_linechart);
mChart = (LineChart) findViewById(R.id.chart1);
mChart.setDrawGridBackground(false);
mChart.setDrawBorders(false);
mChart.getLegend().setEnabled(false);
mChart.setAutoScaleMinMaxEnabled(true);
mChart.setTouchEnabled(true);
mChart.setDragEnabled(true);
mChart.setScaleEnabled(true);
mChart.setPinchZoom(true);
mChart.setDoubleTapToZoomEnabled(false);
mChart.setBackgroundColor(Color.parseColor("#FF8000"));
mChart.getAxisRight().setEnabled(false);
mChart.getDescription().setEnabled(false);
final YAxis yAxis = mChart.getAxisLeft();
yAxis.setLabelCount(4,true);
yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
yAxis.setValueFormatter(new DefaultAxisValueFormatter(2));
yAxis.setTextColor(Color.WHITE);
yAxis.setTextSize(15f); //not in your original but added
yAxis.setGridColor(Color.argb(102,255,255,255));
yAxis.setAxisLineColor(Color.TRANSPARENT);
yAxis.setAxisMinimum(0); //not in your original but added
final XAxis xAxis = mChart.getXAxis();
xAxis.setDrawLimitLinesBehindData(true);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your spec
xAxis.setTextColor(Color.WHITE);
xAxis.disableGridDashedLine();
xAxis.setDrawGridLines(false);
xAxis.setGridColor(Color.argb(204,255,255,255));
xAxis.setAxisLineColor(Color.TRANSPARENT);
xAxis.setValueFormatter(new DefaultAxisValueFormatter(2)); //not in your original but added
//xAxis.setValueFormatter(new TimestampValueFormatter());
xAxis.setLabelCount(4);
xAxis.setAvoidFirstLastClipping(true);
//xAxis.setSpaceMin(10f); //DON'T NEED THIS!!
setData(16, 15);
mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
float xMin = 0;
xAxis.setAxisMaximum(xMax);
xAxis.setAxisMinimum(xMin);
}
private void setData(int count, float range) {
ArrayList<Entry> values = new ArrayList<Entry>();
for (int i = 0; i < count; i++) {
float val = (float) (Math.random() * range) + 3;
values.add(new Entry(i, val));
}
LineDataSet set1;
if (mChart.getData() != null &&
mChart.getData().getDataSetCount() > 0) {
set1 = (LineDataSet)mChart.getData().getDataSetByIndex(0);
set1.setValues(values);
mChart.getData().notifyDataChanged();
mChart.notifyDataSetChanged();
} else {
set1 = new LineDataSet(values, "DataSet 1");
set1.setColor(Color.WHITE);
set1.setCircleColor(Color.BLACK);
set1.setLineWidth(3f);
set1.setDrawCircles(false);
set1.setMode(LineDataSet.Mode.CUBIC_BEZIER);
set1.setValueTextSize(9f);
set1.setDrawValues(false);
set1.setDrawFilled(true);
set1.setFormLineWidth(1f);
set1.setFormSize(15.f);
if (Utils.getSDKInt() >= 18) {
// fill drawable only supported on api level 18 and above
Drawable drawable = ContextCompat.getDrawable(this, R.drawable.fade_orange);
set1.setFillDrawable(drawable);
}
else {
set1.setFillColor(Color.BLACK);
}
ArrayList<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
dataSets.add(set1); // add the datasets
// create a data object with the datasets
LineData data = new LineData(dataSets);
// set data
mChart.setData(data);
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.line, menu);
return true;
}
}
我在将图表设置为全宽时遇到问题;使 Y 轴位于 x 坐标 0 且图形右侧为全宽。
设置图表时,我执行以下操作:
setDrawGridBackground(false);
setDrawBorders(false);
getLegend().setEnabled(false);
setAutoScaleMinMaxEnabled(true);
setTouchEnabled(true);
setDragEnabled(true);
setScaleEnabled(true);
setPinchZoom(true);
setDoubleTapToZoomEnabled(false);
setBackgroundColor(Color.TRANSPARENT);
getAxisRight().setEnabled(false);
getDescription().setEnabled(false);
final YAxis yAxis = getAxisLeft();
yAxis.setLabelCount(4,true);
yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
yAxis.setValueFormatter(new TemperatureValueFormatter());
yAxis.setTextColor(Color.WHITE);
yAxis.setGridColor(Color.argb(102,255,255,255));
yAxis.setAxisLineColor(Color.TRANSPARENT);
final XAxis xAxis = getXAxis();
xAxis.setDrawLimitLinesBehindData(true);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
xAxis.setTextColor(Color.WHITE);
xAxis.disableGridDashedLine();
xAxis.setDrawGridLines(false);
xAxis.setGridColor(Color.argb(204,255,255,255));
xAxis.setAxisLineColor(Color.TRANSPARENT);
xAxis.setValueFormatter(new TimestampValueFormatter());
xAxis.setLabelCount(4);
xAxis.setAvoidFirstLastClipping(true);
xAxis.setSpaceMin(10f);
添加初始数据或使用动态数据更新后,我调用以下命令:
invalidate();
fitScreen();
在 yaxis 和我的视图左侧以及右边距和我的视图右侧之间仍然存在边距。这个边距需要消失。
我试过使用 setExtraOffsets
但不幸的是它似乎限制了我看到的边距,因为我尝试设置负值但没有成功。
任何父项或图表本身均未设置填充或边距。将 Y 轴标签位置更改为外部时,它们看起来就像在使用视图的边缘,并且不受限于与将它们定位在内部时相同的边距。
我做错了什么?
编辑截图
使用 MPAndroidChart 3.0.1
通过从您在问题中提供的代码中删除这一行,我能够实现您想要的:
xAxis.setSpaceMin(10f); //DON'T NEED THIS!!
并添加以下代码:
mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
float xMin = 0;
xAxis.setAxisMaximum(xMax);
xAxis.setAxisMinimum(xMin);
Before:(注意左侧 xAxis 线与第一条 x-value 之间的边距为 0 - 这是不需要的)
After:(注意我们现在已经修复它所以没有边距并且第一个 x-value 根据 OP 与屏幕左侧齐平要求)
如果您有任何其他 UI 要求,您没有在问题中提及它们,所以这个答案似乎已经解决了您的问题。您可能还想考虑:
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your screenshot
完整的概念证明:
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v4.content.ContextCompat;
import android.view.Menu;
import android.view.WindowManager;
import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.formatter.DefaultAxisValueFormatter;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.utils.Utils;
import java.util.ArrayList;
public class LineChartActivity5 extends Activity {
private LineChart mChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_linechart);
mChart = (LineChart) findViewById(R.id.chart1);
mChart.setDrawGridBackground(false);
mChart.setDrawBorders(false);
mChart.getLegend().setEnabled(false);
mChart.setAutoScaleMinMaxEnabled(true);
mChart.setTouchEnabled(true);
mChart.setDragEnabled(true);
mChart.setScaleEnabled(true);
mChart.setPinchZoom(true);
mChart.setDoubleTapToZoomEnabled(false);
mChart.setBackgroundColor(Color.parseColor("#FF8000"));
mChart.getAxisRight().setEnabled(false);
mChart.getDescription().setEnabled(false);
final YAxis yAxis = mChart.getAxisLeft();
yAxis.setLabelCount(4,true);
yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
yAxis.setValueFormatter(new DefaultAxisValueFormatter(2));
yAxis.setTextColor(Color.WHITE);
yAxis.setTextSize(15f); //not in your original but added
yAxis.setGridColor(Color.argb(102,255,255,255));
yAxis.setAxisLineColor(Color.TRANSPARENT);
yAxis.setAxisMinimum(0); //not in your original but added
final XAxis xAxis = mChart.getXAxis();
xAxis.setDrawLimitLinesBehindData(true);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your spec
xAxis.setTextColor(Color.WHITE);
xAxis.disableGridDashedLine();
xAxis.setDrawGridLines(false);
xAxis.setGridColor(Color.argb(204,255,255,255));
xAxis.setAxisLineColor(Color.TRANSPARENT);
xAxis.setValueFormatter(new DefaultAxisValueFormatter(2)); //not in your original but added
//xAxis.setValueFormatter(new TimestampValueFormatter());
xAxis.setLabelCount(4);
xAxis.setAvoidFirstLastClipping(true);
//xAxis.setSpaceMin(10f); //DON'T NEED THIS!!
setData(16, 15);
mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
float xMin = 0;
xAxis.setAxisMaximum(xMax);
xAxis.setAxisMinimum(xMin);
}
private void setData(int count, float range) {
ArrayList<Entry> values = new ArrayList<Entry>();
for (int i = 0; i < count; i++) {
float val = (float) (Math.random() * range) + 3;
values.add(new Entry(i, val));
}
LineDataSet set1;
if (mChart.getData() != null &&
mChart.getData().getDataSetCount() > 0) {
set1 = (LineDataSet)mChart.getData().getDataSetByIndex(0);
set1.setValues(values);
mChart.getData().notifyDataChanged();
mChart.notifyDataSetChanged();
} else {
set1 = new LineDataSet(values, "DataSet 1");
set1.setColor(Color.WHITE);
set1.setCircleColor(Color.BLACK);
set1.setLineWidth(3f);
set1.setDrawCircles(false);
set1.setMode(LineDataSet.Mode.CUBIC_BEZIER);
set1.setValueTextSize(9f);
set1.setDrawValues(false);
set1.setDrawFilled(true);
set1.setFormLineWidth(1f);
set1.setFormSize(15.f);
if (Utils.getSDKInt() >= 18) {
// fill drawable only supported on api level 18 and above
Drawable drawable = ContextCompat.getDrawable(this, R.drawable.fade_orange);
set1.setFillDrawable(drawable);
}
else {
set1.setFillColor(Color.BLACK);
}
ArrayList<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
dataSets.add(set1); // add the datasets
// create a data object with the datasets
LineData data = new LineData(dataSets);
// set data
mChart.setData(data);
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.line, menu);
return true;
}
}