Question

如何在Canvas上绘制二次曲线或三角曲线（例如sin(x)）？

Answer 1

和你一样，我需要画一条从point(x1, y1)到point (x2, y2)的曲线。我做了一些搜索，引导我到Path类（android.graphics.Path）。 Path有许多绘制线条的方法。创建路径后，使用draw方法创建实际线。可以旋转，转换，保存和添加路径。还有用这个类绘制的弧形，圆形和矩形。

http://developer.android.com/reference/android/graphics/Path.html

设置路径起点→mPath.moveTo(x1, y1);

设置常量和终点→mPath.quadTo(cx, cy, x2, y2);

将路径转换为行→canvas.drawPath(mPath, mPaint);

Answer 2

这是我为Graph类编写的drawEquation（）方法 - 我认为它可能有所帮助。创建一个接受方程式（基本上只是一个函数）的方法的基本思路，如

function(x) = Math.sin(x);

然后遍历图形的边界并绘制连接每个点的小段。 transformContext（）只是反转画布上下文，以便y的增加值向上而不是向下：

Graph.prototype.transformContext = function(){
    var canvas = this.canvas;
    var context = this.context;

    // move context to center of canvas
    this.context.translate(this.centerX, this.centerY);

    // stretch grid to fit the canvas window, and 
    // invert the y scale so that that increments
    // as you move upwards
    context.scale(this.scaleX, -this.scaleY);
};

Graph.prototype.drawEquation = function(equation, color, thickness){
    var canvas = this.canvas;
    var context = this.context;

    context.save();
    this.transformContext();

    context.beginPath();
    context.moveTo(this.minX, equation(this.minX));

    for (var x = this.minX + this.iteration; x <= this.maxX; x += this.iteration) {
        context.lineTo(x, equation(x));
    }

    context.restore();
    context.lineJoin = "round";
    context.lineWidth = thickness;
    context.strokeStyle = color;
    context.stroke();

};

Answer 3

大多数绘图API不提供此类功能，您必须使用对canvas API的一次或多次调用，以像素为单位计算所需曲线的像素，并在画布上逐个绘制。

Answer 4

使用Canvas.drawPath和Path.quadTo。

Answer 5

我将假设您熟悉在画布上绘制基本线条，如果没有，则回复，我们可以进一步深入研究。但是，就只是绘制一个正弦函数而言，Math类中有一个函数可以满足您的需要。 http://download.oracle.com/javase/1.4.2/docs/api/java/lang/Math.html#sin%28double%29 从那里你只需要将你的x变量（以弧度表示）传递给函数并将其输出保存为y变量。这表示图表上的一个点。现在将x1变量增加一小部分（可能是图形的1/100，尽管你需要调整它来尝试），再次运行它并将这些变量（x2和y2）保存为第二点。在这两点之间画一条线。将x2，y2变量保存为x1，y1并再次递增x值以找到第三个点，依此类推。这不是一条“真实”的曲线，因为它实际上只是一系列与函数近似的线，如果你愿意的话，这是一种微积分的方法。

所以：

x1 = x; //其中x是x轴上的某个点，您想要开始绘制图形。

y1 = sin（x）;

x2 = x1 +增量;

y2 = sin（x2）;

//在这里画一条线

x1 = x2; y1 = y2;

//返回顶部，这段代码显然是在一个循环中，其中使用递增，因为它自己的增量，初始值等于你想要每次递增的量（让我们说.... 5）和“next”语句为increment = increment + 5.

还有一个我不熟悉的GraphCanvas类，它似乎采用了相同的点并在它们之间绘制曲线，但我不确定使用什么类型的变换来绘制曲线以及它是多么准确。这是班级： http://www.java2s.com/Code/Java/Swing-Components/GraphCanvas.htm

在画布上画一条弯曲的路径？

5 个答案: