andrew.ng
/
YoLo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first commit

This commit is contained in:
nguentrungthat 2025-02-26 15:15:55 +07:00
parent 54cdeb14ec
commit 66f3a4e9e3
5 changed files with 55 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/pages/components/PointsBlur.js
View File

@ -232,6 +232,9 @@ const PointBlurImageComponent = ({ imageSrc, blurredRegions, loaded, setLoaded,
<canvas ref={canvasRef} /> <canvas ref={canvasRef} />
{isOpen && ( {isOpen && (
<div style={{ backgroundColor: "#FFF", position: "absolute", top: info?.value[0].y - 200, left: info?.value[0].x, zIndex: 10 }}> <div style={{ backgroundColor: "#FFF", position: "absolute", top: info?.value[0].y - 200, left: info?.value[0].x, zIndex: 10 }}>
<div>
<span style={{ color: "#000", fontSize: "18px", fontWeight: "bold" }}>Select label</span>
</div>
{listLabel?.map((el, i) => ( {listLabel?.map((el, i) => (
<div key={i}> <div key={i}>
<button <button
@ -242,7 +245,7 @@ const PointBlurImageComponent = ({ imageSrc, blurredRegions, loaded, setLoaded,
setIsOpen(false); setIsOpen(false);
redrawCanvas(); redrawCanvas();
}} }}
style={{ backgroundColor: "#ccc", marginTop: "5px", marginBottom: "5px", width: "150px", color: "#000" }}> style={{ backgroundColor: "#ccc", width: "150px", color: "#000" }}>
{el?.name} {el?.name}
</button> </button>
</div> </div>
@ -255,7 +258,7 @@ const PointBlurImageComponent = ({ imageSrc, blurredRegions, loaded, setLoaded,
setIsOpen(false); setIsOpen(false);
redrawCanvas(); redrawCanvas();
}} }}
style={{ backgroundColor: "#ff0000", marginTop: "5px", marginBottom: "5px", width: "150px", color: "#000" }}> style={{ backgroundColor: "#ff0000", marginBottom: "10px", width: "150px", color: "#fff" }}>
Delete Delete
</button> </button>
</div> </div>

56
src/pages/index.js
View File

@ -11,13 +11,11 @@ const Main = () => {
const [imageName, setImageName] = useState(""); const [imageName, setImageName] = useState("");
const handleFileChange = async (event) => { const handleFileChange = async (event) => {
console.log(event.target.files);
const file = event.target.files[0]; const file = event.target.files[0];
if (!file) return; if (!file) return;
const formData = new FormData(); const formData = new FormData();
formData.append("image", file); formData.append("image", file);
// setImageSrc(URL.createObjectURL(file));
blurredRegions.current = []; blurredRegions.current = [];
setLoaded(false); setLoaded(false);
try { try {
@ -56,37 +54,39 @@ const Main = () => {
}; };
const handleSave = async () => { const handleSave = async () => {
let arrPoints = ""; if (blurredRegions.current?.length > 0) {
blurredRegions.current?.forEach((points) => { let arrPoints = "";
const img_w = infoImage?.width; blurredRegions.current?.forEach((points) => {
const img_h = infoImage?.height; const img_w = infoImage?.width;
const img_h = infoImage?.height;
// Get bounding box // Get bounding box
const x_min = Math.min(...points.map((p) => p.x)); const x_min = Math.min(...points.map((p) => p.x));
const y_min = Math.min(...points.map((p) => p.y)); const y_min = Math.min(...points.map((p) => p.y));
const x_max = Math.max(...points.map((p) => p.x)); const x_max = Math.max(...points.map((p) => p.x));
const y_max = Math.max(...points.map((p) => p.y)); const y_max = Math.max(...points.map((p) => p.y));
const x_center = (x_min + x_max) / 2 / img_w; const x_center = (x_min + x_max) / 2 / img_w;
const y_center = (y_min + y_max) / 2 / img_h; const y_center = (y_min + y_max) / 2 / img_h;
const width = (x_max - x_min) / img_w; const width = (x_max - x_min) / img_w;
const height = (y_max - y_min) / img_h; const height = (y_max - y_min) / img_h;
// Get class ID // Get class ID
const class_id = listLabel.find((label) => label?.name === points[0].label)?.id || "0"; const class_id = listLabel.find((label) => label?.name === points[0].label)?.id || "0";
const yolo_label = `${class_id} ${x_center.toFixed(6)} ${y_center.toFixed(6)} ${width.toFixed(6)} ${height.toFixed(6)}`; const yolo_label = `${class_id} ${x_center.toFixed(6)} ${y_center.toFixed(6)} ${width.toFixed(6)} ${height.toFixed(6)}`;
arrPoints += yolo_label + "\n"; arrPoints += yolo_label + "\n";
}); });
const url = "http://localhost:5000/save"; const url = "http://localhost:5000/save";
const formData = new FormData(); const formData = new FormData();
formData.append("list", arrPoints); formData.append("list", arrPoints);
formData.append("imageName", imageName); formData.append("imageName", imageName);
await fetch(url, { await fetch(url, {
method: "POST", method: "POST",
body: formData, body: formData,
}); });
}
}; };
return ( return (

BIN
src/server/images/detect_image_250226_142652.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 262 KiB

20
src/server/label/detect_image_250226_142652.txt Normal file
View File

@ -0,0 +1,20 @@
1 0.846875 0.679733 0.102500 0.046706
1 0.399687 0.411593 0.091875 0.032527
1 0.394375 0.494579 0.096250 0.036697
1 0.380000 0.703086 0.107500 0.041701
1 0.384062 0.592160 0.104375 0.041701
0 0.751563 0.582152 0.038125 0.031693
0 0.302187 0.718098 0.043125 0.031693
0 0.324688 0.505421 0.038125 0.028357
0 0.725938 0.486239 0.036875 0.028357
0 0.334375 0.416597 0.035000 0.025855
0 0.774687 0.688907 0.039375 0.036697
1 0.399375 0.333194 0.090000 0.032527
0 0.310000 0.603003 0.038750 0.031693
0 0.697187 0.325271 0.033125 0.020017
0 0.703125 0.401168 0.032500 0.025021
0 0.336875 0.337364 0.035000 0.022519
1 0.792500 0.481234 0.092500 0.033361
1 0.820937 0.572560 0.100625 0.040867
1 0.759687 0.325271 0.080000 0.028357
1 0.766250 0.399917 0.076875 0.032527

4
src/server/main.py
View File

@ -73,8 +73,8 @@ def get_image(filename):
@app.route('/save', methods=['POST']) @app.route('/save', methods=['POST'])
def save_data(): def save_data():
# Get form data # Get form data
arr_points = request.form.get("list") # This will be a string arr_points = request.form.get("list")
image_name = request.form.get("imageName") # This will be a string image_name = request.form.get("imageName")
if not arr_points or not image_name: if not arr_points or not image_name:
return jsonify({"error": "Missing required fields"}), 400 return jsonify({"error": "Missing required fields"}), 400