barry/Wildlife-Detection
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add cam dist

Browse Source
This commit is contained in:
everbarry 2026-03-25 15:48:13 +01:00
parent 8bc7eb9f4b
commit 60ead1ff06
1 changed files with 54 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
dashboard.py
View File

@ -358,7 +358,13 @@ def camera(cam_id):
if cam_id not in CAMERAS: if cam_id not in CAMERAS:
return "Camera not found", 404 return "Camera not found", 404
cam_dets = [d for d in reversed(detections) if d["cam"] == cam_id] cam_dets = [d for d in reversed(detections) if d["cam"] == cam_id]
return render_template_string(CAM_HTML, cam_id=cam_id, cam=CAMERAS[cam_id], dets=cam_dets) return render_template_string(
CAM_HTML,
cam_id=cam_id,
cam=CAMERAS[cam_id],
dets=cam_dets,
class_names=CLASS_NAMES,
)
@app.route("/api/verify/<det_id>", methods=["POST"]) @app.route("/api/verify/<det_id>", methods=["POST"])
@ -1103,6 +1109,18 @@ body{font-family:system-ui,-apple-system,sans-serif;background:#0f172a;color:#e2
.card-badge.unverified{background:rgba(148,163,184,.15);color:#64748b} .card-badge.unverified{background:rgba(148,163,184,.15);color:#64748b}
.empty{text-align:center;padding:60px 20px;opacity:.4;font-size:14px;line-height:1.6} .empty{text-align:center;padding:60px 20px;opacity:.4;font-size:14px;line-height:1.6}
.cam-chart-panel{
background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);
border-radius:14px;padding:16px 20px;margin-bottom:24px;
}
.cam-chart-panel h3{
font-size:11px;opacity:.45;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px;
}
.bar-row{display:flex;align-items:center;margin-bottom:5px;font-size:12px;padding:3px 0;border-radius:5px}
.bar-label{width:58px;text-align:right;padding-right:8px;opacity:.7}
.bar-fill{height:16px;background:#3b82f6;border-radius:3px;transition:width .5s ease;min-width:2px}
.bar-num{padding-left:6px;opacity:.45;font-size:11px}
</style> </style>
</head> </head>
<body> <body>
@ -1116,6 +1134,10 @@ body{font-family:system-ui,-apple-system,sans-serif;background:#0f172a;color:#e2
</div> </div>
<div class="container"> <div class="container">
<div class="cam-chart-panel">
<h3>Detections by Species (this camera)</h3>
<div id="cam-chart-bars"></div>
</div>
{% if dets %} {% if dets %}
<div class="grid"> <div class="grid">
{% for d in dets %} {% for d in dets %}
@ -1143,6 +1165,37 @@ body{font-family:system-ui,-apple-system,sans-serif;background:#0f172a;color:#e2
{% endif %} {% endif %}
</div> </div>
<script>
const CAM_ID={{ cam_id | tojson }};
const CN={{ class_names | tojson }};
const INITIAL={{ dets | tojson }};
function renderCamChart(camDets){
const counts={};
CN.forEach(c=>{counts[c]=0});
camDets.forEach(d=>{
const p=d.pred;
if(Object.prototype.hasOwnProperty.call(counts,p)) counts[p]++;
});
const mx=Math.max(...Object.values(counts),1);
let h='';
for(const sp of CN){
const n=counts[sp];
const pct=(n/mx)*100;
h+=`<div class="bar-row"><div class="bar-label">${sp}</div>
<div class="bar-fill" style="width:${pct}%;${n?'':'opacity:.25'}"></div>
<div class="bar-num">${n}</div></div>`;
}
document.getElementById('cam-chart-bars').innerHTML=h;
}
renderCamChart(INITIAL);
setInterval(async()=>{
try{
const r=await fetch('/api/detections');
const all=await r.json();
renderCamChart(all.filter(d=>d.cam===CAM_ID));
}catch(e){}
},3000);
</script>
</body></html>""" </body></html>"""