ClusterCockpit/cc-backend
1
0
Fork 0
mirror of https://github.com/ClusterCockpit/cc-backend synced 2024-12-26 05:19:05 +01:00
Code Issues Packages Releases Activity

fix: adapt roofline render to browser zoomlevel

Browse Source 
- make roofline linewidth configurable
This commit is contained in:
Christoph Kluge 2023-09-15 11:09:01 +02:00
parent bb1c8cc25d
commit e61ff01518
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/frontend/src/plots/Roofline.svelte
View File

@ -15,6 +15,8 @@
let uplot = null let uplot = null
let timeoutId = null let timeoutId = null
const lineWidth = clusterCockpitConfig.plot_general_lineWidth
/* Data Format /* Data Format
* data = [null, [], []] // 0: null-axis required for scatter, 1: Array of XY-Array for Scatter, 2: Optional Time Info * data = [null, [], []] // 0: null-axis required for scatter, 1: Array of XY-Array for Scatter, 2: Optional Time Info
* data[1][0] = [100, 200, 500, ...] // X Axis -> Intensity (Vals up to clusters' flopRateScalar value) * data[1][0] = [100, 200, 500, ...] // X Axis -> Intensity (Vals up to clusters' flopRateScalar value)
@ -160,7 +162,7 @@
const padding = u._padding // [top, right, bottom, left] const padding = u._padding // [top, right, bottom, left]
u.ctx.strokeStyle = 'black' u.ctx.strokeStyle = 'black'
u.ctx.lineWidth = 2 u.ctx.lineWidth = lineWidth
u.ctx.beginPath() u.ctx.beginPath()
const ycut = 0.01 * cluster.memoryBandwidth.value const ycut = 0.01 * cluster.memoryBandwidth.value
@ -171,14 +173,17 @@
flopRateScalarY = u.valToPos(cluster.flopRateScalar.value, 'y', true), flopRateScalarY = u.valToPos(cluster.flopRateScalar.value, 'y', true),
flopRateSimdY = u.valToPos(cluster.flopRateSimd.value, 'y', true) flopRateSimdY = u.valToPos(cluster.flopRateSimd.value, 'y', true)
if (scalarKneeX < width - padding[1]) { // Top horizontal roofline // Debug get zoomLevel from browser
// console.log("Zoom", Math.round(window.devicePixelRatio * 100))
if (scalarKneeX < (width * window.devicePixelRatio) - (padding[1] * window.devicePixelRatio)) { // Top horizontal roofline
u.ctx.moveTo(scalarKneeX, flopRateScalarY) u.ctx.moveTo(scalarKneeX, flopRateScalarY)
u.ctx.lineTo(width - padding[1], flopRateScalarY) u.ctx.lineTo((width * window.devicePixelRatio) - (padding[1] * window.devicePixelRatio), flopRateScalarY)
} }
if (simdKneeX < width - padding[1]) { // Lower horitontal roofline if (simdKneeX < (width * window.devicePixelRatio) - (padding[1] * window.devicePixelRatio)) { // Lower horitontal roofline
u.ctx.moveTo(simdKneeX, flopRateSimdY) u.ctx.moveTo(simdKneeX, flopRateSimdY)
u.ctx.lineTo(width - padding[1], flopRateSimdY) u.ctx.lineTo((width * window.devicePixelRatio) - (padding[1] * window.devicePixelRatio), flopRateSimdY)
} }
let x1 = u.valToPos(0.01, 'x', true), let x1 = u.valToPos(0.01, 'x', true),