ni-webcharts-legends/docs/ni-plot-legend.md

legends for webcharts

## ni-plot-legend

> A custom element that provides a plot legend.

Use it to visualize and change the plots of a graph or chart element.

It provides an expandable list with all the plots of the graphs.

Expand one of the plots and you get a panel where you can control the
parameters of the plot - like plot style, line width, dash style, colors ...

Example:
```html
<ni-cartesian-graph graph-ref="g1" value="[[2, 3, 5, 7, 11, 13, 17, 19],
                          [0, 1, 1, 2, 3, 5, 8, 13]]">
    <ni-cartesian-axis show label="Index" axis-position="bottom"></ni-cartesian-axis>
    <ni-cartesian-axis show label="Value" axis-position="left"></ni-cartesian-axis>
    <ni-cartesian-plot show label="Prime Numbers">
        <ni-cartesian-plot-renderer line-width="2" line-stroke="red">
        </ni-cartesian-plot-renderer>
    </ni-cartesian-plot>
    <ni-cartesian-plot show label="Fibonacci Numbers">
        <ni-cartesian-plot-renderer line-width="2" line-stroke="blue">
        </ni-cartesian-plot-renderer>
    </ni-cartesian-plot>
</ni-cartesian-graph>

<ni-plot-legend graph-ref="g1" mode="pan"></ni-plot-legend>
```


### ni-plot-legend properties

**graph-ref** - the graph id to connect to. Default: ''

**is-in-edit-mode** - makes the legend non-interactive


**mode** (string) - the mode of the plot legend. Default: 'full'.
               When in 'compact mode' only the plot icon and the plot name are shown.
               In full mode you can expand the plots and can fully configure them at runtime.

               Accepted values: 'full', 'compact'