Streamlit Elements Problem

Custom Components
1

Summary

Streamlit Elements is a component that gives you the tools to compose beautiful applications with Material UI widgets, Monaco, Nivo charts, and more. It also includes a feature to create draggable and resizable dashboards. I also wanna use this in my app, but unable to create the below cards using streamlit_elements. Can anyone kindly help with the code ?

The main creator of streamlit_elements is @okld.

Questions:

  1. Can we use Card component of MUI in streamlit_elements ? if so kindly provide me the code for the food card.
  2. Is it possible to put the streamlit_highcharts inside a Card component MUI in streamlit_elements? if so kindly give me some example how ?
  3. Is it possible to show the data received from a python function on a Card Component using streamlit_elements ?

Links

Trying to achieve the below one:

mui_1
mui_1910Ă—587 48.7 KB

mui_2
mui_2657Ă—632 182 KB

2

Hey @Aritra,

Thanks for sharing this question! If you’re looking to reproduce some of the pieces of @okld’s demo app, check out the source code here.

For your second and third questions, can you share what you’ve tried so far to implement this? We can point you in the right direction.

1 Like
3

Hey @Caroline Thank you for your response. I somehow able to solve the 2nd question using high charts itself, But for the 3rd question, I’m scraping the information from a website and now I want to show that information inside that Card Element. How I can achieve that ? Kindly refer the below image for reference, I want to show the data like this inside a card component.

card_componenet

5

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.