Multiple data sets on Y axis in plotly

Anvil Q&A
1

I’ve plotted two charts. They have the same x axis but different values for the y axis.

Does anyone possibly have any guidance on how to:

  1. put both y axis sets on the same graph
  2. make one y set a ‘bar’ and the other set a ‘line’

Any help gratefully received.

from ._anvil_designer import dashboard_form_liveTemplate
from anvil import *
import plotly.graph_objects as go
import anvil.server
import anvil.tables as tables
import anvil.tables.query as q
from anvil.tables import app_tables

class dashboard_form_live(dashboard_form_liveTemplate):
  def __init__(self, **properties):
    # Set Form properties and Data Bindings.
    self.init_components(**properties)
    
    # Any code you write here will run when the form opens.
    #this is the objectives graph
    self.build_objectives_graph()

    
     #this gets our data on counts from the server module
    counts = anvil.server.call('count_entry_types')
    
    #this makes the graph for the entries
    self.plot_journal_entries_2.spacing_below = "large"
    self.plot_journal_entries_2.data = [
      go.Bar(
        x=list(counts.keys()),
        y=list(counts.values()),
      name = 'How have you done so far?',
      width=0.4,)
    ]
    
    
  def build_objectives_graph(self):
    kpis = anvil.server.call('get_entry_objectives')
    self.plot_objectives.data = go.Bar(
        y = [x['entry_objective'] for x in kpis],
#         y = [x['entry_type'] for x in kpis],
     )
2

Question 1:
@stucork posted an example of this here.

Question 2:
You can set the data attribute of a plot component to a list. There is a good example of this in the help for the plot component which you can see here https://anvil.works/build#clone:UKZO3SIWU3ZXKSRL=BT7MPEXOH5UWBLRNX4EXEU6G

3

Here is an example of a plot with a scatter overlaid on a bar chart. The Scatter’s axis is set to the right hand side.
https://anvil.works/build#clone:D25A6D22OQPT5352=Z6K3Y6JN56EGQOTK3GJW2MZG

4

Great. Thanks @thomas.campbell