✨ Announcing our seed funding led by Lux Capital! Read more about it on our blog ✨
[ Learn ]
[ Concepts ]
[ Reference ]
Histogram
Histogram is a wrapper component that renders a histogram graph.
Data
Histogram accepts a data prop, which is an array of dictionaries with x keys. x values will be grouped together and counted. You can contruct your own data as input, or use the
rx.data helper function to generate a data array from a x list.data = rx.data(
"histogram", x=[1, 6, 3, 5, 3, 14, 18, 19, 20]
)Which will render as:
data = [
{"x": 1},
{"x": 6},
{"x": 3},
{"x": 5},
{"x": 3},
{"x": 14},
{"x": 18},
{"x": 19},
{"x": 20},
]Examples
The following example shows a basic
rx.histogram component.rx.chart(
rx.histogram(
data=rx.data(
"histogram", x=[1, 6, 3, 5, 3, 14, 18, 19, 20]
),
),
)Histogram also accepts a style prop, which is an object of style properties.
rx.chart(
rx.histogram(
data=rx.data(
"histogram", x=[1, 6, 3, 5, 3, 14, 18, 19, 20]
),
style={
"data": {
"fill": "orange",
"stroke": "tomato",
"strokeWidth": 2,
"opacity": 0.5,
},
"labels": {"fill": "white", "fontSize": 12},
},
),
domain_padding={"x": 100},
)Histogram
Display a victory histogram.
Base Event Triggers
Copyright © 2023 Pynecone, Inc.