Skip to content

Issue with Legend Not Adjusting when dynamically adding a new y-axis. #193

Open
@hadysysdev

Description

@hadysysdev

Hi, I am currently facing issues adjusting the legend of a plot when a new trace with a new y-axis is added to the plot.
Somehow the legend seems to be overlayed on the newly added y-axis title.

This is my current code set-up:

Angular Template:
<plotly-plot #plotlygraph [style]="{position: 'relative', width: '100%', height: '100%'}" [useResizeHandler]="true"></plotly-plot>
Angular Component:

    // Initial Layout
    layout = {
      title: 'Anomaly Plot',
      autosize: true,
      xaxis: {
        autorange: true,
        type: 'date',
        title: { text: 'DateTime' },
      },
      yaxis: {
        autorange: true,
        type: 'linear',
        title: { text: '°C' },
      },
    };
    // Add new trace with a new y-axis
    layout[yaxis2] = {
      autorange: true,
      type: 'linear',
      side: 'right',
      title: { text: 'mA' },
    };

According to this example here the legend seems to have been adjusted automatically without any further configuration.

Is there a configuration am missing? if not, how can I achieve adjusting the label not to overlay the newly added y-axis?

image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions