plotly / Plotly.NET

interactive graphing library for .NET programming languages :chart_with_upwards_trend:
https://plotly.net
MIT License
663 stars 88 forks source link

No way to add guidelines (plotly.js has them) #444

Open pkese opened 8 months ago

pkese commented 8 months ago

In js version of plotly, it is possible to add horizontal and vertical lines. I can't find that functionality in Plotly.Net.

See add_hline and add_vline in https://plotly.com/python/horizontal-vertical-shapes/

kMutagene commented 8 months ago

Hey @pkese, what you referenced is the python version of plotly, which similarly to this lib offer a plethora of high-level abstractions on top of plotly.js. While there seems to be no direct API we could bin this to (at least hline or vline lead to no results when searching the js reference)

However, the python functions seems to me like it is simply setting the respective reference (Xref/ Yref), so you can easiliy implement this using the base Shape bindings:

open Plotly.NET
open Plotly.NET.LayoutObjects

Chart.Point([for i in 0..10 -> i, i])
|> Chart.withShapes [
    Shape.init(
        X0 = 1,
        X1 = 2,
        Y0 = 0,
        Y1 = 1,
        Yref = "y domain"
    )
    Shape.init(
        X0 = 0,
        X1 = 1,
        Y0 = 0,
        Y1 = 0,
        Xref = "x domain"
    )
]

image

image

What we should do though is add a type safe abstration for <axis id> domain, most likely in StyleParam.SubPlotId

kMutagene commented 8 months ago

I think we could offer such an abstraction though. Keeping consistent e.g. with special axes type creation, this would mean there would be a Shape.initVerticalLine, Shape.initVerticalRect etc., what do you think about this @pkese ?

pkese commented 8 months ago

Sounds great.

Note: I'm just learning plotly, so my comments may not be most relevant.

I do have a lot of experience with Highcharts and they have a nice way to put extra lines directly on axis object. Maybe that's also something worth considering. https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/xaxis/plotlines-color/