-
I have a simple chart that I'd like to specify as being full screen width - data = {
"spend_by_type": [
{
"wt_des": "Bidding",
"spend": 100
},
{
"wt_des": "Admin",
"spend": 100
},
{
"wt_des": "Chargeable",
"spend": 500
},
]
}
plt_spend_by_type = {
"mark": "barX",
"x": "spend",
"fill": "wt_des",
"data": {"from": "spend_by_type"},
}
spec = {
"data": data,
"plot": [plt_spend_by_type]
}
mosaic = MosaicWidget(spec)
mosaic |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
The max width of the widget is set in the widget's css file. It's set to have width: 100% and max-width: initial, which means it will take up 100% of its container's width without any specific maximum width constraint. That said, I saw the same behavior you did -- the max width was less than the full screen size. A workaround is to add a very large width to your spec-- in the example below, 1500. Since Mosaic is built to be responsive, as you make the screen size smaller, the widget sizes down, effectively yielding you full screen width. } Screen recording: |
Beta Was this translation helpful? Give feedback.
The max width of the widget is set in the widget's css file. It's set to have width: 100% and max-width: initial, which means it will take up 100% of its container's width without any specific maximum width constraint.
That said, I saw the same behavior you did -- the max width was less than the full screen size. A workaround is to add a very large width to your spec-- in the example below, 1500. Since Mosaic is built to be responsive, as you make the screen size smaller, the widget sizes down, effectively yielding you full screen width.
}
spec = {
"data": data,
"plot": [plt_spend_by_type],
"width": "1500",
}
Screen recording:
https://github.com/user-attachments/assets/8873a1d3-2101-47dd-…