Improve all 3D Charts derived from Scatter3D

Author: kMutagene

Diff for: src/Plotly.NET/ChartAPI/Chart3D.fs

@@ -2055,6 +2055,32 @@ module StyleParam =
         override this.ToString() = this |> SymbolStyle.toString
         member this.Convert() = this |> SymbolStyle.convert
 
+    [<RequireQualifiedAccess>]
+    type MarkerSymbol3D =
+        | Circle     
+        | CircleOpen 
+        | Cross      
+        | Diamond    
+        | DiamondOpen
+        | Square     
+        | SquareOpen 
+        | X          
+        
+        static member toString = function
+            | Circle        -> "circle" 
+            | CircleOpen    -> "circle-open" 
+            | Cross         -> "cross" 
+            | Diamond       -> "diamond" 
+            | DiamondOpen   -> "diamond-open" 
+            | Square        -> "square" 
+            | SquareOpen    -> "square-open" 
+            | X             -> "x"
+        
+        static member convert = MarkerSymbol3D.toString >> box
+        override this.ToString() = this |> MarkerSymbol3D.toString
+        member this.Convert() = this |> MarkerSymbol3D.convert
+
+
     [<RequireQualifiedAccess>]
     type MarkerSymbol =
         | Modified of MarkerSymbol * SymbolStyle

Diff for: src/Plotly.NET/CommonAbstractions/StyleParams.fs

@@ -183,6 +183,16 @@ open Plotly.NET
 open FSharp.Data
 open Deedle
 
+Chart.Bubble3D(
+    [for i in 0..10 do yield (i,i,i)],
+    [0 .. 10 .. 100],
+    MarkerColor = Color.fromColorScaleValues [0..10],
+    MarkerSymbol = StyleParam.MarkerSymbol3D.Diamond
+)
+
+|> Chart.show
+
+
 let data = 
     Http.RequestString @"https://raw.githubusercontent.com/plotly/datasets/master/iris-data.csv"
     |> fun csv -> Frame.ReadCsvString(csv,true,separators=",")

Diff for: src/Plotly.NET/Playground.fsx

@@ -504,7 +504,7 @@ module ChartTemplates =
                 ]
             ))
 
-            Trace3D.initMesh3d(Trace3DStyle.Mesh3d(
+            Trace3D.initMesh3D(Trace3DStyle.Mesh3D(
                 ColorBar = ColorBar.init(
                     OutlineWidth = 0., Ticks = StyleParam.TickOptions.Empty
                 )
@@ -531,7 +531,7 @@ module ChartTemplates =
                 )
             ))
 
-            Trace3D.initScatter3d(Trace3DStyle.Scatter3d(
+            Trace3D.initScatter3D(Trace3DStyle.Scatter3D(
                 Line = Line.init(
                     ColorBar = ColorBar.init(
                         OutlineWidth = 0., Ticks = StyleParam.TickOptions.Empty

Diff for: src/Plotly.NET/Templates/ChartTemplates.fs

@@ -95,7 +95,9 @@ type Marker () =
             [<Optional;DefaultParameterValue(null)>] ?MultiOpacity      : seq<float>,
             [<Optional;DefaultParameterValue(null)>] ?Pattern           : Pattern,
             [<Optional;DefaultParameterValue(null)>] ?Symbol            : StyleParam.MarkerSymbol,
-            [<Optional;DefaultParameterValue(null)>] ?MultiSymbol       : seq<StyleParam.MarkerSymbol>,
+            [<Optional;DefaultParameterValue(null)>] ?MultiSymbol       : seq<StyleParam.MarkerSymbol>,            
+            [<Optional;DefaultParameterValue(null)>] ?Symbol3D          : StyleParam.MarkerSymbol3D,
+            [<Optional;DefaultParameterValue(null)>] ?MultiSymbol3D     : seq<StyleParam.MarkerSymbol3D>,
             [<Optional;DefaultParameterValue(null)>] ?OutlierColor      : Color,
             [<Optional;DefaultParameterValue(null)>] ?OutlierWidth      : int,
             [<Optional;DefaultParameterValue(null)>] ?Maxdisplayed      : int,
@@ -123,6 +125,7 @@ type Marker () =
                 (Opacity, MultiOpacity)     |> DynObj.setSingleOrMultiOpt marker "opacity"
                 Pattern                     |> DynObj.setValueOpt marker "pattern"
                 (Symbol, MultiSymbol)       |> DynObj.setSingleOrMultiOptBy marker "symbol" StyleParam.MarkerSymbol.convert
+                (Symbol3D, MultiSymbol3D)   |> DynObj.setSingleOrMultiOptBy marker "symbol" StyleParam.MarkerSymbol3D.convert
                 OutlierColor                |> DynObj.setValueOpt marker "outliercolor"
                 OutlierWidth                |> DynObj.setValueOpt marker "outlierwidth"
                 Maxdisplayed                |> DynObj.setValueOpt marker "maxdisplayed"

Diff for: src/Plotly.NET/Traces/ObjectAbstractions/Marker.fs

@@ -15,6 +15,6 @@ public class Chart3DAPITest
         private static readonly Tuple<int, int, int>[] xyz = x.Zip(y).Zip(z).Select(c => new Tuple<int, int, int>(c.Item1.First, c.Item1.Second, c.Item2)).ToArray();
 
         [Fact] public void Scatter3d1()
-            => Chart3D.Chart.Scatter3d<int, int, int, int>(x, y, z, StyleParam.Mode.Lines);
+            => Chart3D.Chart.Scatter3D<int, int, int, int>(x, y, z, StyleParam.Mode.Lines);
     }
 }

Diff for: src/Plotly.NET/Traces/Trace3D.fs

@@ -18,7 +18,7 @@ let main argv =
         let y = [19; 26; 55;]
         let z = [19; 26; 55;]
 
-        Chart.Scatter3d(x,y,z,StyleParam.Mode.Markers)
+        Chart.Scatter3D(x,y,z,StyleParam.Mode.Markers)
         |> Chart.withXAxisStyle("my x-axis", Id=StyleParam.SubPlotId.Scene 1)
         |> Chart.withYAxisStyle("my y-axis", Id=StyleParam.SubPlotId.Scene 1)
         |> Chart.withZAxisStyle("my z-axis")

Diff for: tests/Plotly.NET.Tests.CSharp/APITest/Chart3DAPITest.cs

@@ -163,7 +163,7 @@ let multiTraceGrid =
         Chart.Point([1,2; 2,3], UseDefaults = false)
         Chart.PointTernary([1,2,3; 2,3,4], UseDefaults = false)
         Chart.Heatmap([[1; 2];[3; 4]], ShowScale=false, UseDefaults = false)
-        Chart.Point3d([1,3,2], UseDefaults = false)
+        Chart.Point3D([1,3,2], UseDefaults = false)
         Chart.PointMapbox([1,2], UseDefaults = false) |> Chart.withMapbox(Mapbox.init(Style = StyleParam.MapboxStyle.OpenStreetMap))
         [
             // you can use nested combined charts, but they have to have the same trace type (Cartesian2D in this case)
@@ -182,7 +182,7 @@ let multiTraceSingleStack =
         Chart.Point([1,2; 2,3], UseDefaults = false)
         Chart.PointTernary([1,2,3; 2,3,4], UseDefaults = false)
         Chart.Heatmap([[1; 2];[3; 4]], ShowScale=false, UseDefaults = false)
-        Chart.Point3d([1,3,2], UseDefaults = false)
+        Chart.Point3D([1,3,2], UseDefaults = false)
         Chart.PointMapbox([1,2], UseDefaults = false) |> Chart.withMapbox(Mapbox.init(Style = StyleParam.MapboxStyle.OpenStreetMap))
         [
             // you can use nested combined charts, but they have to have the same trace type (Cartesian2D in this case)
@@ -195,6 +195,7 @@ let multiTraceSingleStack =
     |> Chart.SingleStack()
     |> Chart.withSize(1000,1000)
 
+
 [<Tests>]
 let ``Multicharts and subplots`` =
     testList "ChartLayout.Multicharts and subplots" [
@@ -211,7 +212,7 @@ let ``Multicharts and subplots`` =
             |> chartGeneratedContains subPlotChart
         );        
         testCase "MultiTrace Subplot grid data" ( fun () ->
-            """var data = [{"type":"scatter","mode":"markers","x":[1,2],"y":[2,3],"marker":{},"xaxis":"x","yaxis":"y"},{"type":"scatterternary","mode":"markers","a":[1,2],"b":[2,3],"c":[3,4],"marker":{},"subplot":"ternary2"},{"type":"heatmap","z":[[1,2],[3,4]],"showscale":false,"xaxis":"x3","yaxis":"y3"},{"type":"scatter3d","mode":"markers","x":[1],"y":[3],"z":[2],"line":{},"marker":{},"scene":"scene4"},{"type":"scattermapbox","mode":"markers","lon":[1],"lat":[2],"line":{},"marker":{},"subplot":"mapbox5"},{"type":"box","x":"y","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin1","marker":{},"xaxis":"x6","yaxis":"y6"},{"type":"box","x":"y'","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin2","marker":{},"xaxis":"x6","yaxis":"y6"}];"""
+            """var data = [{"type":"scatter","mode":"markers","x":[1,2],"y":[2,3],"marker":{},"xaxis":"x","yaxis":"y"},{"type":"scatterternary","mode":"markers","a":[1,2],"b":[2,3],"c":[3,4],"marker":{},"subplot":"ternary2"},{"type":"heatmap","z":[[1,2],[3,4]],"showscale":false,"xaxis":"x3","yaxis":"y3"},{"type":"scatter3d","mode":"markers","x":[1],"y":[3],"z":[2],"marker":{},"line":{},"scene":"scene4"},{"type":"scattermapbox","mode":"markers","lon":[1],"lat":[2],"line":{},"marker":{},"subplot":"mapbox5"},{"type":"box","x":"y","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin1","marker":{},"xaxis":"x6","yaxis":"y6"},{"type":"box","x":"y'","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin2","marker":{},"xaxis":"x6","yaxis":"y6"}];"""
             |> chartGeneratedContains multiTraceGrid
         );
         testCase "MultiTrace Subplot grid layout" ( fun () ->
@@ -228,7 +229,7 @@ let ``Multicharts and subplots`` =
         );        
 
         testCase "MultiTrace Single Stack data" ( fun () -> 
-            """var data = [{"type":"scatter","mode":"markers","x":[1,2],"y":[2,3],"marker":{},"xaxis":"x","yaxis":"y"},{"type":"scatterternary","mode":"markers","a":[1,2],"b":[2,3],"c":[3,4],"marker":{},"subplot":"ternary2"},{"type":"heatmap","z":[[1,2],[3,4]],"showscale":false,"xaxis":"x3","yaxis":"y3"},{"type":"scatter3d","mode":"markers","x":[1],"y":[3],"z":[2],"line":{},"marker":{},"scene":"scene4"},{"type":"scattermapbox","mode":"markers","lon":[1],"lat":[2],"line":{},"marker":{},"subplot":"mapbox5"},{"type":"box","x":"y","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin1","marker":{},"xaxis":"x6","yaxis":"y6"},{"type":"box","x":"y'","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin2","marker":{},"xaxis":"x6","yaxis":"y6"}];"""
+            """var data = [{"type":"scatter","mode":"markers","x":[1,2],"y":[2,3],"marker":{},"xaxis":"x","yaxis":"y"},{"type":"scatterternary","mode":"markers","a":[1,2],"b":[2,3],"c":[3,4],"marker":{},"subplot":"ternary2"},{"type":"heatmap","z":[[1,2],[3,4]],"showscale":false,"xaxis":"x3","yaxis":"y3"},{"type":"scatter3d","mode":"markers","x":[1],"y":[3],"z":[2],"marker":{},"line":{},"scene":"scene4"},{"type":"scattermapbox","mode":"markers","lon":[1],"lat":[2],"line":{},"marker":{},"subplot":"mapbox5"},{"type":"box","x":"y","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin1","marker":{},"xaxis":"x6","yaxis":"y6"},{"type":"box","x":"y'","y":[2.0,1.5,5.0,1.5,2.0,2.5,2.1,2.5,1.5,1.0,2.0,1.5,5.0,1.5,3.0,2.5,2.5,1.5,3.5,1.0],"boxpoints":"all","jitter":0.1,"name":"bin2","marker":{},"xaxis":"x6","yaxis":"y6"}];"""
             |> chartGeneratedContains multiTraceSingleStack
         );
         testCase "MultiTrace Single Stack layout" ( fun () -> 

Diff for: tests/Plotly.NET.Tests.FSharpConsole/Program.fs

@@ -32,7 +32,7 @@ let scatterChart =
     let y = [19; 26; 55;]
     let z = [19; 26; 55;]
 
-    Chart.Scatter3d(x,y,z,StyleParam.Mode.Markers, UseDefaults = false)
+    Chart.Scatter3D(x,y,z,StyleParam.Mode.Markers, UseDefaults = false)
     |> Chart.withXAxisStyle("my x-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withYAxisStyle("my y-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withZAxisStyle("my z-axis")
@@ -42,7 +42,7 @@ let scatterChart =
 let ``3D Scatter charts`` =
     testList "Charts3D.3D Scatter charts" [
         testCase "3D Scatter charts data" ( fun () ->
-            """var data = [{"type":"scatter3d","mode":"markers","x":[19,26,55],"y":[19,26,55],"z":[19,26,55],"line":{},"marker":{}}]"""
+            """var data = [{"type":"scatter3d","mode":"markers","x":[19,26,55],"y":[19,26,55],"z":[19,26,55],"marker":{},"line":{}}];"""
             |> chartGeneratedContains scatterChart
         );
         testCase "3D Scatter charts layout" ( fun () ->
@@ -56,7 +56,7 @@ let pointChart =
     let y = [19; 26; 55;]
     let z = [19; 26; 55;]
 
-    Chart.Point3d(x,y,z, UseDefaults = false)
+    Chart.Point3D(x,y,z, UseDefaults = false)
     |> Chart.withXAxisStyle("my x-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withYAxisStyle("my y-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withZAxisStyle("my z-axis")
@@ -66,7 +66,7 @@ let pointChart =
 let ``3D Point charts`` =
     testList "Charts3D.3D Point charts" [
         testCase "3D Point charts data" ( fun () ->
-            """var data = [{"type":"scatter3d","mode":"markers","x":[19,26,55],"y":[19,26,55],"z":[19,26,55],"line":{},"marker":{}}]"""
+            """var data = [{"type":"scatter3d","mode":"markers","x":[19,26,55],"y":[19,26,55],"z":[19,26,55],"marker":{},"line":{}}];"""
             |> chartGeneratedContains pointChart
         );
         testCase "3D Point charts layout" ( fun () ->
@@ -91,7 +91,7 @@ let lineChart =
         )
         |> List.unzip3
 
-    Chart.Line3d(x, y, z, ShowMarkers=true, UseDefaults = false)
+    Chart.Line3D(x, y, z, ShowMarkers=true, UseDefaults = false)
     |> Chart.withXAxisStyle("x-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withYAxisStyle("y-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withZAxisStyle("z-axis")
@@ -101,7 +101,7 @@ let lineChart =
 let ``Line charts`` =
     testList "Charts3D.Line charts" [
         testCase "Line data" ( fun () ->
-            """var data = [{"type":"scatter3d","mode":"lines+markers","x":[10.0,8.765,5.376,0.699,-4.079,-7.762,-9.458,-8.797,-6.02,-1.898,2.489,6.042,7.925,7.774,5.766,2.536,-1.014,-3.973,-5.664,-5.8,-4.534,-2.366,0.02,1.974,3.058,3.146,2.427,1.303,0.232,-0.428,-0.537],"y":[0.0,4.788,8.373,9.863,8.912,5.799,1.348,-3.295,-6.971,-8.802,-8.415,-6.015,-2.306,1.713,5.025,6.863,6.893,5.27,2.562,-0.437,-2.939,-4.377,-4.536,-3.576,-1.944,-0.209,1.124,1.76,1.684,1.127,0.46],"z":[0.0,0.5,1.0,1.5,2.0,2.5,3.0,3.5,4.0,4.5,5.0,5.5,6.0,6.5,7.0,7.5,8.0,8.5,9.0,9.5,10.0,10.5,11.0,11.5,12.0,12.5,13.0,13.5,14.0,14.5,15.0],"line":{},"marker":{}}];"""
+            """var data = [{"type":"scatter3d","mode":"lines+markers","x":[10.0,8.765,5.376,0.699,-4.079,-7.762,-9.458,-8.797,-6.02,-1.898,2.489,6.042,7.925,7.774,5.766,2.536,-1.014,-3.973,-5.664,-5.8,-4.534,-2.366,0.02,1.974,3.058,3.146,2.427,1.303,0.232,-0.428,-0.537],"y":[0.0,4.788,8.373,9.863,8.912,5.799,1.348,-3.295,-6.971,-8.802,-8.415,-6.015,-2.306,1.713,5.025,6.863,6.893,5.27,2.562,-0.437,-2.939,-4.377,-4.536,-3.576,-1.944,-0.209,1.124,1.76,1.684,1.127,0.46],"z":[0.0,0.5,1.0,1.5,2.0,2.5,3.0,3.5,4.0,4.5,5.0,5.5,6.0,6.5,7.0,7.5,8.0,8.5,9.0,9.5,10.0,10.5,11.0,11.5,12.0,12.5,13.0,13.5,14.0,14.5,15.0],"marker":{},"line":{}}];"""
             |> chartGeneratedContains lineChart
         );
         testCase "Line layout" ( fun () ->
@@ -111,22 +111,23 @@ let ``Line charts`` =
     ]
 
 let bubbleChart =
-    Chart.Bubble3d(
+    Chart.Bubble3D(
         [1,3,2; 6,5,4; 7,9,8],
         [20; 40; 30],
-        Labels = ["A"; "B"; "C"],
+        MultiText = ["A"; "B"; "C"],
         TextPosition = StyleParam.TextPosition.TopLeft, 
         UseDefaults = false 
     )
     |> Chart.withXAxisStyle("x-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withYAxisStyle("y-axis", Id=StyleParam.SubPlotId.Scene 1)
     |> Chart.withZAxisStyle("z-axis")
 
+
 [<Tests>]
 let ``Bubble charts`` =
     testList "Charts3D.Bubble charts" [
         testCase "Bubble data" ( fun () ->
-            """var data = [{"type":"scatter3d","mode":"markers+text","x":[1,6,7],"y":[3,5,9],"z":[2,4,8],"marker":{"size":[20,40,30]},"text":["A","B","C"],"textposition":"top left"}];"""
+            """var data = [{"type":"scatter3d","mode":"markers+text","x":[1,6,7],"y":[3,5,9],"z":[2,4,8],"text":["A","B","C"],"textposition":"top left","marker":{"size":[20,40,30]}}];"""
             |> chartGeneratedContains bubbleChart
         );
         testCase "Bubble layout" ( fun () ->
@@ -209,7 +210,7 @@ let meshChart =
     let b = Array.init 50 (fun _ -> rnd.NextDouble())
     let c = Array.init 50 (fun _ -> rnd.NextDouble())
 
-    Trace3D.initMesh3d 
+    Trace3D.initMesh3D 
         (fun mesh3d ->
             mesh3d?x <- a
             mesh3d?y <- b

Diff for: tests/Plotly.NET.Tests/HtmlCodegen/ChartLayout.fs

@@ -9,7 +9,7 @@ open Plotly.NET.GenericChart
 let allTraceTypesChart =
     [
         Chart.Point([])
-        Chart.Point3d([])
+        Chart.Point3D([])
         Chart.PointPolar([])
         Chart.ChoroplethMap([],[])
         Chart.ChoroplethMapbox([],[],obj)