const translate=(t,a)=>`translate(${t}, ${a})`,yLabels=["5 ms","10 ms","25 ms","50 ms","75 ms","100 ms","250 ms","500 ms","750 ms","1.0 s","2.5 s","5.0 s","7.5 s","10 s","+Inf"],drawHeatmap=(t,a,r={})=>{void 0===r.margin&&(r.margin={});const e={top:r.margin.top||5,right:r.margin.right||45,bottom:r.margin.bottom||20,left:r.margin.left||27},n=r.height||340,s=r.colorScheme||d3.interpolateViridis,i=Math.min(15,Math.ceil(a.length/20)),o=[],d=[],l=[],p=[],c=[];for(let t=0;t<a.length;t++){const r=a[t];d.push(r.avgTime),l.push({x:t,c:r.clients}),r.skipped&&c.push(t);const e=new Date(r.ts);if(t%i==0){const a=String(e.getHours()).padStart(2,"0"),r=String(e.getMinutes()).padStart(2,"0");o.push({x:t,t:`${a}:${r}`})}for(let a=0;a<15;a++){const e="number"==typeof r.buckets[a]?r.buckets[a]:0;p.push({x:t,y:a,freq:e})}}const m=t.offsetWidth,g=d3.scaleSequential(s).domain([0,1]),h=d3.create("svg").attr("viewBox",[0,0,m,n]),f=r.bgColor||d3.color(g(0)).darker(.35),k=d3.scaleBand().domain(d3.range(a.length)).range([e.left,m-e.right]),u=d3.axisBottom(k).tickValues(o.map((t=>t.x))).tickFormat(((t,a)=>o[a].t));h.append("g").attr("id","timeAxis").attr("transform",translate(0,n-e.bottom)).attr("id","x-axis").attr("class","axis").call(u);const x=d3.scaleBand().domain(d3.range(yLabels.length)).range([n-e.bottom,e.top]),b=d3.axisRight(x).tickFormat(((t,a)=>`${yLabels[a]}`));h.append("g").attr("id","tickBucketsAxis").attr("class","axis").attr("transform",translate(m-e.right-3,0)).call(b),h.append("rect").attr("x",e.left).attr("y",e.top).attr("width",m-e.right-e.left).attr("height",n-e.top-e.bottom).attr("fill",f).attr("stroke",f);const y=h.append("g").attr("id","heatmap").selectAll("rect").data(p).enter().append("rect").filter((t=>"number"==typeof t.freq&&t.freq>0)).attr("x",((t,a)=>k(t.x))).attr("y",((t,a)=>x(t.y))).attr("width",k.bandwidth()).attr("height",x.bandwidth()).attr("fill",(t=>g(t.freq))).attr("stroke",(t=>g(t.freq))),w=Math.round(x.bandwidth()/2),L=d3.max(l.map((t=>t.c))),q=d3.scaleLinear().domain([0,L]).range([n-e.bottom-w,e.top+w]),S=d3.axisLeft(q).tickFormat((t=>t)).tickValues(L>7?null:d3.range(L+1));h.append("g").attr("id","clientAxis").attr("class","axis").attr("transform",translate(e.left-1.5,0)).call(S);const A=d3.line().defined((t=>!isNaN(t.c))).x((t=>k(t.x)+2)).y((t=>q(t.c))),B=h.append("g").attr("id","clientsLine");return B.append("path").datum(l).attr("fill","none").attr("stroke","black").attr("stroke-width",6).attr("stroke-linejoin","round").attr("stroke-linecap","round").attr("d",A),B.append("path").datum(l).attr("fill","none").attr("stroke"," rgb(204, 203, 203)").attr("stroke-width",2).attr("stroke-linejoin","round").attr("stroke-linecap","round").attr("d",A),h.append("g").attr("id","skipLines").selectAll(".link").data(c).enter().append("line").style("stroke","gold").attr("stroke-dasharray",6).attr("x1",(t=>k(t))).attr("x2",(t=>k(t))).attr("y1",n-e.bottom).attr("y2",e.top),t.innerHTML="",t.append(h.node()),y._groups[0].length+1};export{drawHeatmap};