Skip to main content

FibonacciExtensionAnnotation

FibonacciExtensionAnnotationšŸ“˜ draws projected Fibonacci levels after three placed points. Points 1 and 2 guide the trend height; point 3 sets the start offset for the projection. After the first two points define an upward move, the third point anchors where the extension begins.

    sciChartSurface.annotations.add(
        new FibonacciExtensionAnnotation({
            // Points 1-2 measure the upward move. Point 3 anchors the extension start.
            points: [
                { x: 2, y: 1 },
                { x: 3, y: 3 },
                { x: 7, y: 4 }
            ],
            thresholds: [0, 0.382, 0.618, 1, 1.272, 1.618, 2.618],
            regionColors: ["#0EA5E9", "#22C55E", "#F97316"], // if more regions exist than passed here we'll interpolate extra ones for you
            fillOpacity: 0.16,
            strokeThickness: 2,
            extendStart: false, // both defaut to false
            extendEnd: true,
            fibonacciLabelPlacement: EFibonacciLabelPlacement.Left,
            fibonacciLabelColorMode: EFibonacciLabelColorMode.SingleColor,
            fibonacciLabelColor: "#111827",
            formatFibonacciLabel: ({ thresholdLabel, valueLabel }) => `${thresholdLabel} (${valueLabel})`,
            // strokeDashArray: [5, 2],

            // other properties
            labels: [
                { 
                    id: "trend-start", 
                    anchorMode: EMultiPointLabelAnchorMode.Axis, 
                    axisLabelDrawMode: EAxisLabelDrawMode.X,
                    pointIndex: 1
                },
                { 
                    id: "trend-end", 
                    anchorMode: EMultiPointLabelAnchorMode.Axis, 
                    axisLabelDrawMode: EAxisLabelDrawMode.X,
                    pointIndex: 2
                }
            ],
            isEditable: true,
            gripVisibility: EAnnotationVisibilityMode.Always, // to see the svg grips even when the annotation is not selected
            axisLabelStroke: "#FFF"
        })
    );

Fibonacci extensions always use horizontal levels. The inherited verticalOnlyšŸ“˜ property returns true for this annotation because the third point controls the projection offset instead of switching to skewed mode.

The shared Fibonacci properties work the same as retracements: thresholdsšŸ“˜ choose the projected ratios, regionColorsšŸ“˜ style the bands, and formatFibonacciLabelšŸ“˜ formats each level label.

Before projection, each extension level runs from point 2's X value to point 3's X value. The demo uses extendStart: true and extendEnd: false to continue the levels and colored bands backwards from point 2.

See Alsoā€‹