Public
Edited
May 5
import {vl} from "@vega/vega-lite-api-v5"
import {printTable} from "@uwdata/data-utilities"
cnn1 = FileAttachment("Aggregated_Results_CNN_v1.csv").csv()
cnn2 = FileAttachment("Aggregated_Results_CNN_v2.csv").csv()
vit1 = FileAttachment("Aggregated_Results_transformer_v1.csv").csv()
vit2 = FileAttachment("Aggregated_Results_transformer_v2.csv").csv()
best = FileAttachment("Best_revised.csv").csv()
newmodels = FileAttachment("Combined Metrics - Sheet2 (2).csv").csv()
printTable(best.slice(0,5))
vl.markBar()
.data(best)
.encode(
vl.x().fieldN('Model').title('Model').axis({ labelAngle: -30 }),
vl.y().fieldQ('Accuracy').title('Accuracy Score'),
vl.color().fieldN('Preprocessing').title('Preprocessing')
.legend({ orient: 'right', titleFontSize: 12 }), // preprocessing color coding
vl.column().fieldN('Balanced').title('')
.header({
labelExpr: "datum.value == 'Yes' ? 'Balanced data' : 'Unbalanced data'" // Relabel values for subplots
}),
vl.tooltip().fieldN('Model_type')
)
.width(200) // sub-chart width
.height(400)
.title({
text: 'Accuracy of Best Performing Models',
anchor: 'middle', // Center title
fontSize: 14,
offset: 20 // vertical spacing
})
.render()
vl.markBar()
.data(best)
.encode(
vl.x().fieldN('Model').title('Model').axis({ labelAngle: -30 }),
vl.y().fieldQ('AUC').title('AUC Score'),
vl.color().fieldN('Preprocessing').title('Preprocessing')
.legend({ orient: 'right', titleFontSize: 12 }),
vl.column().fieldN('Balanced').title('')
.header({
labelExpr: "datum.value == 'Yes' ? 'Balanced data' : 'Unbalanced data'" // Relabel values for subplots
}),
vl.tooltip().fieldN('Model_type')
)
.width(200) // sub-chart width
.height(400)
.title({
text: 'AUC of Best Performing Models',
anchor: 'middle', // Center title
fontSize: 14,
offset: 20 // vertical spacing
})
.render()
(best.map(d => d.Balanced));
vl.markPoint({ size: 100 })
.data(newmodels)
.encode(
vl.x().fieldQ('Accuracy').title('Accuracy').scale({ domain: [0.6, 1] }), // set bounds
vl.y().fieldQ('AUC').title('AUC').scale({ domain: [0.6, 1] }),
vl.color().fieldN('Model').title('Model').scale({ scheme: "category10" }),
vl.shape().fieldN('Balanced?').title('Balanced'),
vl.tooltip([vl.tooltip().fieldN('Model'), vl.tooltip().fieldQ('Macro-F1').title('F1 Score')])
)
.width(450)
.height(300)
.title('Accuracy vs. AUC')
.render()
vl.layer(
vl.markPoint({ size: 100 })
.data(newmodels)
.encode(
vl.x().fieldQ('Accuracy').title('Accuracy').scale({ domain: [0.6, 1] }), // set bounds
vl.y().fieldQ('AUC').title('AUC').scale({ domain: [0.9, 1] }),
vl.color().fieldN('Model').title('Model').scale({ scheme: "category10" }),
vl.shape().fieldN('Balanced?').title('Balanced'),
vl.tooltip([vl.tooltip().fieldN('Model'), vl.tooltip().fieldQ('Macro-F1').title('F1 Score')])
),
// error bars
vl.markRule()
.data(newmodels)
.encode( vl.x().fieldQ('Acc_CI_low'),
vl.x2().fieldQ('Acc_CI_high'),
vl.y().fieldQ('AUC'),
vl.color().fieldN('Model') ),
vl.markRule()
.data(newmodels)
.encode(
vl.y().fieldQ('AUC_CI_low'),
vl.y2().fieldQ('AUC_CI_high'),
vl.x().fieldQ('Accuracy'),
vl.color().fieldN('Model'))
)
.width(550)
.height(350)
.title('Accuracy vs. AUC with Confidence Intervals')
.render()
// testing styles
vl.markBar()
.data(best)
.encode(
vl.y().fieldQ('Accuracy').title('Accuracy Score'),
vl.x().fieldN('Model').title('Model').axis({ labelAngle: -10 }),
vl.color().fieldN('Model_type'), // Color by Model_type
vl.xOffset().fieldN('Model_type'),
vl.tooltip().fieldN('Model_type')
)
.width(300)
.height(300)
.title('Accuracy of Best Performing Models')
.render()
traintestsplit = [
{ "category": "Train Images", "value": 5120 },
{ "category": "Test Images", "value": 1280 }
] // noted from Huggingface dataset
vl.markArc({ innerRadius: 0, outerRadius: 130 })
.data(traintestsplit)
.transform(
vl.joinaggregate([{ op: 'sum', field: 'value', as: 'TotalCount' }]),
vl.calculate('datum.value / datum.TotalCount').as('Percentage') // find percentage of total
)
.encode(
vl.theta().fieldQ('value').title('count'), // set number of rows as value
vl.color().fieldN('category').title('') // assign to data split
.scale({scheme: "paired" }),
vl.tooltip([ // display percentages upon hover
vl.tooltip().fieldQ('value').title('Count'),
vl.tooltip().fieldQ('Percentage').title('Percentage').format('.1%')
])
)
// plot settings
.width(300)
.height(300)
.title('Train Test Data Split')
.render()
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.
