1 Reply Latest reply on Mar 6, 2012 4:53 AM by bmeutzner

    How to find intersection point between a lineseries and a vertical line.

    Jayakrishnan KK

      I have a lineseries chart (refer the screenshot). As I move the spend slider shown in the attachment, a vertical line is drawn in the chart. (I did this using the cartesian canvas as annotation element - using canvas.moveTo(), canvas.lineTo() functions)

       

      I want to find out the intersection point(y value) where the vertical line meets the lineseries. Can someone help me on this. It will be really helpful.

       

      Thanks,

      Jayakrishnan

       

      curve.png

        • 1. Re: How to find intersection point between a lineseries and a vertical line.
          bmeutzner

          Here are a few functions I wrote years ago for common chart transformations... the function you're going to focus on for your solution is chartToScreen...

           

           

           

           

          /**
           *  Converts the screen position to chart value position
           *  @param thePos - Number - The position you want to convert
           *  @private
           */
                  private function getChartCoordinates(thePos:Point):Object
                    {
                         var tmpArray:Array = dataTransform.invertTransform(thePos.x, thePos.y);
                         return {x:tmpArray[0], y:tmpArray[1]};
                    }     
                    
          
          /**
           *  Takes a non-numeric chart value and returns a proper numeric value
           *  @param inValue - String - The display name of the instance showing on the axis (eg. if we're showing months, it might be 'Sep - 06'
           *  @param theAxis - IAxis - The axis on which we're looking
           */
                    public function getNumericChartValue(inValue:String, theAxis:IAxis):Object
                    {
                         var axisCache:Array = new Array({inValue: inValue})                  
                         if(!(theAxis is LinearAxis))
                         {
                              theAxis.mapCache(axisCache, "inValue", "outValue", true);
                              return {numericValue: axisCache[0].outValue}
                         }
                         else
                         {
                              return {numericValue: Number(inValue)};
                         }
                    }
                    
          
          /**
           *  Converts the chart values into screen coordinate values
           *  @param chartX - Number - The display name of the instance showing on the axis (eg. if we're showing months, it might be 'Sep - 06'
           *  @param chartY - Number - The axis on which we're looking
           */
                    public function chartToScreen(chartX:Number, chartY:Number, theSeries:Series):Point
                    {
                         var tmpCache:Array = new Array({chartX:chartX, chartY:chartY});
                         if(theSeries) 
                         {
                              theSeries.dataTransform.transformCache(tmpCache, "chartX", "screenX", "chartY", "screenY");
                         }
                         else
                         {
                              dataTransform.transformCache(tmpCache, "chartX", "screenX", "chartY", "screenY");
                         }
                         return new Point(Math.round(tmpCache[0].screenX), Math.round(tmpCache[0].screenY));
                       
                    }
          
                    
          /**
           *  takes a point in mouse position, and runs it through converting to chart coordinates, converts chart coordinate to numeric value if needed
           *  and then back into mouse position to get the nearest axis snap point
           *  @param thePoint - Point - The position we're converting
           *  @private
           */
                    private function getSnapPosition(thePoint:Point):Point
                    {
                         var chartPoint:Object = getChartCoordinates(new Point(thePoint.x, thePoint.y));
                         
                         //if either of the axis chart results is not in numeric format, we get the numeric equivalent of it
                         var chartX:* = chartPoint.x;
                         var chartY:* = chartPoint.y;
                         chartX = getNumericChartValue(chartPoint.x, CartesianChart(this.chart).horizontalAxis).numericValue;
                         chartY = getNumericChartValue(chartPoint.y, CartesianChart(this.chart).verticalAxis).numericValue;
                         return chartToScreen(chartX, chartY, null);
                    }
               }