Web Platform Advocate at @CloudinaryLtd
Published unlisted
Edited
Jan 26, 2022
Importers
processedData.filter( d => d.viewportWidth * Math.min(d.dpr, 2) <= 828 ).reduce( ( acc, cv ) => { return acc + cv.sessionsPercent }, 0 )
data = FileAttachment("gov_uk_width_dpr.json").json()
totalSessions = data.reduce( ( totalSessions, o ) => {
return totalSessions + o.sessions;
}, 0 )
processedData = data.map(o => ({
viewportWidth: o.width,
dpr: o.dpr,
usefulPixelWidth: Math.round( o.width * Math.min( o.dpr, 2 ) ),
sessionsPercent: o.sessions / totalSessions
}))
usefulWidths = {
let results = [];
for( let i = 1; i < 2000; i++ ) {
results.push( {
width: i,
cumulativePercentOfSessions: processedData
.filter( d => d.usefulPixelWidth <= i )
.reduce( ( acc, cv ) => acc += cv.sessionsPercent, 0 )
} );
}
return results;
}
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.
