0

我正在尝试创建一个图形计算器并使其在“画布”上正确显示图形。当我加载 HTML 文件并写 x 例如它从左上角开始向下到右下角。所以问题是它显示图表是倒置的，它不包括负值。我知道画布从左上角的像素值 (0,0) 开始，到右下角的 (300,300) 结束。我希望它显示这个链接中的绿色画布之类的东西： http ://www.cse.chalmers.se/edu/course/TDA555/lab4.html

points :: Expr -> Double -> (Int,Int) -> [Point]
points exp scale (x, y) = [(x, realToPix (eval exp (pixToReal x))) | x<-[0..(fromIntegral canWidth)] ]
              where
              pixToReal :: Double -> Double  --converts a pixel x-coordinate to a real x-coordinate
              pixToReal x = x * 0.02
              realToPix :: Double -> Double  --converts a real y-coordinate to a pixel y-coordinate
              realToPix y = y / 0.02
4

1 回答 1

1

您可能习惯于使用正面y向上的 2D 坐标系，但正如您在 HTML 画布中所指出的，正面y向下。要模拟您想要的坐标系，您需要翻转y线上的所有 - 值y=0（也称为x- 轴）。

以下是一些y可用作测试的值及其相应的更正。请注意，我假设y已经正确缩放；看起来你已经得到了那个部分。

  • 150 -> 0
  • 0 -> 150
  • -150 -> 300

该模式是y_new = -(y_old - 150)150 所在的位置canvas_height/2。因此，缩放后，您需要将此公式应用于所有y值。

要将y-axis 移动到中心，您需要做同样的事情来推导适当的线性变换。

于 2016-10-27T23:36:34.297 回答