In [ ]:
#r "nuget: Plotly.NET, 2.0.0"
#r "nuget: Plotly.NET.Interactive, 2.0.0"

Annotations

BinderScriptNotebook

Summary: This example shows how to create Images and add them to the Charts in F#.

let's first create some data for the purpose of creating example charts:

In [3]:
open Plotly.NET 
  
let x  = [1.; 2.; 3.; 4.; 5.; 6.; 7.; 8.; 9.; 10.; ]
let y' = [2.; 1.5; 5.; 1.5; 3.; 2.5; 2.5; 1.5; 3.5; 1.]

use the LayoutImage.init function to generate an image, and either the Chart.withLayoutImage or the Chart.withLayoutImages function to add multiple annotations at once.

In [4]:
open Plotly.NET.LayoutObjects

let image = 
    LayoutImage.init(
        Source="https://fsharp.org/img/logo/fsharp.svg",
        XRef="x",
        YRef="y",
        X=0,
        Y=3,
        SizeX=2,
        SizeY=2,
        Sizing=StyleParam.LayoutImageSizing.Stretch,
        Opacity=0.5,
        Layer=StyleParam.Layer.Below
    )

let imageChart =
    Chart.Line(x,y',Name="line")    
    |> Chart.withLayoutImage(image)
In [ ]:
imageChart
Out[ ]: