如何在曲线上找到点并显示它们?

时间:2012-03-12 22:03:36

标签: processing interpolation point curve

所以我有这个代码从数组中获取数据并绘制曲线:

void drawDataLine(int row) {  
  beginShape();
  for (int col = 0; col < colCount; col++) {
    if (data.isValid(row, col)) {
      float value = data.getPoint(row, col);
      float x = map(years[col], yearMin, yearMax, plotX1, plotX2);
      float y = map(value, dataMin, dataMax, plotY2, plotY1); 
      //vertex(x,y) ;    
      curveVertex(x, y);
      // Double the curve points for the start and stop
      if ((col == 0) || (col == colCount-1)) {
        curveVertex(x, y);
      }
    }
  }
  endShape();
}

我有另一个函数,当光标在点的3个像素内时显示数据值:

  for (int col = 0; col < colCount; col++) {

  if (data.isValid(row, col)) { 
      float radVal = ratio[col];
      float value = data.getPoint(row, col); 
      float compareValue = compare.getPoint(row, col);
      float x = map(years[col], yearMin, yearMax, plotX1, plotX2); 
      float y = map(value, dataMin, dataMax, plotY2, plotY1);
      float ellipse1MapVal = map(value, ellipse1Min, ellipse1Max, 10, 80);
      float ellipse2MapVal = map(compareValue, ellipse1Min, ellipse1Max, 10, 80); 
      radVal = map(radVal, radMin, radMax, 1, 7); 

      if (dist(mouseX, mouseY, x, y) < 3) {
        if (drawCirclesPrimary || drawCirclesSecondary) { 
          noStroke();
          if (drawCirclesPrimary) {
            fill(0, 255, 0, 100);
            ellipse(x, y, ellipse1MapVal, ellipse1MapVal);
          }
          if (drawCirclesSecondary) {
            fill(255, 0, 0, 100);
            ellipse(x, y, ellipse2MapVal, ellipse2MapVal);
          }
          fill(0);
          stroke(0);
          pushMatrix();
          translate(x, y);
          rotate(radians(radSec));
          line(0, -ellipse1MapVal/2, 0, ellipse1MapVal/2);
          popMatrix();
          radSec += radVal;
          textSize(10);
          textAlign(CENTER);
          text(nf(value, 0, 2) + " (" + years[col] + ")"+nf(compareValue, 0, 2), x, y-8);
        }
        else
          text(nf(value, 0, 2) + " (" + years[col] + ")", x, y-8);
      }
      if ((mouseX < x+3)&&(mouseX > x-3))
      {
        stroke(150);
        strokeWeight(1);
        line(x, plotY1, x, plotY2);
      } } }} 

现在的问题是,curveVertex会进行插值并制作漂亮的曲线,但除了我已经拥有的曲线之外,我无法得到这些曲线上的点。我想要的是光标显示图表上所有点的值,而不是我在阵列上的10个点,就像谷歌或雅虎财经上的图表。在加工方面我是一个菜鸟,所以对此的任何帮助将不胜感激。

此致

1 个答案:

答案 0 :(得分:0)

curveVertex使用 Catmull-Rom样条来计算点之间的插值曲线。 libGDX 在Java中实现了Catmull-Rom。

请参阅:http://code.google.com/p/libgdx/

计算样条曲线的具体源代码如下: http://code.google.com/p/libgdx/source/browse/trunk/gdx/src/com/badlogic/gdx/math/CatmullRomSpline.java