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

legends for webcharts

## ni-light-plot-legend

> A custom element that provides a light legend for showing plot icons and names.

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

It provides an svg image with all the plots of the graphs.

By changing position attribute you can place the legend over graph("nw", "ne", "sw", "se"), or
inside a container("container"). Default is "container".

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-light-plot-legend show graph-ref="g1" position="ne"></ni-light-plot-legend>
```


### ni-light-plot-legend properties

**show** (boolean) - the visibility of the plot legend. Default: false.
                Accepted values: true, false

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

**position** (string) - the position where the legend will be placed. Default: 'container'.
                Accepted values: 'nw', 'ne', 'sw', 'se', 'container'