The avatar for @chrt
chrt.io
A spontaneous approach to chart creation. Created by @littleark
Public
chrt
Edited
Jan 13, 2024
Fork of Markers
•
2 forks
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
chrt.Chrt()
.size(chrtWidth, chrtHeight)
.data([5,1,2,5,6,2,4,6])
.add(chrt.xAxis(5))
.add(chrt.verticalRange().from(3).to(6))
.node()
Insert cell
Insert cell
chrt.Chrt()
.size(chrtWidth, chrtHeight)
.data([5,1,2,5,6,2,4,6])
.add(chrt.yAxis(5))
.add(chrt.horizontalRange().from(3).to(6))
.node()
Insert cell
Insert cell
chrt.Chrt()
.size(chrtWidth, chrtHeight)
.data([5,1,2,5,6,2,4,6])
.add(chrt.xAxis(5))
.add(chrt.verticalRange().from(3))
.node()
Insert cell
## Horizontal AB-Line
A **marker** is created by adding a `chrtMarkers` component to a `chrtLine`.
Insert cell
chrt.Chrt()
.size(chrtWidth, chrtHeight)
.data([5,1,2,5,6,2,4,6])
.add(chrt.yAxis(5))
.add(chrt.horizontalRange().from(3))
.node()
Insert cell
Insert cell
chrt.Chrt()
.size(chrtWidth, chrtHeight)
.data([5,1,2,5,6,2,4,6])
.add(chrt.xAxis(5))
.add(
chrt.verticalRange()
.from(1)
.stroke('#336699')
.strokeWidth(3)
.dotted()
)
.add(
chrt.verticalRange()
.from(4)
.to(6)
.fill('#f00')
.fillOpacity(0.5)
.stroke('#336699')
.strokeWidth(3)
.dashed()
)
.node()
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more