Geek asks and answers

Android - Fill the color below the line chart

I am building a line chart for one of our applications. The linear part of the diagram works fine, but now I have to fill in the area under the line with color, something like this image below.

enter image description here

I use this code to draw a string into a bitmap using canvas.

    List<Float> xCoordinates = (List<Float>) coordinates[0];
    List<Float> yCoordinates = (List<Float>) coordinates[1];

    for (int i = 0; i < xCoordinates.size(); i++) {
        if (!firstSet) {
            x = xCoordinates.get(i);
            y = yCoordinates.get(i);
            p.moveTo(x, y);
            firstSet = true;
        } else {
            x = xCoordinates.get(i);
            y = yCoordinates.get(i);
            p.lineTo(x, y);
        }
    }

    textureCanvas.drawPath(p, pG);

What do I need to know, is there a way to easily find the area under the line and make it color, or do I need to calculate each area between 3 points for the graph and fill it with color?

I cannot use existing chart libraries, for example, AchartEngine , ChartDroid , aFreeChart .

+5
source share
1 answer

, , , , . , .

    List<Float> xCoordinates = coordinates.first;
    List<Float> yCoordinates = coordinates.second;
    for (int i = 0; i < xCoordinates.size(); i++) {
        if (!firstSet) {
            x = xCoordinates.get(i);
            y = yCoordinates.get(i);
            linePath.moveTo(x, y);

            erasePath.moveTo(x, 0);
            erasePath.lineTo(x, y);

            firstSet = true;
        } else {
            x = xCoordinates.get(i);
            y = yCoordinates.get(i);
            linePath.lineTo(x, y);
            erasePath.lineTo(x, y);
        }
    }

    erasePath.lineTo(getWidth(), y);
    erasePath.lineTo(getWidth(), 0);
    erasePath.lineTo(0, 0);

    getTextureCanvas().drawPath(erasePath, clear);
    getTextureCanvas().drawPath(linePath, pG);

:

enter image description here

- . , .

+6

More articles:


All Articles