Refactor Config creation andadd convenience functions to ChartA API

Author: kMutagene

docs/00_3_chart-config.fsx

@@ -105,11 +105,11 @@ You can define fields that can be edited on the chart by setting `Editable = tru
 let editableConfig = 
     Config.init(
         Editable = true,
-        EditableAnnotations = [
-            StyleParam.AnnotationEditOptions.LegendPosition
-            StyleParam.AnnotationEditOptions.AxisTitleText
-            StyleParam.AnnotationEditOptions.LegendText
-        ]
+        Edits = Edits.init(
+            LegendPosition  = true,
+            AxisTitleText   = true,
+            LegendText      = true
+        )
     )
 
 let editablePlot =

src/Plotly.NET/ChartAPI/Chart.fs

@@ -2,6 +2,7 @@ namespace Plotly.NET
 
 open Plotly.NET.LayoutObjects
 open Plotly.NET.TraceObjects
+open Plotly.NET.ConfigObjects
 
 open DynamicObj
 open System
@@ -18,7 +19,7 @@ type Chart =
     //==============================================================================================================
 
     /// <summary>
-    /// Saves the given Chart as html file at the given path (.html file extension is added if not present). 
+    /// Saves the given Chart as html file at the given path (.html file extension is added if not present).
     /// Optionally opens the generated file in the browser.
     /// </summary>
     /// <param name="path">The path to save the chart html at.</param>
@@ -55,7 +56,7 @@ type Chart =
     /// Saves the given chart as a temporary html file containing a static image of the chart and opens it in the browser.
     ///
     /// IMPORTANT: this is not the same as static image generation. The file still needs to be opened in the browser to generate the image, as it is done via a js script in the html.
-    /// 
+    ///
     /// For real programmatic static image export use Plotly.NET.ImageExport (https://www.nuget.org/packages/Plotly.NET.ImageExport/)
     ///
     /// This yields basically the same results as using `StaticPlot = true` for the chart's config.
@@ -729,11 +730,19 @@ type Chart =
     //======================================= General Layout object styling ========================================
     //==============================================================================================================
 
+    // <summary>
+    /// Sets the given layout on the input chart.
+    ///
+    /// If there is already an layout set, the object is replaced.
+    /// </summary>
+    [<CompiledName("SetLayout")>]
+    static member setLayout(layout: Layout) =
+        (fun (ch: GenericChart) -> GenericChart.setLayout layout ch)
 
     /// <summary>
     /// Sets the given layout on the input chart.
     ///
-    /// If there is already an layout set at the given id, the axis objects are combined.
+    /// If there is already an layout set, the objects are combined.
     /// </summary>
     [<CompiledName("WithLayout")>]
     static member withLayout(layout: Layout) =
@@ -2391,10 +2400,6 @@ type Chart =
 
             ch |> Chart.withLegend legend)
 
-    [<CompiledName("WithConfig")>]
-    static member withConfig(config: Config) =
-        (fun (ch: GenericChart) -> GenericChart.setConfig config ch)
-
     /// <summary>
     ///
     /// </summary>
@@ -2547,6 +2552,75 @@ type Chart =
         Chart.withShapes ([ shape ], ?Append = Append)
 
 
+    //==============================================================================================================
+    //======================================= General Config object styling ========================================
+    //==============================================================================================================
+
+    // <summary>
+    /// Sets the given config on the input chart.
+    ///
+    /// If there is already a config set, the object is replaced.
+    /// </summary>
+    [<CompiledName("SetConfig")>]
+    static member setConfig(config: Config) =
+        (fun (ch: GenericChart) -> GenericChart.setConfig config ch)
+
+    // <summary>
+    /// Sets the given config on the input chart.
+    ///
+    /// If there is already a config set, the objects are combined.
+    /// </summary>
+    [<CompiledName("WithConfig")>]
+    static member withConfig(config: Config) =
+        (fun (ch: GenericChart) -> GenericChart.addConfig config ch)
+
+    /// <summary>
+    /// Applies the given styles to the chart's Config object. Overwrites attributes with the same name that are already set.
+    /// </summary>
+    /// <param name="StaticPlot">Determines whether the plot is interactive or not. (default: false)</param>
+    /// <param name="PlotlyServerUrl">When set it determines base URL for the 'Edit in Chart Studio'/`showEditInChartStudio`/`showSendToCloud` mode bar button', and the showLink/sendData on-graph link. To enable sending your data to Chart Studio Cloud, you need to' set both `plotlyServerURL` to \'https://chart-studio.plotly.com\' and also set `showSendToCloud` to true.</param>
+    /// <param name="Editable">Determines whether the graph is editable or not. Sets all pieces of `edits` unless a separate `edits` config item overrides individual parts.</param>
+    /// <param name="Edits">Object holding individual editable pieces of the graph.</param>
+    /// <param name="Autosizable">Determines whether the graphs are plotted with respect to layout.autosize:true and infer its container size. (default: false)</param>
+    /// <param name="Responsive">Determines whether to change the layout size when window is resized.</param>
+    /// <param name="ShowSendToCloud">Should we include a ModeBar button, labeled "Edit in Chart Studio",that sends this chart to chart-studio.plotly.com (formerly plot.ly) or another plotly server as specified by `plotlyServerURL` for editing, export, etc? Note that this button can (depending on `plotlyServerURL` being set) send your data to an external server. However that server does not persist your data until you arrive at the Chart Studio and explicitly click "Save".</param>
+    /// <param name="ShowEditInChartStudio">Same as `showSendToCloud`, but use a pencil icon instead of a floppy-disk. Note that if both `showSendToCloud` and `showEditInChartStudio` are turned,  only `showEditInChartStudio` will be honored.</param>
+    /// <param name="ToImageButtonOptions">Statically override options for toImage modebar button</param>
+    /// <param name="ModeBarButtonsToAdd">ModeBar buttons to add to the graph.</param>
+    [<CompiledName("WithConfigStyle")>]
+    static member withConfigStyle
+        (
+            [<Optional; DefaultParameterValue(null)>] ?StaticPlot: bool,
+            [<Optional; DefaultParameterValue(null)>] ?PlotlyServerUrl: string,
+            [<Optional; DefaultParameterValue(null)>] ?Autosizable: bool,
+            [<Optional; DefaultParameterValue(null)>] ?Editable: bool,
+            [<Optional; DefaultParameterValue(null)>] ?Edits: Edits,
+            [<Optional; DefaultParameterValue(null)>] ?ShowSendToCloud: bool,
+            [<Optional; DefaultParameterValue(null)>] ?ShowEditInChartStudio: bool,
+            [<Optional; DefaultParameterValue(null)>] ?Responsive: bool,
+            [<Optional; DefaultParameterValue(null)>] ?ToImageButtonOptions: ToImageButtonOptions,
+            [<Optional; DefaultParameterValue(null)>] ?ModeBarButtonsToAdd: seq<StyleParam.ModeBarButton>
+        ) =
+        (fun (ch: GenericChart) ->
+
+            let config =
+                Config.init (
+                    ?StaticPlot = StaticPlot,
+                    ?PlotlyServerUrl = PlotlyServerUrl,
+                    ?Autosizable = Autosizable,
+                    ?Responsive = Responsive,
+                    ?ToImageButtonOptions = ToImageButtonOptions,
+                    ?ShowSendToCloud = ShowSendToCloud,
+                    ?ShowEditInChartStudio = ShowEditInChartStudio,
+                    ?Editable = Editable,
+                    ?Edits = Edits,
+                    ?ModeBarButtonsToAdd = ModeBarButtonsToAdd
+                )
+
+            ch |> Chart.withConfig config)
+
+
+
     //==============================================================================================================
     //================================= More complicated composite methods =========================================
     //==============================================================================================================

src/Plotly.NET/ChartAPI/GenericChart.fs

@@ -199,6 +199,11 @@ module GenericChart =
         | Chart (t, l, _, d) -> Chart(t, l, config, d)
         | MultiChart (t, l, _, d) -> MultiChart(t, l, config, d)
 
+    let addConfig config gChart =
+        match gChart with
+        | Chart (trace, l, c', d) -> Chart(trace, l, (DynObj.combine c' config |> unbox), d)
+        | MultiChart (traces, l, c', d) -> MultiChart(traces, l, (DynObj.combine c' config |> unbox), d)
+
     let getDisplayOptions gChart =
         match gChart with
         | Chart (_, _, _, d) -> d
@@ -276,19 +281,16 @@ module GenericChart =
 
         let combineConfigs (first: Config) (second: Config) =
 
-            let editableAnnotations =
-                combineOptSeqs
-                    (first.TryGetTypedValue<seq<StyleParam.AnnotationEditOptions>>("editable"))
-                    (second.TryGetTypedValue<seq<StyleParam.AnnotationEditOptions>>("editable"))
-
             let modeBarButtonsToAdd =
                 combineOptSeqs
-                    (first.TryGetTypedValue<seq<StyleParam.ModeBarButton>>("modeBarButtonsToAdd"))
-                    (second.TryGetTypedValue<seq<StyleParam.ModeBarButton>>("modeBarButtonsToAdd"))
+                    (first.TryGetTypedValue<seq<string>>("modeBarButtonsToAdd"))
+                    (second.TryGetTypedValue<seq<string>>("modeBarButtonsToAdd"))
 
             DynObj.combine first second
             |> unbox
-            |> Config.style (?EditableAnnotations = editableAnnotations, ?ModeBarButtonsToAdd = modeBarButtonsToAdd)
+            |> Config.style (
+                ?ModeBarButtonsToAdd = (modeBarButtonsToAdd |> Option.map (Seq.map StyleParam.ModeBarButton.ofString))
+            )
 
         let combineDisplayOptions (first: DisplayOptions) (second: DisplayOptions) =
 

src/Plotly.NET/CommonAbstractions/StyleParams.fs

@@ -224,7 +224,7 @@ module StyleParam =
 
     [<RequireQualifiedAccess>]
     /// Editable parts of a chart that can be set via Chart config.
-    type AnnotationEditOptions =
+    type Edits =
         ///Determines if the main anchor of the annotation is editable.The main anchor corresponds to the',
         ///text (if no arrow) or the arrow (which drags the whole thing leaving the arrow length & direction unchanged).
         | AnnotationPosition
@@ -257,9 +257,9 @@ module StyleParam =
             | LegendText -> "legendText"
             | ShapePosition -> "shapePosition"
 
-        static member convert = AnnotationEditOptions.toString >> box
-        override this.ToString() = this |> AnnotationEditOptions.toString
-        member this.Convert() = this |> AnnotationEditOptions.convert
+        static member convert = Edits.toString >> box
+        override this.ToString() = this |> Edits.toString
+        member this.Convert() = this |> Edits.convert
 
     [<RequireQualifiedAccess>]
     type AutoTypeNumbers =
@@ -1875,6 +1875,49 @@ module StyleParam =
             | ZoomInMapbox -> "zoomInMapbox"
             | ZoomOutMapbox -> "zoomOutMapbox"
 
+        static member ofString =
+            function
+            | "toImage" -> ToImage
+            | "sendDataToCloud" -> SendDataToCloud
+            | "editInChartStudio" -> EditInChartStudio
+            | "zoom2d" -> Zoom2d
+            | "pan2d" -> Pan2d
+            | "select2d" -> Select2d
+            | "lasso2d" -> Lasso2d
+            | "drawclosedpath" -> DrawClosedPath
+            | "drawopenpath" -> DrawOpenPath
+            | "drawline" -> DrawLine
+            | "drawrect" -> DrawRect
+            | "drawcircle" -> DrawCircle
+            | "eraseshape" -> EraseShape
+            | "zoomIn2d" -> ZoomIn2d
+            | "zoomOut2d" -> ZoomOut2d
+            | "autoScale2d" -> AutoScale2d
+            | "resetScale2d" -> ResetScale2d
+            | "hoverClosestCartesian" -> HoverClosestCartesian
+            | "hoverCompareCartesian" -> HoverCompareCartesian
+            | "zoom3d" -> Zoom3d
+            | "pan3d" -> Pan3d
+            | "orbitRotation" -> OrbitRotation
+            | "tableRotation" -> TableRotation
+            | "resetCameraDefault3d" -> ResetCameraDefault3d
+            | "resetCameraLastSave3d" -> ResetCameraLastSave3d
+            | "hoverClosest3d" -> HoverClosest3d
+            | "zoomInGeo" -> ZoomInGeo
+            | "zoomOutGeo" -> ZoomOutGeo
+            | "resetGeo" -> ResetGeo
+            | "hoverClosestGeo" -> HoverClosestGeo
+            | "hoverClosestGl2d" -> HoverClosestGl2d
+            | "hoverClosestPie" -> HoverClosestPie
+            | "resetSankeyGroup" -> ResetSankeyGroup
+            | "toggleHover" -> ToggleHover
+            | "v1hovermode" -> HoverMode
+            | "resetViews" -> ResetViews
+            | "toggleSpikelines" -> ToggleSpikelines
+            | "resetViewMapbox" -> ResetViewMapbox
+            | "zoomInMapbox" -> ZoomInMapbox
+            | "zoomOutMapbox" -> ZoomOutMapbox
+            | _ -> failwith "unsupported mode button"
 
         static member convert = ModeBarButton.toString >> box
         override this.ToString() = this |> ModeBarButton.toString