vl.layer(
vl.markRect().encode(
vl.y()
.fieldO('day')
.timeUnit('monthdate')
.title('')
.axis({ labelFontSize: 15 }),
vl.x()
.fieldN('country')
.title('')
.sort({ op: 'max', field: 'total', order: 'descending' })
.axis({ labelFontSize: 15 }),
vl.color()
.fieldQ('growthnorm')
.scale({
name: 'color',
type: 'linear',
range: ['#e7d9f7', '#7505ff'],
domain: [0, 1],
reverse: false,
zero: false
})
.legend(null),
vl.tooltip([
vl.tooltip().fieldT('day').title('Date'),
vl.tooltip().fieldQ('growthrate').title('Growth Rate').format('.0%'),
vl.tooltip().fieldO('country').title('Country'),
vl.tooltip().fieldQ('total').title('Total Cases')
])
)
)
.data(top20Data)
.width(width - 70)
.render()