👨💻 Modelling consultant
🧮 numbers 📊 actuarial
📈 viz, interactivity, transparency
spec = calcuvizspec({
models: [pc],
input_cursors: [{
fund_value_0_in:0, unit_growth_rate_in, retirement_age_in, salary_0_in, salary_inflation_rate_in, emper_contribution_rate_in:0, contribution_charge_in
}],
mark: 'rect', // rect for heatmap
encodings: {
y: {name: 'empee_contribution_rate_in', domain: _.range(0.05,0.20,small ? 0.015 : 0.005), type:'ordinal'},
x: {name: 'age_0_in', type: 'ordinal', domain: _.range(20,50,small ? 3 : 1)},
color: {name: 'value', type: 'quantitative'},
row: {name: 'formula', domain: ['projected_fund_value']}
}
})
spec_custom = {
var o = {...spec};
o.width = 700 * (small ? 0.5 : 1)
o.height = 600 * (small ? 0.5 : 1)
o.encoding.y.axis = {format:'.1%'}
o.encoding.y.sort = 'descending'
o.encoding.color.scale = {/*range: 'diverging',*/ scheme:'turbo', reverse:true}
o.resolve = {"scale": {"color": "independent"}}
return o // other customisation like removing the redundant color legend, moving x axis to top, also possible; open below in Vega Editor & vega-lite has excellent documentation
}
spec_table = calcuvizspec({
models: [pc],
input_cursors: [{
fund_value_0_in:0, unit_growth_rate_in, retirement_age_in, salary_0_in, salary_inflation_rate_in, emper_contribution_rate_in:0, contribution_charge_in
}],
mark: 'text', // rect for heatmap
encodings: {
y: {name: 'empee_contribution_rate_in', domain: _.range(0.05,0.20,small ? 0.015 : 0.005), type:'ordinal'},
x: {name: 'age_0_in', type: 'ordinal', domain: _.range(20,50,small ? 3 : 1)},
color: {name: 'value', type: 'quantitative'},
text: {name: 'value', type: 'quantitative'},
row: {name: 'formula', domain: ['salaries_per_projected_fund']}
}
})
spec_table_custom = {
var o = {...spec_table};
o.width = 700 * (small ? 0.5 : 1)
o.height = 600 * (small ? 0.5 : 1)
o.encoding.y.axis = {format:'.1%'}
o.encoding.y.sort = 'descending'
o.encoding.text.format = '.1f'
if (o.encoding.color) { o.encoding.color.scale = {/*range: 'diverging',*/ scheme:'reds', reverse:true}; o.encoding.color.legend = null }
o.resolve = {"scale": {"color": "independent"}}
return o // other customisation like removing the redundant color legend, moving x axis to top, also possible; open below in Vega Editor & vega-lite has excellent documentation
}
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.
