render({
mark: { type: "line" },
data: { values: data },
encoding: {
x: {field: 'month', type: 'ordinal', axis: {title: null}, sort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']},
y: {field: 'sunshine_hours', type: 'quantitative', title: 'Hours of Sunshine'},
color: {field: 'city', type: 'nominal', title: 'City', sort: ['Miami', 'San Francisco', 'New York', 'Houston', 'Chicago', 'Seattle']}
},
width: 600
})