mirror of
https://github.com/s00500/ESPUI.git
synced 2026-02-05 17:02:41 +00:00
1 line
3.3 KiB
JavaScript
1 line
3.3 KiB
JavaScript
function lineGraph(e,t,n){const o=620,i=420,s=40,a=30;function r(e,t,n,s){var o=t-e,i=s-n,a=i/o,r=o/i;return{toCoord:function(t){return(t-e)*a+n},toData:function(t){return(t-n)*r+e}}}function c(t,n){var r,c,l,d,h,m,p,g,u=document.createElementNS("http://www.w3.org/2000/svg","g"),f=document.createElementNS("http://www.w3.org/2000/svg","path");if(u.setAttribute("class",t+"-axis"),l=s,h=o-s,d=i-s,p=s,t==="x"){f.setAttribute("d","M "+l+" "+d+" L "+h+" "+d);for(r=l;r<=h;r++)(r-l)%(a*3)===0&&r!==l&&(c=document.createElementNS("http://www.w3.org/2000/svg","text"),c.innerHTML=new Date(Math.floor(n(r))).toLocaleTimeString(),c.setAttribute("x",r),c.setAttribute("y",d),c.setAttribute("dy","1em"),u.appendChild(c))}else{f.setAttribute("d","M "+l+" "+d+" L "+l+" "+p);for(r=p;r<=d;r++)(r-d)%a===0&&r!==d&&(m=document.createElementNS("http://www.w3.org/2000/svg","g"),g=document.createElementNS("http://www.w3.org/2000/svg","path"),c=document.createElementNS("http://www.w3.org/2000/svg","text"),c.innerHTML=Math.floor(n(r)),c.setAttribute("x",l),c.setAttribute("y",r),c.setAttribute("dx","-.5em"),c.setAttribute("dy",".3em"),g.setAttribute("d","M "+l+" "+r+" L "+h+" "+r),m.appendChild(g),m.appendChild(c),u.appendChild(m))}u.appendChild(f),e.appendChild(u)}function l(t,n,s,o){var a,i=document.createElementNS("http://www.w3.org/2000/svg","path");if(t.reset(),n.reset(),!t.hasNext()||!n.hasNext())return;for(a="M "+s(t.next())+" "+o(n.next());t.hasNext()&&n.hasNext();)a+=" L "+s(t.next())+" "+o(n.next());i.setAttribute("class","series"),i.setAttribute("d",a),e.appendChild(i)}function d(t,n,s,o){var i,a,c,l,d,u,r=document.createElementNS("http://www.w3.org/2000/svg","g");if(r.setAttribute("class","data-points"),t.reset(),n.reset(),!t.hasNext()||!n.hasNext())return;for(;t.hasNext()&&n.hasNext();)c=t.next(),l=s(c),d=n.next(),u=o(d),a=document.createElementNS("http://www.w3.org/2000/svg","circle"),a.setAttribute("cx",l),a.setAttribute("cy",u),a.setAttribute("r","4"),i=document.createElementNS("http://www.w3.org/2000/svg","text"),i.innerHTML=new Date(Math.floor(c)).toLocaleTimeString()+" / "+Math.floor(d),i.setAttribute("x",l),i.setAttribute("y",u),i.setAttribute("dx","1em"),i.setAttribute("dy","-.7em"),r.appendChild(a),r.appendChild(i);e.appendChild(r)}xTransform=r(t.min(),t.max(),0+s,o-s),yTransform=r(n.min(),n.max(),i-s,0+s),c("x",xTransform.toData),c("y",yTransform.toData),l(t,n,xTransform.toCoord,yTransform.toCoord),d(t,n,xTransform.toCoord,yTransform.toCoord)}function renderGraphSvg(e,t){for(var n,s=document.getElementById(t);s.hasChildNodes();)s.removeChild(s.lastChild);n=document.createElementNS("http://www.w3.org/2000/svg","svg"),n.setAttribute("viewBox","0 0 640 440"),n.setAttribute("preserveAspectRatio","xMidYMid meet"),lineGraph(n,function(e,t,n){var s=0;return{hasNext:function(){return s<e.length},next:function(){return e[s++].x},reset:function(){s=0},min:function(){return t},max:function(){return n}}}(e,Math.min.apply(Math,e.map(function(e){return e.x})),Math.max.apply(Math,e.map(function(e){return e.x}))),function(e,t,n){var s=0;return{hasNext:function(){return s<e.length},next:function(){return e[s++].y},reset:function(){s=0},min:function(){return t},max:function(){return n}}}(e,Math.min.apply(Math,e.map(function(e){return e.y})),Math.max.apply(Math,e.map(function(e){return e.y})))),s.appendChild(n)} |