Skip to content

Commit 9c81334

Browse files
tREeFrOGcodertREeFrOGcoder
committed
update efficiency graph
1 parent c75ab09 commit 9c81334

File tree

2 files changed

+62
-56
lines changed

2 files changed

+62
-56
lines changed

‎_site/index.html‎

Lines changed: 31 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -449,8 +449,8 @@ <h2>Feasibility Rank Plot</h2>
449449
// Data range
450450
const minSDF = 0.0;
451451
const maxSDF = Math.max(...efficiencyData.map(d => d.sdf), 0.2) * 1.05;
452-
const minPIR = 1.28;
453-
const maxPIR = Math.max(...efficiencyData.map(d => d.pir), 1.75) * 1.05;
452+
const minPIR = 1.24; // slightly less than 1.28 to allow padding
453+
const maxPIR = Math.max(...efficiencyData.map(d => d.pir), 1.75) * 1.05 + 0.01;
454454

455455
// Scales
456456
const xScale = val =>
@@ -546,42 +546,43 @@ <h2>Feasibility Rank Plot</h2>
546546

547547
// === Draw the extended dashed baseline (clipped to colorRectLeft..Right) ===
548548
ctx.save();
549-
ctx.setLineDash([6, 4]);
549+
ctx.setLineDash([13, 5]);
550550
ctx.strokeStyle = "orange";
551-
ctx.lineWidth = 3;
551+
ctx.lineWidth = 3.5;
552552
ctx.beginPath();
553553
ctx.moveTo(X1, Y1);
554554
ctx.lineTo(X2, Y2);
555555
ctx.stroke();
556556
ctx.restore();
557557

558-
// Add a small legend
559-
ctx.save();
560-
ctx.font = "14px sans-serif";
561-
ctx.fillStyle = "#000";
562-
const legendX = W - 140, legendY = pad + 10;
563-
ctx.fillText("Work", legendX + 35, legendY + 5);
564-
ctx.beginPath();
565-
ctx.fillStyle = "#1f77b4";
566-
ctx.moveTo(legendX + 15, legendY);
567-
ctx.lineTo(legendX + 10, legendY + 10);
568-
ctx.lineTo(legendX + 20, legendY + 10);
569-
ctx.closePath();
570-
ctx.fill();
571-
ctx.restore();
558+
// // Add a small legend
559+
// ctx.save();
560+
// ctx.font = "14px sans-serif";
561+
// ctx.fillStyle = "#000";
562+
// const legendX = W - 140, legendY = pad + 10;
563+
// ctx.fillText("Work", legendX + 35, legendY + 5);
564+
// ctx.beginPath();
565+
// ctx.fillStyle = "#1f77b4";
566+
// ctx.moveTo(legendX + 15, legendY);
567+
// ctx.lineTo(legendX + 10, legendY + 10);
568+
// ctx.lineTo(legendX + 20, legendY + 10);
569+
// ctx.closePath();
570+
// ctx.fill();
571+
// ctx.restore();
572572

573573
// === Collision-avoidance for labels ===
574574
const usedLabelYs = [];
575575
function placeLabel(px, py, text) {
576-
let labelY = py - 6;
577-
// If it conflicts, shift down
578-
while (usedLabelYs.some(y => Math.abs(y - labelY) < 14)) {
579-
labelY += 14;
580-
}
576+
let labelY = py - 4;
577+
// If it conflicts, shift down
578+
while (usedLabelYs.some(y => Math.abs(y - labelY) < 10)) {
579+
labelY += 10;
580+
}
581581
usedLabelYs.push(labelY);
582582
ctx.fillText(text, px + 6, labelY);
583583
}
584584

585+
585586
// === Plot each data point ===
586587
efficiencyData.forEach(d => {
587588
const px = xScale(d.sdf);
@@ -595,9 +596,9 @@ <h2>Feasibility Rank Plot</h2>
595596

596597
// dashed projection
597598
ctx.save();
598-
ctx.setLineDash([3,3]);
599+
ctx.setLineDash([13, 3, 2, 3]);
599600
ctx.strokeStyle = colorLine;
600-
ctx.lineWidth = 1.5;
601+
ctx.lineWidth = 2;
601602
ctx.beginPath();
602603
ctx.moveTo(px, py);
603604
ctx.lineTo(fx, fy);
@@ -608,13 +609,15 @@ <h2>Feasibility Rank Plot</h2>
608609
ctx.save();
609610
ctx.fillStyle = "#1f77b4";
610611
ctx.beginPath();
611-
ctx.moveTo(px, py - 5);
612-
ctx.lineTo(px - 5, py + 4);
613-
ctx.lineTo(px + 5, py + 4);
612+
ctx.moveTo(px, py + 5);
613+
ctx.lineTo(px-5, py - 4);
614+
ctx.lineTo(px+5, py - 4);
614615
ctx.closePath();
615616
ctx.fill();
616617
ctx.restore();
617618

619+
620+
618621
// place label with collision avoidance
619622
ctx.save();
620623
ctx.font = "14px sans-serif";

‎index.html‎

Lines changed: 31 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -449,8 +449,8 @@ <h2>Feasibility Rank Plot</h2>
449449
// Data range
450450
const minSDF = 0.0;
451451
const maxSDF = Math.max(...efficiencyData.map(d => d.sdf), 0.2) * 1.05;
452-
const minPIR = 1.28;
453-
const maxPIR = Math.max(...efficiencyData.map(d => d.pir), 1.75) * 1.05;
452+
const minPIR = 1.24; // slightly less than 1.28 to allow padding
453+
const maxPIR = Math.max(...efficiencyData.map(d => d.pir), 1.75) * 1.05 + 0.01;
454454

455455
// Scales
456456
const xScale = val =>
@@ -546,42 +546,43 @@ <h2>Feasibility Rank Plot</h2>
546546

547547
// === Draw the extended dashed baseline (clipped to colorRectLeft..Right) ===
548548
ctx.save();
549-
ctx.setLineDash([6, 4]);
549+
ctx.setLineDash([13, 5]);
550550
ctx.strokeStyle = "orange";
551-
ctx.lineWidth = 3;
551+
ctx.lineWidth = 3.5;
552552
ctx.beginPath();
553553
ctx.moveTo(X1, Y1);
554554
ctx.lineTo(X2, Y2);
555555
ctx.stroke();
556556
ctx.restore();
557557

558-
// Add a small legend
559-
ctx.save();
560-
ctx.font = "14px sans-serif";
561-
ctx.fillStyle = "#000";
562-
const legendX = W - 140, legendY = pad + 10;
563-
ctx.fillText("Work", legendX + 35, legendY + 5);
564-
ctx.beginPath();
565-
ctx.fillStyle = "#1f77b4";
566-
ctx.moveTo(legendX + 15, legendY);
567-
ctx.lineTo(legendX + 10, legendY + 10);
568-
ctx.lineTo(legendX + 20, legendY + 10);
569-
ctx.closePath();
570-
ctx.fill();
571-
ctx.restore();
558+
// // Add a small legend
559+
// ctx.save();
560+
// ctx.font = "14px sans-serif";
561+
// ctx.fillStyle = "#000";
562+
// const legendX = W - 140, legendY = pad + 10;
563+
// ctx.fillText("Work", legendX + 35, legendY + 5);
564+
// ctx.beginPath();
565+
// ctx.fillStyle = "#1f77b4";
566+
// ctx.moveTo(legendX + 15, legendY);
567+
// ctx.lineTo(legendX + 10, legendY + 10);
568+
// ctx.lineTo(legendX + 20, legendY + 10);
569+
// ctx.closePath();
570+
// ctx.fill();
571+
// ctx.restore();
572572

573573
// === Collision-avoidance for labels ===
574574
const usedLabelYs = [];
575575
function placeLabel(px, py, text) {
576-
let labelY = py - 6;
577-
// If it conflicts, shift down
578-
while (usedLabelYs.some(y => Math.abs(y - labelY) < 14)) {
579-
labelY += 14;
580-
}
576+
let labelY = py - 4;
577+
// If it conflicts, shift down
578+
while (usedLabelYs.some(y => Math.abs(y - labelY) < 10)) {
579+
labelY += 10;
580+
}
581581
usedLabelYs.push(labelY);
582582
ctx.fillText(text, px + 6, labelY);
583583
}
584584

585+
585586
// === Plot each data point ===
586587
efficiencyData.forEach(d => {
587588
const px = xScale(d.sdf);
@@ -595,9 +596,9 @@ <h2>Feasibility Rank Plot</h2>
595596

596597
// dashed projection
597598
ctx.save();
598-
ctx.setLineDash([3,3]);
599+
ctx.setLineDash([13, 3, 2, 3]);
599600
ctx.strokeStyle = colorLine;
600-
ctx.lineWidth = 1.5;
601+
ctx.lineWidth = 2;
601602
ctx.beginPath();
602603
ctx.moveTo(px, py);
603604
ctx.lineTo(fx, fy);
@@ -608,13 +609,15 @@ <h2>Feasibility Rank Plot</h2>
608609
ctx.save();
609610
ctx.fillStyle = "#1f77b4";
610611
ctx.beginPath();
611-
ctx.moveTo(px, py - 5);
612-
ctx.lineTo(px - 5, py + 4);
613-
ctx.lineTo(px + 5, py + 4);
612+
ctx.moveTo(px, py + 5);
613+
ctx.lineTo(px-5, py - 4);
614+
ctx.lineTo(px+5, py - 4);
614615
ctx.closePath();
615616
ctx.fill();
616617
ctx.restore();
617618

619+
620+
618621
// place label with collision avoidance
619622
ctx.save();
620623
ctx.font = "14px sans-serif";

0 commit comments

Comments
 (0)