OcttKB/Wiki-OcttKB/plugins/echarts-addons/$__addon_clock.js

7 lines
2.6 KiB
JavaScript

/*\
title: $:/addon/clock.js
module-type: echarts-component
type: application/javascript
description: clock with echarts
\*/
const e={onUpdate(e){option={title:{text:"",top:"top",left:"center"},series:[{name:"hour",type:"gauge",startAngle:90,endAngle:-270,min:0,max:12,splitNumber:12,clockwise:!0,axisLine:{lineStyle:{width:8,color:[[1,"rgba(0,0,0,0.7)"]],shadowColor:"rgba(0, 0, 0, 0.5)",shadowBlur:15}},splitLine:{lineStyle:{shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:3,shadowOffsetX:1,shadowOffsetY:2}},axisLabel:{fontSize:16,distance:15,formatter:function(e){return 0===e?"":e+""}},pointer:{icon:"path://M2.9,0.7L2.9,0.7c1.4,0,2.6,1.2,2.6,2.6v115c0,1.4-1.2,2.6-2.6,2.6l0,0c-1.4,0-2.6-1.2-2.6-2.6V3.3C0.3,1.9,1.4,0.7,2.9,0.7z",width:6,length:"55%",offsetCenter:[0,"8%"],itemStyle:{color:"#C0911F",shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:8,shadowOffsetX:2,shadowOffsetY:4}},detail:{show:!1},title:{offsetCenter:[0,"30%"]},data:[{value:0}]},{name:"minute",type:"gauge",startAngle:90,endAngle:-270,min:0,max:60,clockwise:!0,axisLine:{show:!1},splitLine:{show:!1},axisTick:{show:!1},axisLabel:{show:!1},pointer:{icon:"path://M2.9,0.7L2.9,0.7c1.4,0,2.6,1.2,2.6,2.6v115c0,1.4-1.2,2.6-2.6,2.6l0,0c-1.4,0-2.6-1.2-2.6-2.6V3.3C0.3,1.9,1.4,0.7,2.9,0.7z",width:4,length:"70%",offsetCenter:[0,"8%"],itemStyle:{color:"#C0911F",shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:8,shadowOffsetX:2,shadowOffsetY:4}},anchor:{show:!0,size:20,showAbove:!1,itemStyle:{borderWidth:8,borderColor:"#C0911F",shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:8,shadowOffsetX:2,shadowOffsetY:4}},detail:{show:!1},title:{offsetCenter:["0%","-40%"]},data:[{value:0}]},{name:"second",type:"gauge",startAngle:90,endAngle:-270,min:0,max:60,animationEasingUpdate:"bounceOut",clockwise:!0,axisLine:{show:!1},splitLine:{show:!1},axisTick:{show:!1},axisLabel:{show:!1},pointer:{icon:"path://M2.9,0.7L2.9,0.7c1.4,0,2.6,1.2,2.6,2.6v115c0,1.4-1.2,2.6-2.6,2.6l0,0c-1.4,0-2.6-1.2-2.6-2.6V3.3C0.3,1.9,1.4,0.7,2.9,0.7z",width:2,length:"85%",offsetCenter:[0,"8%"],itemStyle:{color:"#C0911F",shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:8,shadowOffsetX:2,shadowOffsetY:4}},anchor:{show:!0,size:15,showAbove:!0,itemStyle:{color:"#C0911F",shadowColor:"rgba(0, 0, 0, 0.3)",shadowBlur:8,shadowOffsetX:2,shadowOffsetY:4}},detail:{show:!1},title:{offsetCenter:["0%","-40%"]},data:[{value:0}]}]},setInterval((function(){var t=new Date,o=t.getSeconds(),a=t.getMinutes()+o/60,s=t.getHours()%12+a/60;option.animationDurationUpdate=300,e.setOption({series:[{name:"hour",animation:0!==s,data:[{value:s}]},{name:"minute",animation:0!==a,data:[{value:a}]},{animation:0!==o,name:"second",data:[{value:o}]}]})}),1e3),e.setOption(option)},shouldUpdate:()=>!1};module.exports=e;