COVID Dashboard

This will create the page object and add a predefined configuration to the page.body:

page = Report()
page.theme = ThemeBlue.BlueGrey()

Get the external data from a URL directly:

data =

Add components to the page:

title = page.ui.title("Country wise COVID")
button_all = page.ui.button("All") = 5
button_clear = page.ui.button("Clear")

Change the CSS style of the button: = 5 = 5

cols_keys = page.ui.panels.filters(html_code="data_filters", options={"max_height": 90}) = 20

Add a autocomplete input component and set an event when enter is pressed:

items = page.ui.inputs.autocomplete(placeholder="select a country", options={"select": True})
items.enter([cols_keys.dom.add(items.dom.content, category='Country/Region'), items.dom.empty()])

button = page.ui.button("Show") = 5

Add component specific options, in this case it is an event when selected:

  cols_keys.dom.add(events.value, category='Country/Region'),"click")

Add other components to the page:

bar =[], ['Confirmed', 'Deaths', 'Recovered'], 'Country/Region')

ref ="rsharankumar", name="Learn Data Science in 100Days", site="github",

box =
box.extend([title, items, page.ui.div([button_all, button_clear]), cols_keys, button, bar, ref])

grp ="covidData", global_scope=True)).filterGroup("aggData")

Add events on the button and button_all object[
  page.js.console.log(cols_keys.dom.content),['Confirmed', 'Deaths', 'Recovered'], ['Country/Region']))

countries = set()
for rec in data:
  cols_keys.dom.clear(), cols_keys.dom.add(list(countries), category='Country/Region', no_duplicate=False)])[cols_keys.dom.clear()])

This example is available here

More example of the templates on Github