Heatmaps

BinderScriptNotebook

Summary: This example shows how to create heatmap charts in F#.

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

open Plotly.NET 
 
let matrix =
    [[1.;1.5;0.7;2.7];
    [2.;0.5;1.2;1.4];
    [0.1;2.6;2.4;3.0];]

let rownames = ["p3";"p2";"p1"]
let colnames = ["Tp0";"Tp30";"Tp60";"Tp160"]

let colorscaleValue = 
    StyleParam.Colorscale.Custom [(0.0,"#3D9970");(1.0,"#001f3f")]

// Generating the Heatmap 
let heat1 =
    Chart.Heatmap(
        matrix,colnames,rownames,
        Colorscale=colorscaleValue,
        Showscale=true
    )
    |> Chart.withSize(700.,500.)
    |> Chart.withMarginSize(Left=200.)

A heatmap chart can be created using the Chart.HeatMap functions. When creating heatmap charts, it is usually desirable to provide the values in matrix form, rownames and colnames.

Styling Colorbars

All charts that contain colorbars can be styled by the Chart.withColorBarStyle function. Here is an example that adds a title to the colorbar:

let heat2 =
    heat1
    |> Chart.withColorBarStyle(
        Title.init("Im the ColorBar")
    )
namespace Plotly
namespace Plotly.NET
val matrix : float list list
val rownames : string list
val colnames : string list
val colorscaleValue : StyleParam.Colorscale
module StyleParam from Plotly.NET
type Colorscale = | Custom of seq<float * string> | RdBu | Earth | Blackbody | YIOrRd | YIGnBu | Bluered | Portland | Electric | Jet ... member Convert : unit -> obj static member convert : (Colorscale -> obj)
<summary> The colorscale must be a collection containing a mapping of a normalized value (between 0.0 and 1.0) to it's color. At minimum, a mapping for the lowest (0.0) and highest (1.0) values are required. </summary>
union case StyleParam.Colorscale.Custom: seq<float * string> -> StyleParam.Colorscale
val heat1 : GenericChart.GenericChart
type Chart = static member Area : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowMarkers:bool * ?ShowLegend:bool * ?MarkerSymbol:MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Dash:DrawingStyle * ?Width:float -> GenericChart + 1 overload static member Bar : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?PatternShape:PatternShape * ?MultiPatternShape:seq<PatternShape> * ?Pattern:Pattern * ?Base:#IConvertible * ?Width:'a3 * ?MultiWidth:seq<'a3> * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a4 * ?MultiText:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?TextFont:Font * ?Marker:Marker -> GenericChart (requires 'a3 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member BoxPlot : ?x:'a0 * ?y:'a1 * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?Fillcolor:Color * ?Opacity:float * ?Whiskerwidth:'a2 * ?Boxpoints:Boxpoints * ?Boxmean:BoxMean * ?Jitter:'a3 * ?Pointpos:'a4 * ?Orientation:Orientation * ?Marker:Marker * ?Line:Line * ?Alignmentgroup:'a5 * ?Offsetgroup:'a6 * ?Notched:bool * ?NotchWidth:float * ?QuartileMethod:QuartileMethod -> GenericChart + 1 overload static member Bubble : x:seq<#IConvertible> * y:seq<#IConvertible> * sizes:seq<int> * ?Name:string * ?ShowLegend:bool * ?MarkerSymbol:MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?StackGroup:string * ?Orientation:Orientation * ?GroupNorm:GroupNorm * ?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 Column : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?Pattern:Pattern * ?PatternShape:PatternShape * ?MultiPatternShape:seq<PatternShape> * ?Base:#IConvertible * ?Width:'a3 * ?MultiWidth:seq<'a3> * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a4 * ?MultiText:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?TextFont:Font * ?Marker:Marker -> GenericChart (requires 'a3 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member Contour : data:seq<#seq<'a1>> * ?X:seq<#IConvertible> * ?Y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Colorscale:Colorscale * ?Showscale:'a4 * ?zSmooth:SmoothAlg * ?ColorBar:'a5 -> GenericChart (requires 'a1 :> IConvertible) static member Funnel : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Color:Color * ?Line:Line * ?x0:'a3 * ?dX:float * ?y0:'a4 * ?dY:float * ?Width:float * ?Offset:float * ?Orientation:Orientation * ?Alignmentgroup:string * ?Offsetgroup:string * ?Cliponaxis:bool * ?Connector:FunnelConnector * ?Insidetextfont:Font * ?Outsidetextfont:Font -> GenericChart static member Heatmap : data:seq<#seq<'b>> * ?ColNames:seq<#IConvertible> * ?RowNames:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Colorscale:Colorscale * ?Showscale:'e * ?Xgap:'f * ?Ygap:'g * ?zSmooth:SmoothAlg * ?ColorBar:'h * ?UseWebGL:bool -> GenericChart (requires 'b :> IConvertible) static member Histogram : data:seq<#IConvertible> * ?Orientation:Orientation * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Color:Color * ?HistNorm:HistNorm * ?HistFunc:HistFunc * ?nBinsx:int * ?nBinsy:int * ?Xbins:Bins * ?Ybins:Bins * ?xError:'a1 * ?yError:'a2 -> GenericChart ...
static member Chart.Heatmap : data:seq<#seq<'b>> * ?ColNames:seq<#System.IConvertible> * ?RowNames:seq<#System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Colorscale:StyleParam.Colorscale * ?Showscale:'e * ?Xgap:'f * ?Ygap:'g * ?zSmooth:StyleParam.SmoothAlg * ?ColorBar:'h * ?UseWebGL:bool -> GenericChart.GenericChart (requires 'b :> System.IConvertible)
static member Chart.withSize : width:float * height:float -> (GenericChart.GenericChart -> GenericChart.GenericChart)
static member Chart.withSize : ?Width:int * ?Height:int -> (GenericChart.GenericChart -> GenericChart.GenericChart)
static member Chart.withMarginSize : ?Left:'a * ?Right:'b * ?Top:'c * ?Bottom:'d * ?Pad:'e * ?Autoexpand:'f -> (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 heat2 : GenericChart.GenericChart
static member Chart.withColorBarStyle : title:Title * ?Length:float * ?OutlineColor:Color * ?BorderColor:Color * ?BGColor:Color -> (GenericChart.GenericChart -> GenericChart.GenericChart)
Multiple items
type Title = inherit DynamicObj new : unit -> Title static member init : ?Text:string * ?Font:Font * ?Standoff:int * ?Side:Side -> Title static member style : ?Text:string * ?Font:Font * ?Standoff:int * ?Side:Side -> (Title -> Title)

--------------------
new : unit -> Title
static member Title.init : ?Text:string * ?Font:Font * ?Standoff:int * ?Side:StyleParam.Side -> Title