Chiebot-Mirror
/
ultralytics
mirror of https://github.com/ultralytics/ultralytics.git
9
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

Add RTDETRv2 in `benchmarks.md` chart 📈 (#17635)

Browse Source
pull/17369/merge
Muhammad Rizwan Munawar 1 week ago committed by GitHub
parent 1c6bfd3039
commit 652e05e833
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 66 additions and 44 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 19
      docs/en/modes/benchmark.md
  2. 91
      docs/overrides/javascript/extra.js

19
docs/en/modes/benchmark.md
Unescape View File

@ -18,15 +18,18 @@ keywords: model benchmarking, YOLO11, Ultralytics, performance evaluation, expor
<div style="display: flex; align-items: flex-start;"> <div style="display: flex; align-items: flex-start;">
<div style="margin-right: 20px;"> <div style="margin-right: 20px;">
<label><input type="checkbox" name="algorithm" value="YOLO11" checked><span>Ultralytics YOLO11</span></label><br> <label><input type="checkbox" name="algorithm" value="YOLO11" checked><span>YOLO11</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv6" checked><span>YOLOv6</span></label><br> <label><input type="checkbox" name="algorithm" value="YOLOv10" checked><span>YOLOv10</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv7" checked><span>YOLOv7</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv10" checked><span>YOLOv10</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv9" checked><span>YOLOv9</span></label><br> <label><input type="checkbox" name="algorithm" value="YOLOv9" checked><span>YOLOv9</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv8" checked><span>Ultralytics YOLOv8</span></label><br> <label><input type="checkbox" name="algorithm" value="YOLOv8" checked><span>YOLOv8</span></label><br>
<label><input type="checkbox" name="algorithm" value="PPYOLOE" checked><span>PPYOLOE</span></label><br> <label><input type="checkbox" name="algorithm" value="YOLOv7" checked><span>YOLOv7</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOv5" checked><span>Ultralytics YOLOv5</span></label> <label><input type="checkbox" name="algorithm" value="YOLOv6-3.0" checked><span>YOLOv6-3.0</span></label><br>
</div> <label><input type="checkbox" name="algorithm" value="YOLOv5" checked><span>YOLOv5</span></label><br>
<label><input type="checkbox" name="algorithm" value="PP-YOLOE+" checked><span>PP-YOLOE+</span></label><br>
<label><input type="checkbox" name="algorithm" value="DAMO-YOLO" checked><span>DAMO-YOLO</span></label><br>
<label><input type="checkbox" name="algorithm" value="YOLOX" checked><span>YOLOX</span></label><br>
<label><input type="checkbox" name="algorithm" value="RTDETRv2" checked><span>RTDETRv2</span></label>
</div>
<div style="flex-grow: 1;"><canvas id="chart"></canvas></div> <!-- Canva for plotting benchmarks --> <div style="flex-grow: 1;"><canvas id="chart"></canvas></div> <!-- Canva for plotting benchmarks -->
</div> </div>

91
docs/overrides/javascript/extra.js
Unescape View File

@ -152,48 +152,68 @@ document.addEventListener("DOMContentLoaded", () => {
// This object contains the benchmark data for various object detection models. // This object contains the benchmark data for various object detection models.
const data = { const data = {
'YOLOv5': {s: {speed: 1.92, mAP: 37.4}, m: {speed: 4.03, mAP: 45.4}, l: {speed: 6.61, mAP: 49.0}, x: {speed: 11.89, mAP: 50.7}}, 'YOLO11': {n: {speed: 1.55, mAP: 39.5}, s: {speed: 2.63, mAP: 47.0}, m: {speed: 5.27, mAP: 51.4}, l: {speed: 6.84, mAP: 53.2}, x: {speed: 12.49, mAP: 54.7}},
'YOLOv6': {n: {speed: 1.17, mAP: 37.5}, s: {speed: 2.66, mAP: 45.0}, m: {speed: 5.28, mAP: 50.0}, l: {speed: 8.95, mAP: 52.8}},
'YOLOv7': {l: {speed: 6.84, mAP: 51.4}, x: {speed: 11.57, mAP: 53.1}},
'YOLOv8': {n: {speed: 1.47, mAP: 37.3}, s: {speed: 2.66, mAP: 44.9}, m: {speed: 5.86, mAP: 50.2}, l: {speed: 9.06, mAP: 52.9}, x: {speed: 14.37, mAP: 53.9}},
'YOLOv9': {t: {speed: 2.30, mAP: 37.8}, s: {speed: 3.54, mAP: 46.5}, m: {speed: 6.43, mAP: 51.5}, c: {speed: 7.16, mAP: 52.8}, e: {speed: 16.77, mAP: 55.1}},
'YOLOv10': {n: {speed: 1.56, mAP: 39.5}, s: {speed: 2.66, mAP: 46.7}, m: {speed: 5.48, mAP: 51.3}, b: {speed: 6.54, mAP: 52.7}, l: {speed: 8.33, mAP: 53.3}, x: {speed: 12.2, mAP: 54.4}}, 'YOLOv10': {n: {speed: 1.56, mAP: 39.5}, s: {speed: 2.66, mAP: 46.7}, m: {speed: 5.48, mAP: 51.3}, b: {speed: 6.54, mAP: 52.7}, l: {speed: 8.33, mAP: 53.3}, x: {speed: 12.2, mAP: 54.4}},
'PPYOLOE': {t: {speed: 2.84, mAP: 39.9}, s: {speed: 2.62, mAP: 43.7}, m: {speed: 5.56, mAP: 49.8}, l: {speed: 8.36, mAP: 52.9}, x: {speed: 14.3, mAP: 54.7}}, 'YOLOv9': {t: {speed: 2.30, mAP: 37.8}, s: {speed: 3.54, mAP: 46.5}, m: {speed: 6.43, mAP: 51.5}, c: {speed: 7.16, mAP: 52.8}, e: {speed: 16.77, mAP: 55.1}},
'YOLO11': {n: {speed: 1.55, mAP: 39.5}, s: {speed: 2.63, mAP: 47.0}, m: {speed: 5.27, mAP: 51.4}, l: {speed: 6.84, mAP: 53.2}, x: {speed: 12.49, mAP: 54.7}} 'YOLOv8': {n: {speed: 1.47, mAP: 37.3}, s: {speed: 2.66, mAP: 44.9}, m: {speed: 5.86, mAP: 50.2}, l: {speed: 9.06, mAP: 52.9}, x: {speed: 14.37, mAP: 53.9}},
'YOLOv7': {l: {speed: 6.84, mAP: 51.4}, x: {speed: 11.57, mAP: 53.1}},
'YOLOv6-3.0': {n: {speed: 1.17, mAP: 37.5}, s: {speed: 2.66, mAP: 45.0}, m: {speed: 5.28, mAP: 50.0}, l: {speed: 8.95, mAP: 52.8}},
'YOLOv5': {s: {speed: 1.92, mAP: 37.4}, m: {speed: 4.03, mAP: 45.4}, l: {speed: 6.61, mAP: 49.0}, x: {speed: 11.89, mAP: 50.7}},
'PP-YOLOE+': {t: {speed: 2.84, mAP: 39.9}, s: {speed: 2.62, mAP: 43.7}, m: {speed: 5.56, mAP: 49.8}, l: {speed: 8.36, mAP: 52.9}, x: {speed: 14.3, mAP: 54.7}},
'DAMO-YOLO': {t: {speed: 2.32, mAP: 42.0}, s: {speed: 3.45, mAP: 46.0}, m: {speed: 5.09, mAP: 49.2}, l: {speed: 7.18, mAP: 50.8}},
'YOLOX': {s: {speed: 2.56, mAP: 40.5}, m: {speed: 5.43, mAP: 46.9},l: {speed: 9.04, mAP: 49.7}, x: {speed: 16.1, mAP: 51.1}},
'RTDETRv2': {s: {speed: 5.03, mAP: 48.1}, m: {speed: 7.51, mAP: 51.9}, l: {speed: 9.76, mAP: 53.4}, x: {speed: 15.03, mAP: 54.3}}
}; };
let chart = null; // chart variable will hold the reference to the current chart instance. let chart = null; // chart variable will hold the reference to the current chart instance.
// This function is responsible for updating the benchmarks chart. // Function to lighten a hex color by a specified amount.
function lightenHexColor(color, amount = 0.5) {
const r = parseInt(color.slice(1, 3), 16);
const g = parseInt(color.slice(3, 5), 16);
const b = parseInt(color.slice(5, 7), 16);
const newR = Math.min(255, Math.round(r + (255 - r) * amount));
const newG = Math.min(255, Math.round(g + (255 - g) * amount));
const newB = Math.min(255, Math.round(b + (255 - b) * amount));
return `#${newR.toString(16).padStart(2, '0')}${newG.toString(16).padStart(2, '0')}${newB.toString(16).padStart(2, '0')}`;
}
// Function to update the benchmarks chart.
function updateChart() { function updateChart() {
// If a chart instance already exists, destroy it. if (chart) {chart.destroy();} // If a chart instance already exists, destroy it.
if (chart) {
chart.destroy(); // Define a specific color map for models.
} const colorMap = {'YOLO11': '#0b23a9', 'YOLOv10': '#ff7f0e', 'YOLOv9': '#2ca02c', 'YOLOv8': '#d62728',
'YOLOv7': '#9467bd', 'YOLOv6-3.0': '#8c564b', 'YOLOv5': '#e377c2', 'PP-YOLOE+': '#7f7f7f',
'DAMO-YOLO': '#bcbd22', 'YOLOX': '#17becf', 'RTDETRv2': '#eccd22'};
// Get the selected algorithms from the checkboxes. // Get the selected algorithms from the checkboxes.
const selectedAlgorithms = [...document.querySelectorAll('input[name="algorithm"]:checked')].map(e => e.value); const selectedAlgorithms = [...document.querySelectorAll('input[name="algorithm"]:checked')].map(e => e.value);
// Create the datasets for the selected algorithms. // Create the datasets for the selected algorithms.
const datasets = selectedAlgorithms.map((algorithm, index) => ({ const datasets = selectedAlgorithms.map((algorithm, i) => {
label: algorithm, // Label for the data points in the legend. const baseColor = colorMap[algorithm] || `hsl(${Math.random() * 360}, 70%, 50%)`;
data: Object.entries(data[algorithm]).map(([version, point]) => ({ const lineColor = i === 0 ? baseColor : lightenHexColor(baseColor, 0.6); // Lighten non-primary lines.
x: point.speed, // Speed data points on the x-axis.
y: point.mAP, // mAP data points on the y-axis. return {
version: version.toUpperCase() // Store the version as additional data. label: algorithm, // Label for the data points in the legend.
})), data: Object.entries(data[algorithm]).map(([version, point]) => ({
fill: false, // Don't fill the chart. x: point.speed, // Speed data points on the x-axis.
borderColor: `hsl(${index * 90}, 70%, 50%)`, // Assign a unique color to each dataset. y: point.mAP, // mAP data points on the y-axis.
tension: 0.3, // Smooth the line. version: version.toUpperCase() // Store the version as additional data.
pointRadius: 5, // Increase the dot size. })),
pointHoverRadius: 10, // Increase the dot size on hover. fill: false, // Don't fill the chart.
borderWidth: 2 // Set the line thickness. borderColor: lineColor, // Use the lightened color for the line.
})); tension: 0.3, // Smooth the line.
pointRadius: i === 0 ? 7 : 4, // Highlight primary dataset points.
// If there are no selected algorithms, return without creating a new chart. pointHoverRadius: i === 0 ? 9 : 6, // Highlight hover for primary dataset.
if (datasets.length === 0) { pointBackgroundColor: lineColor, // Fill points with the line color.
return; pointBorderColor: '#ffffff', // Add a border around points for contrast.
} borderWidth: i === 0 ? 3 : 1.5 // Slightly increase line size for the primary dataset.
};
});
if (datasets.length === 0) {return;} // If there are no selected algorithms, return without creating a new chart.
// Create a new chart instance. // Create a new chart instance.
chart = new Chart(document.getElementById('chart').getContext('2d'), { chart = new Chart(document.getElementById('chart').getContext('2d'), {
@ -201,7 +221,7 @@ function updateChart() {
data: { datasets }, data: { datasets },
options: { options: {
plugins: { plugins: {
legend: { display: true, position: 'top', labels: {color: '#808080'} }, // Configure the legend. legend: { display: true, position: 'top', labels: { color: '#808080' } }, // Configure the legend.
tooltip: { tooltip: {
callbacks: { callbacks: {
label: (tooltipItem) => { label: (tooltipItem) => {
@ -210,20 +230,19 @@ function updateChart() {
return `${dataset.label}${point.version.toLowerCase()}: Speed = ${point.x}, mAP = ${point.y}`; // Custom tooltip label. return `${dataset.label}${point.version.toLowerCase()}: Speed = ${point.x}, mAP = ${point.y}`; // Custom tooltip label.
} }
}, },
mode: 'nearest', mode: 'nearest', intersect: false
intersect: false
} // Configure the tooltip. } // Configure the tooltip.
}, },
interaction: { mode: 'nearest', axis: 'x', intersect: false }, // Configure the interaction mode. interaction: { mode: 'nearest', axis: 'x', intersect: false }, // Configure the interaction mode.
scales: { scales: {
x: { x: {
type: 'linear', position: 'bottom', type: 'linear', position: 'bottom',
title: { display: true, text: 'Latency T4 TensorRT10 FP16 (ms/img)', color: '#808080'}, // X-axis title. title: { display: true, text: 'Latency T4 TensorRT10 FP16 (ms/img)', color: '#808080' }, // X-axis title.
grid: { color: '#e0e0e0' }, // Grid line color. grid: { color: '#e0e0e0' }, // Grid line color.
ticks: { color: '#808080' } // Tick label color. ticks: { color: '#808080' } // Tick label color.
}, },
y: { y: {
title: { display: true, text: 'mAP', color: '#808080'}, // Y-axis title. title: { display: true, text: 'mAP', color: '#808080' }, // Y-axis title.
grid: { color: '#e0e0e0' }, // Grid line color. grid: { color: '#e0e0e0' }, // Grid line color.
ticks: { color: '#808080' } // Tick label color. ticks: { color: '#808080' } // Tick label color.
} }

Write Preview
Loading…
Cancel
Save