1

棒グラフでユーザーが選択した特定の棒の色を変更する必要があります。ユーザーがバーを選択するたびに、そのバーの色を変更したいのですが、ユーザーがバーの選択を変更すると、最後に選択したバーがデフォルトの色として表示されます。

注:ある投稿で、選択したバーを含むシリーズをもう 1 つ使用する必要があることを確認しました。しかし、それを理解するにはサンプルコードが必要です。

private String[] mMonth = new String[] { "January", "Feburary", "March", "April", "May", "June", "July", "Aug", "Sep", "Oct", "Nov", "Dec" };
int[] x = { 0, 1, 2, 3, 4, 5, 6, 7 };
int[] income = { 2000, 2500, 2700, 3000, 2800, 3500, 3700, 3800 };
public static final String TYPE = "type";
private XYMultipleSeriesDataset mDataset = getDemoDataset();
private XYMultipleSeriesRenderer mRenderer = getDemoRenderer();
private GraphicalView mChartView;



protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.xy_chart);
    if (mChartView == null) {
        LinearLayout layout = (LinearLayout) findViewById(R.id.chart);
        mChartView = ChartFactory.getBarChartView(this, mDataset, mRenderer, Type.DEFAULT);
        mRenderer.setSelectableBuffer(100);
        layout.addView(mChartView, new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
    } else {
        mChartView.repaint();
    }

    mChartView.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            // handle the click event on the chart
              SeriesSelection seriesSelection = mChartView.getCurrentSeriesAndPoint();
              if (seriesSelection == null) {
                Toast.makeText(NewTest.this, "No chart element", Toast.LENGTH_SHORT).show();
              } else {  


                  for (int i = 0; i < x.length; i++) {
                      SimpleSeriesRenderer renderer = mRenderer.getSeriesRendererAt(seriesSelection.getSeriesIndex());
                      renderer.setColor(Color.RED);  
                    }


                    mChartView.repaint();

                // display information of the clicked point
                Toast.makeText(
                        NewTest.this,
                    "Chart element in series index " + seriesSelection.getSeriesIndex()
                        + " data point index " + seriesSelection.getPointIndex() + " was clicked"
                        + " closest point value X=" + seriesSelection.getXValue() + ", Y="
                        + seriesSelection.getValue(), Toast.LENGTH_SHORT).show();
              }
        }
    });

}

 private XYMultipleSeriesDataset getDemoDataset() {

        XYSeries incomeSeries = new XYSeries("Income");
        for (int i = 0; i < x.length; i++) {
            incomeSeries.add(i, income[i]);
        }

        XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
        dataset.addSeries(incomeSeries);
        return dataset;

    }

 private XYMultipleSeriesRenderer getDemoRenderer() {
        XYSeriesRenderer incomeRenderer =  new XYSeriesRenderer();
        incomeRenderer.setColor(Color.rgb(130, 130, 230));
        incomeRenderer.setFillPoints(true);
        incomeRenderer.setLineWidth(2);
        incomeRenderer.setChartValuesTextAlign(Align.CENTER);
        incomeRenderer.setChartValuesSpacing(15);
        incomeRenderer.setDisplayChartValues(true);

        XYMultipleSeriesRenderer multiRenderer = new XYMultipleSeriesRenderer();
        multiRenderer.setXLabels(0);
        multiRenderer.setYLabelsPadding(15);
        multiRenderer.setBarSpacing(0.3f);
        multiRenderer.setBarWidth(30);
        multiRenderer.setChartTitle("Income Chart");
        multiRenderer.setXTitle("Year 2013");
        multiRenderer.setYTitle("Amount in Dollars");
        //multiRenderer.setZoomLimits(1.0,0.7,1.0,3000.0);
        multiRenderer.setZoomButtonsVisible(true);
        //multiRenderer.setZoomEnabled(true, true);
        //multiRenderer.setPanEnabled(true, true);
        multiRenderer.setInScroll(true);
        multiRenderer.setXAxisMin(-0.5);
        multiRenderer.setXAxisMax(7);
        multiRenderer.setYAxisMin(0);
        multiRenderer.setYAxisMax(4000);

        multiRenderer.setMargins(new int[] {30, 50, 20, 10});
        multiRenderer.setClickEnabled(true);
        multiRenderer.setShowGridX(true);


        for (int i = 0; i < x.length; i++) {
            multiRenderer.addXTextLabel(i, mMonth[i]);
        }

        multiRenderer.addSeriesRenderer(incomeRenderer);
        return multiRenderer;
    }

}

4

2 に答える 2

0

まだ興味がある方へ。別のシリーズを追加する必要はありません (そして、それは別々に描画されます)。以下の例のように、チャートを拡張して描画することができます。(私のプロジェクトでは、GestureDetector と ScaleGestureDetector を介して独自のスクロール/ズームを使用し、onClick の代わりに GestureDetector の onSingleTapUp を使用します)。以下のクラスから getView を使用して、チャートのビューのインスタンスを取得します。

public class SelectableBarChart extends BarChart {

private int selectedSeriesIndex = -1;
private int selectedBar = -1;
private final int highlightColor;
private OnBarSelectedListener barSelectedListener;

public static interface OnBarSelectedListener {
    void onBarSelected(SeriesSelection seriesSelection);
}

public void setBarSelectedListener(OnBarSelectedListener barSelectedListener) {
    this.barSelectedListener = barSelectedListener;
}

public static GraphicalView getView(Context context, XYMultipleSeriesDataset dataset, XYMultipleSeriesRenderer renderer, Type type, int highlightColor) {
    final SelectableBarChart chart = new SelectableBarChart(dataset, renderer, type, highlightColor);
    final GraphicalView graphicalView = new GraphicalView(context, chart);
    graphicalView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            chart.onClick(graphicalView);
        }
    });
    return graphicalView;
}

public void onClick(GraphicalView view) {
    onSelectionTap(view, view.getCurrentSeriesAndPoint());
}

protected void onSelectionTap(GraphicalView view, SeriesSelection seriesSelection) {
    if (seriesSelection != null) {
        selectedSeriesIndex = seriesSelection.getSeriesIndex();
        XYSeries selectedSeries = getDataset().getSeriesAt(selectedSeriesIndex);
        selectedBar = selectedSeries.getIndexForKey(seriesSelection.getXValue());
    }
    if (barSelectedListener != null)
        barSelectedListener.onBarSelected(seriesSelection);
    view.repaint();
}

@Override
public void drawSeries(Canvas canvas, Paint paint, List<Float> points, SimpleSeriesRenderer seriesRenderer, float yAxisValue, int seriesIndex, int startIndex) {
    int seriesNr = mDataset.getSeriesCount();
    boolean selectedSeries = seriesIndex == selectedSeriesIndex;
    int length = points.size();
    paint.setStyle(Paint.Style.FILL);
    float halfDiffX = getHalfDiffX(points, length, seriesNr);
    for (int i = 0; i < length; i += 2) {
        paint.setColor(selectedSeries && i == 2*(selectedBar-startIndex) ? highlightColor : seriesRenderer.getColor());
        float x = points.get(i);
        float y = points.get(i + 1);
        drawBar(canvas, x, yAxisValue, x, y, halfDiffX, seriesNr, seriesIndex, paint);
    }
    paint.setColor(seriesRenderer.getColor());
}

}

于 2014-08-11T18:43:59.153 に答える
0

チャート ビューでクリック イベントを処理しているようです。すべての棒シリーズには独自の色があります。別の色のバーを作成するには、別のシリーズに属している必要があります。この場合、バーが属しているシリーズからバーを削除し、選択したバーという 1 つの項目のみを含む別のシリーズを追加する必要があります。

2 回目のクリックで、上記の操作を逆にします。

于 2013-09-01T12:03:39.863 に答える