Interactive charts for Ruby, powered by Vega and Vega-Lite
Vega.lite
.data(data)
.mark(type: "line", tooltip: true, interpolate: "cardinal", point: {size: 60})
.encoding(
x: {field: "x", type: "temporal", scale: {type: "utc"}, axis: {format: "%b %e"}},
y: {field: "y", type: "quantitative"}
)
.config(axis: {title: nil, labelFontSize: 12})
Vega.lite
.data(data)
.mark(type: "arc", tooltip: true)
.encoding(
color: {field: "x", type: "nominal", axis: {title: nil}, legend: {labelFontSize: 12}},
theta: {field: "y", type: "quantitative"}
)
.view(stroke: nil)
Vega.lite
.data(data)
.mark(type: "bar", tooltip: true)
.encoding(
x: {field: "x", type: "nominal", sort: "none", axis: {labelAngle: 0}},
y: {field: "y", type: "quantitative"}
)
.config(axis: {title: nil, labelFontSize: 12})
Vega.lite
.data(data)
.mark(type: "bar", tooltip: true)
.encoding(
y: {field: "x", type: "nominal", sort: "none"},
x: {field: "y", type: "quantitative"}
)
.config(axis: {title: nil, labelFontSize: 12})
Vega.lite
.data(data)
.mark(type: "area", tooltip: true, interpolate: "cardinal", point: {size: 60})
.encoding(
x: {field: "x", type: "temporal", scale: {type: "utc"}, axis: {format: "%b %e"}},
y: {field: "y", type: "quantitative"}
)
.config(axis: {title: nil, labelFontSize: 12})
Vega.lite
.data(data)
.mark(type: "circle", tooltip: true)
.encoding(
x: {field: "x", type: "quantitative", scale: {zero: false}},
y: {field: "y", type: "quantitative", scale: {zero: false}},
size: {value: 60}
)
.config(axis: {title: nil, labelFontSize: 12})
Vega.lite
.data(data)
.mark(type: "line", point: {size: 60}, tooltip: true, interpolate: "cardinal")
.encoding(
x: {field: "x", type: "temporal", scale: {type: "utc"}, axis: {format: "%b %e"}},
y: {field: "y", type: "quantitative"},
color: {field: "z", axis: {title: nil}}
)
.config(axis: {title: nil, labelFontSize: 12})