Ako zobrazím graf na tabuľkovom zobrazení


POZOR – funguje len na webovom klientovi!

Aplikácia umožňuje zobraziť pri tabuľke aj údaje vo forme grafu.

Graf sa nastavuje v Meta dátach navigačnej akcie, ktorá sa používa na zobrazenie tabuľky.

EntityIDent: LTWDAction

Prop. Name: ChartConfig

Vzor konfigurácie (do políčka Value):

{
    "Type": "Chart", 
    "Position": "right",
    "ChartPrimaryYAxis": {
        "LabelFormat": "N2"
    },
    "Series": [{
        "Name": "Vynos",
        "XName": "Mesiac",
        "YName": "Vynos",
        "Type": "Column"
    }, {
        "Name": "Naklad",
        "XName": "Mesiac",
        "YName": "Naklad",
        "Type": "Column",
        "MarkerVisible": false,
        "DataLabelVisible": true
    }, {
        "Name": "Zisk",
        "XName": "Mesiac",
        "YName": "Zisk",
        "Type": "Line",
        "MarkerVisible": true,
        "Color": "Red"
    }]
}

NázovPopis
TypePodporovaná hodnota “Chart”
PositionPodporované hodnoty top/right/bottom/left. Rozhoduje o umiestnení grafu z pohľadu tabuľky
SeriesSérie grafu, podporované su viaceré a môžu byť rôzneho typu
Series.NameNázov stĺpca zo setu, ktorý sa má použiť pre názov danej osi alebo priamo názov osi
Series.XNameNázov stĺpca zo setu, ktorý sa má použiť pre hodnoty osi x
Series.YNameNázov stĺpca zo setu, ktorý sa má použiť pre hodnoty osi y
Series.TypeTyp požadovaného grafu. Najčastejšie používané Column/Line. Podporované sú tieto:
https://blazor.syncfusion.com/documentation/chart/chart-types
Series.MarkerVisibleČi sa má zobraziť značka pre hodnotu na grafe
Series.DataLabelVisibleČi sa má zobraziť hodnota bodu na grafe
Series.ColorPozadovaná farba pre danú sériu
ChartPrimaryYAxis.LabelFormat
ChartPrimaryXAxis.LabelFormat
Je možné nastaviť buď formátovanie čísel pomocou formátovacích reťazcov napr. “N2” alebo vlastný formát zobrazenia napr. “{value} kWh”
ChartPrimaryYAxis.LabelIntersectAction
ChartPrimaryXAxis.LabelIntersectAction
Hide – Defines to hide the label when it intersect.
Trim – Defines to trim the label when it intersect.
Wrap – Defines to wrap the label when it intersect.
MultipleRows – Defines to set the multiple rows the label when it intersect.
Rotate45 – Defines to rotate the label at 45 degree when it intersect.
Rotate90 – Defines to rotate the label at 90 degree when it intersect.
ShowGridtrue/false – default true – v prípade hodnoty false, bude zobrazený len graf

Typy formátov údajov – https://learn.microsoft.com/en-us/dotnet/standard/base-types/standard-numeric-format-strings