1import { Chart, Navigation, NavigationStack, RuleChart, Script, VStack } from "scripting"
2
3const data = [
4 { startMonth: 1, numMonths: 9, source: "Trees" },
5 { startMonth: 12, numMonths: 1, source: "Trees" },
6 { startMonth: 3, numMonths: 8, source: "Grass" },
7 { startMonth: 4, numMonths: 8, source: "Weeds" },
8]
9
10function Example() {
11
12 return <NavigationStack>
13 <VStack
14 navigationTitle={"RuleChart"}
15 navigationBarTitleDisplayMode={"inline"}
16 >
17 <Chart
18 frame={{
19 height: 300
20 }}
21 >
22 <RuleChart
23 labelOnYAxis
24 marks={
25 data.map(item => ({
26 start: item.startMonth,
27 end: item.startMonth + item.numMonths,
28 label: item.source,
29 }))
30 }
31 />
32 </Chart>
33 </VStack>
34 </NavigationStack>
35}
36
37async function run() {
38 await Navigation.present({
39 element: <Example />
40 })
41
42 Script.exit()
43}
44
45run()
