billboard.js 1.10 release: Bubble dimension, axis culling & more!

For the detailed release info, please checkout the release note:
https://github.com/naver/billboard.js/releases/tag/1.10.0

What’s New?

Bubble size tied with Y Axis value
A sample chart visualizing GDP by region and the life expectancy (source)
// for 'bubble' type, data can contain dimension value:
// - an array of [y, z] data following the order
// - or an object with 'y' and 'z' key value
// 'y' is for y axis coordination and 'z' is the bubble radius value
data: {
columns: [
["data1",
[10, 140], // or {y:10, z: 140}
[100, 30],
200
]
],
type: "bubble"
}

Demo: https://naver.github.io/billboard.js/demo/#Chart.BubbleDimensionChart

Bubble’s dimension tied or untied from Y Axis value
x Axis tick text overlapped

Demo: https://naver.github.io/billboard.js/demo/#Axis.YAxisTickCulling

axis: {
y: { // or 'y2'
tick: {
culling: false
// or set maximum tick text count to be displayed
culling: {
max: 5
}
}
}
}
How culling is applied according the option
Default axis text positioning
radar: {
axis: {
text: {
// Specify 'x' or 'y' value relative its original position.
position: {
x: 5,
y: -5
}
}
}
}

Demo: https://naver.github.io/billboard.js/demo/#RadarChartOptions.RadarLevel

Position value according its edge’s position
var chart = bb.generate({
// @param {Chart} ctx - Instance itself
onrendered: function(ctx) {
// ctx == chart
...
}
};

New release process adoption

What’s Next?

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store