Chart config

BinderScriptNotebook

Config is an object that configures high level properties of the chart like making all chart elements editable or the tool bar on top

Image button options

Options for chart export can be set in the config at ToImageButtonOptions:

  • Three file formats for chart exports are supported (SVG, PNG, JPEG) and can be set as Format.

  • A predefined name for the downloaded chart can be set at Filename.

  • The dimensions of the downloaded chart are set at Width and Height.

  • The Scale defines the size of the exported svg.

The settings do not apply for the html document containing the chart but for charts that are exported by clicking the camera icon in the menu bar.

open Plotly.NET

let svgConfig =
    Config.init (
        ToImageButtonOptions = ToImageButtonOptions.init(
            Format = StyleParam.ImageFormat.JPEG,
            Filename = "mySvgChart",
            Width = 900.,
            Height = 600.,
            Scale = 10.
        )
    )

let svgButtonChart = 
    Chart.Point([(1.,2.)])
    |> Chart.withConfig svgConfig

Static plots

To create a static plot that has no hoverable elements, use StaticPlot=true on the Config:

let staticConfig = Config.init(StaticPlot=true)

let staticPlot =
    Chart.Point([(1.,2.)])
    |> Chart.withConfig staticConfig

Editable charts

You can define fields that can be edited on the chart by setting Editable = true on the config, optionally explicitly setting the editable parts via EditableAnnotations

let editableConfig = 
    Config.init(
        Editable = true,
        EditableAnnotations = [
            StyleParam.AnnotationEditOptions.LegendPosition
            StyleParam.AnnotationEditOptions.AxisTitleText
            StyleParam.AnnotationEditOptions.LegendText
        ]
    )

let editablePlot =
    Chart.Point([(1.,2.)])
    |> Chart.withConfig editableConfig

Responsive charts

To create a chart that is reponsive to its container size, use Responsive=true on the Config:

(try resizing the window)

let responsiveConfig = Config.init(Responsive=true)

let responsivePlot =
    Chart.Point([(1.,2.)])
    |> Chart.withConfig responsiveConfig
namespace Plotly
namespace Plotly.NET
val svgConfig : Config
Multiple items
type Config = inherit DynamicObj new : unit -> Config static member init : ?StaticPlot:bool * ?Autosizable:bool * ?Responsive:bool * ?ShowEditInChartStudio:bool * ?ToImageButtonOptions:ToImageButtonOptions * ?Editable:bool * ?EditableAnnotations:seq<AnnotationEditOptions> -> Config static member style : ?StaticPlot:bool * ?Autosizable:bool * ?Responsive:bool * ?ToImageButtonOptions:ToImageButtonOptions * ?ShowEditInChartStudio:bool * ?Editable:bool * ?EditableAnnotations:seq<AnnotationEditOptions> -> (Config -> Config)
<summary> Config </summary>

--------------------
new : unit -> Config
static member Config.init : ?StaticPlot:bool * ?Autosizable:bool * ?Responsive:bool * ?ShowEditInChartStudio:bool * ?ToImageButtonOptions:ToImageButtonOptions * ?Editable:bool * ?EditableAnnotations:seq<StyleParam.AnnotationEditOptions> -> Config
Multiple items
type ToImageButtonOptions = inherit DynamicObj new : unit -> ToImageButtonOptions static member init : ?Format:ImageFormat * ?Filename:string * ?Width:float * ?Height:float * ?Scale:float -> ToImageButtonOptions static member style : ?Format:ImageFormat * ?Filename:string * ?Width:float * ?Height:float * ?Scale:float -> (ToImageButtonOptions -> ToImageButtonOptions)

--------------------
new : unit -> ToImageButtonOptions
static member ToImageButtonOptions.init : ?Format:StyleParam.ImageFormat * ?Filename:string * ?Width:float * ?Height:float * ?Scale:float -> ToImageButtonOptions
Multiple items
type Format<'Printer,'State,'Residue,'Result> = PrintfFormat<'Printer,'State,'Residue,'Result>
<summary>Type of a formatting expression.</summary>
<typeparam name="Printer">Function type generated by printf.</typeparam>
<typeparam name="State">Type argument passed to %a formatters</typeparam>
<typeparam name="Residue">Value generated by the overall printf action (e.g. sprint generates a string)</typeparam>
<typeparam name="Result">Value generated after post processing (e.g. failwithf generates a string internally then raises an exception)</typeparam>
<category>Language Primitives</category>


--------------------
type Format<'Printer,'State,'Residue,'Result,'Tuple> = PrintfFormat<'Printer,'State,'Residue,'Result,'Tuple>
<summary>Type of a formatting expression.</summary>
<typeparam name="Printer">Function type generated by printf.</typeparam>
<typeparam name="State">Type argument passed to %a formatters</typeparam>
<typeparam name="Residue">Value generated by the overall printf action (e.g. sprint generates a string)</typeparam>
<typeparam name="Result">Value generated after post processing (e.g. failwithf generates a string internally then raises an exception)</typeparam>
<typeparam name="Tuple">Tuple of values generated by scan or match.</typeparam>
<category>Language Primitives</category>
module StyleParam from Plotly.NET
type ImageFormat = | SVG | PNG | JPEG static member convert : (ImageFormat -> obj) static member toString : (ImageFormat -> string)
union case StyleParam.ImageFormat.JPEG: StyleParam.ImageFormat
val svgButtonChart : GenericChart.GenericChart
type Chart = static member Area : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowMarkers:bool * ?Showlegend:bool * ?MarkerSymbol:Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Dash:DrawingStyle * ?Width:float -> GenericChart + 1 overload static member Bar : keys:seq<#IConvertible> * values:seq<#IConvertible> * ?Name:string * ?Showlegend:bool * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Marker:Marker -> GenericChart + 1 overload static member BarPolar : r:seq<#IConvertible> * theta:seq<#IConvertible> * ?Name:string * ?Showlegend:bool * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Dash:DrawingStyle * ?LineWidth:float -> GenericChart static member BoxPlot : ?x:'a0 * ?y:'a1 * ?Name:string * ?Showlegend:bool * ?Color:string * ?Fillcolor:'a2 * ?Opacity:float * ?Whiskerwidth:'a3 * ?Boxpoints:Boxpoints * ?Boxmean:BoxMean * ?Jitter:'a4 * ?Pointpos:'a5 * ?Orientation:Orientation * ?Marker:Marker * ?Line:Line * ?Alignmentgroup:'a6 * ?Offsetgroup:'a7 * ?Notched:bool * ?NotchWidth:float * ?QuartileMethod:QuartileMethod -> GenericChart + 1 overload static member Bubble : x:seq<#IConvertible> * y:seq<#IConvertible> * sizes:seq<#IConvertible> * ?Name:string * ?Showlegend:bool * ?MarkerSymbol:Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?StackGroup:string * ?Orientation:Orientation * ?GroupNorm:GroupNorm * ?UseWebGL:bool -> GenericChart + 1 overload static member Bubble3d : x:seq<#IConvertible> * y:seq<#IConvertible> * z:seq<#IConvertible> * sizes:seq<#IConvertible> * ?Name:string * ?Showlegend:bool * ?MarkerSymbol:Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font -> GenericChart + 1 overload static member BubblePolar : r:seq<#IConvertible> * theta:seq<#IConvertible> * sizes:seq<#IConvertible> * ?Name:string * ?Showlegend:bool * ?MarkerSymbol:Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?UseWebGL:bool -> GenericChart + 1 overload static member Candlestick : open:seq<#IConvertible> * high:seq<#IConvertible> * low:seq<#IConvertible> * close:seq<#IConvertible> * x:seq<#IConvertible> * ?Increasing:Line * ?Decreasing:Line * ?WhiskerWidth:float * ?Line:Line * ?XCalendar:Calendar -> GenericChart + 1 overload static member ChoroplethMap : locations:seq<string> * z:seq<#IConvertible> * ?Text:seq<#IConvertible> * ?Locationmode:LocationFormat * ?Autocolorscale:bool * ?Colorscale:Colorscale * ?ColorBar:ColorBar * ?Marker:Marker * ?GeoJson:'a2 * ?FeatureIdKey:string * ?Zmin:float * ?Zmax:float -> GenericChart static member ChoroplethMapbox : locations:seq<#IConvertible> * z:seq<#IConvertible> * geoJson:'a2 * ?FeatureIdKey:string * ?Text:seq<#IConvertible> * ?Below:string * ?Colorscale:Colorscale * ?ColorBar:ColorBar * ?ZAuto:bool * ?ZMin:float * ?ZMid:float * ?ZMax:float -> GenericChart ...
<summary> Provides a set of static methods for creating charts. </summary>
static member Chart.Point : xy:seq<#System.IConvertible * #System.IConvertible> * ?Name:string * ?Showlegend:bool * ?MarkerSymbol:StyleParam.Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#System.IConvertible> * ?TextPosition:StyleParam.TextPosition * ?TextFont:Font * ?StackGroup:string * ?Orientation:StyleParam.Orientation * ?GroupNorm:StyleParam.GroupNorm * ?UseWebGL:bool -> GenericChart.GenericChart
static member Chart.Point : x:seq<#System.IConvertible> * y:seq<#System.IConvertible> * ?Name:string * ?Showlegend:bool * ?MarkerSymbol:StyleParam.Symbol * ?Color:string * ?Opacity:float * ?Labels:seq<#System.IConvertible> * ?TextPosition:StyleParam.TextPosition * ?TextFont:Font * ?StackGroup:string * ?Orientation:StyleParam.Orientation * ?GroupNorm:StyleParam.GroupNorm * ?UseWebGL:bool -> GenericChart.GenericChart
static member Chart.withConfig : config:Config -> (GenericChart.GenericChart -> GenericChart.GenericChart)
module GenericChart from Plotly.NET
<summary> Module to represent a GenericChart </summary>
val toChartHTML : gChart:GenericChart.GenericChart -> string
<summary> Converts a GenericChart to it HTML representation. The div layer has a default size of 600 if not specified otherwise. </summary>
val staticConfig : Config
val staticPlot : GenericChart.GenericChart
val editableConfig : Config
type AnnotationEditOptions = | AnnotationPosition | AnnotationTail | AnnotationText | AxisTitleText | ColorbarPosition | ColorbarTitleText | LegendPosition | LegendText | ShapePosition static member toString : aeo:AnnotationEditOptions -> string static member convert : (AnnotationEditOptions -> obj)
<summary> Editable parts of a chart that can be set via Chart config. </summary>
union case StyleParam.AnnotationEditOptions.LegendPosition: StyleParam.AnnotationEditOptions
<summary> Enables moving the legend. </summary>
union case StyleParam.AnnotationEditOptions.AxisTitleText: StyleParam.AnnotationEditOptions
<summary> Enables editing axis title text. </summary>
union case StyleParam.AnnotationEditOptions.LegendText: StyleParam.AnnotationEditOptions
<summary> Enables editing the trace name fields from the legend </summary>
val editablePlot : GenericChart.GenericChart
val responsiveConfig : Config
val responsivePlot : GenericChart.GenericChart