Spaces:
Running
Running
File size: 1,902 Bytes
9124872 5422425 9124872 5422425 9124872 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Citation chart</title>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.4/dist/chart.umd.min.js"></script>
<style>
html,body{ margin:0; height:100%; font-family:'Inter',system-ui,sans-serif; background:#fff; }
#box{ position:absolute; inset:0; padding:10px; box-sizing:border-box; }
</style>
</head>
<body>
<div id="box"><canvas id="chart"></canvas></div>
<script>
const qs = new URLSearchParams(location.search);
const p = qs.get('p') || 'total';
const days = qs.get('days');
function filterDays(dates, vals){
const n = parseInt(days); if(!n) return {dates, vals};
const cut = new Date(); cut.setDate(cut.getDate()-n);
const d2=[], v2=[]; dates.forEach((x,i)=>{ if(new Date(x+'T00:00:00')>=cut){ d2.push(x); v2.push(vals[i]); } });
return {dates:d2, vals:v2};
}
fetch('/api/data').then(r=>r.json()).then(d=>{
let vals, title;
if(p === 'total'){ vals = d.history.total; title = (d.author.name? d.author.name+' — ':'') + 'Total citations'; }
else{ vals = d.history.by_paper[p] || [];
const pp = d.papers.find(x=>x.paper_id===p);
title = pp ? (pp.title.length>60? pp.title.slice(0,60)+'…' : pp.title) : 'Citations'; }
const f = filterDays(d.history.dates, vals); const dates = f.dates; vals = f.vals;
new Chart(document.getElementById('chart'), { type:'line',
data:{ labels:dates, datasets:[{ label:title, data:vals, borderColor:'#4f46e5',
backgroundColor:'rgba(79,70,229,.08)', fill:true, tension:.25, pointRadius:3, borderWidth:2 }]},
options:{ responsive:true, maintainAspectRatio:false,
plugins:{ legend:{display:false}, title:{display:true, text:title, font:{size:14}} },
scales:{ y:{ beginAtZero:true, grid:{color:'#f1f5f9'} }, x:{ grid:{display:false} } } } });
});
</script>
</body>
</html>
|