Hoe to add the Checkbox , Dropdown using plotly js lib in Angular application

plotly.js
1

I got a requirement that , I have plotted the bar graph using the plotly js in angular application but I need to add a checkbox in this graph , when someone clicks on it I need to change the data , same way I need to add dropdown also like different graphs based on selected dropdown vaues .
can anyone please assist that how to do this ?

2

For adding a checkbox and dropdown in your Plotly.js bar graph in an Angular app:

  1. Checkbox:
  • Include a checkbox in your component template.
  • Use [(ngModel)] for two-way binding.
  • Implement a function for the checkbox change to modify graph data.
  1. Dropdown:
  • Add a dropdown in the template.
  • Bind its value with [(ngModel)].
  • Create a function for the dropdown change to adjust graph data.

Ensure FormsModule is imported. These Angular features enable dynamic updates based on user interactions, enhancing your graph’s interactivity."

Hope you got your query resolved. By this, you will find the Angular React Concept clear.

3

custom control is fine , but the thing is the checkbox should be present inside the graph which is generated by using plotly layout one , which seems to be a difficult one and in the plolty documentation only dropdown is given other custom controls are not given .