WIP: Add image export docs

Author: kMutagene

.gitignore

@@ -190,3 +190,4 @@ temp/gh-pages
 /src/Plotly.NET.ImageExport/.local-chromium
 /src/Plotly.NET.ImageExport/testrenders
 /src/Plotly.NET.Interactive/.local-chromium/
+/docs/.local-chromium/

Plotly.NET.sln

@@ -51,6 +51,7 @@ EndProject
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "content", "content", "{60FB82C0-F472-494E-BCF7-7B3C54212406}"
 	ProjectSection(SolutionItems) = preProject
 		docs\0_0_basics.fsx = docs\0_0_basics.fsx
+		docs\0_1_image-export.fsx = docs\0_1_image-export.fsx
 		docs\1_0_axis-styling.fsx = docs\1_0_axis-styling.fsx
 		docs\1_1_errorbars.fsx = docs\1_1_errorbars.fsx
 		docs\1_2_multiple-charts.fsx = docs\1_2_multiple-charts.fsx
@@ -102,7 +103,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "img", "img", "{CDB973F2-0F6
 		docs\img\logo.png = docs\img\logo.png
 	EndProjectSection
 EndProject
-Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Plotly.NET.ImageExport", "src\Plotly.NET.ImageExport\Plotly.NET.ImageExport.fsproj", "{6CFC629E-1A0C-4EF3-8495-BA00A356A381}"
+Project("{6EC3EE1D-3C4E-46DD-8F32-0CC8E7565705}") = "Plotly.NET.ImageExport", "src\Plotly.NET.ImageExport\Plotly.NET.ImageExport.fsproj", "{6CFC629E-1A0C-4EF3-8495-BA00A356A381}"
 EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution

docs/0_1_image-export.fsx

@@ -0,0 +1,118 @@
+(**
+---
+title: Basics 
+category: General
+categoryindex: 1
+index: 2
+---
+*)
+
+
+(*** hide ***)
+
+(*** condition: prepare ***)
+#r "nuget: Newtonsoft.JSON, 12.0.3"
+#r "nuget: PuppeteerSharp"
+#r "../bin/Plotly.NET/netstandard2.0/Plotly.NET.dll"
+#r "../bin/Plotly.NET.ImageExport/netstandard2.0/Plotly.NET.ImageExport.dll"
+
+(*** condition: ipynb ***)
+#if IPYNB
+#r "nuget: Plotly.NET, {{fsdocs-package-version}}"
+#r "nuget: Plotly.NET.Interactive, {{fsdocs-package-version}}"
+#r "nuget: Plotly.NET.ImageExport, {{fsdocs-package-version}}"
+#endif // IPYNB
+
+
+(**
+[![Binder]({{root}}img/badge-binder.svg)](https://mybinder.org/v2/gh/plotly/Plotly.NET/gh-pages?filepath={{fsdocs-source-basename}}.ipynb) 
+[![Script]({{root}}img/badge-script.svg)]({{root}}{{fsdocs-source-basename}}.fsx) 
+[![Notebook]({{root}}img/badge-notebook.svg)]({{root}}{{fsdocs-source-basename}}.ipynb)
+
+# Static image export
+
+The supported image types are: 
+- jpg via `Chart.SaveJPG`
+- png via `Chart.SavePNG`
+- svg via `Chart.SaveSVG`
+
+The parameters for all three functions are exactly the same. 
+*)
+
+open Plotly.NET
+open Plotly.NET.ImageExport
+
+let exampleChart = 
+    Chart.Histogram2dContour(
+        [1.;2.;2.;4.;5.],
+        [1.;2.;2.;4.;5.]
+    )
+
+(***do-not-eval***)
+exampleChart
+|> Chart.saveJPG(
+    "/your/path/without/extension/here",
+    Width=300,
+    Height=300
+)
+
+#if IPYNB
+
+let imgString = $"""<img
+    src= "{exampleChart|> Chart.toBase64JPGString(Width=300,Height=300)}"
+/>"""
+
+DisplayExtensions.DisplayAs(imgString,"text/html")
+
+#endif // IPYNB
+
+(***hide***)
+$"""<img
+    src= "{exampleChart|> Chart.toBase64JPGString(Width=300,Height=300)}"
+/>"""
+
+(***include-it-raw***)
+
+(**
+
+*)
+
+let base64JPG =
+    exampleChart
+    |> Chart.toBase64PNGString(
+        Width=300,
+        Height=300
+    )
+
+#if IPYNB
+
+let imgString = $"""<img
+    src= "{base64JPG}"
+/>"""
+
+DisplayExtensions.DisplayAs(imgString,"text/html")
+
+#endif // IPYNB
+
+$"""<img
+    src= "{base64JPG}"
+/>"""
+(***include-it-raw***)
+
+
+(** 
+*)
+
+let svgString =
+    exampleChart
+    |> Chart.toSVGString(
+        Width=300,
+        Height=300
+    )
+
+#if IPYNB
+DisplayExtensions.DisplayAs(svgString,"image/svg+xml")
+#endif // IPYNB
+
+svgString
+(***include-it-raw***)

src/Plotly.NET.ImageExport/Plotly.NET.ImageExport.fsproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
   <PropertyGroup>
-    <TargetFramework>net5.0</TargetFramework>
+    <TargetFrameworks>net5.0; netstandard2.0</TargetFrameworks>
     <GenerateDocumentationFile>true</GenerateDocumentationFile>
     <WarnOn>3390;$(WarnOn)</WarnOn>
   </PropertyGroup>