@iwusong/datav-vue3
Version:
Vue3 large screen data display component library
5 lines (4 loc) • 2.33 kB
JavaScript
"use strict";var C=Object.defineProperty;var f=Object.getOwnPropertySymbols;var N=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var y=(o,e,t)=>e in o?C(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,l=(o,e)=>{for(var t in e||(e={}))N.call(e,t)&&y(o,t,e[t]);if(f)for(var t of f(e))$.call(e,t)&&y(o,t,e[t]);return o};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),k=require("lodash-es"),q=require("../../hooks/useResize.js"),u=require("../../utils/common.js"),P=require("../../utils/decoration.js"),V=require("../../utils/styled.js");require("../../utils/logger.js");const T=["#3f96a5","#3f96a5"];function v(){return l(l({},P.createColorProps()),P.createDurationProps(1.2))}function S(o){return new Array(o.length-1).fill(0).map((e,t)=>u.calcTwoPointDistance(o[t],o[t+1]))}function z(o,e){const t=[[0,e*.2],[o*.18,e*.2],[o*.2,e*.4],[o*.25,e*.4],[o*.27,e*.6],[o*.72,e*.6],[o*.75,e*.4],[o*.8,e*.4],[o*.82,e*.2],[o,e*.2]],s=[[o*.3,e*.8],[o*.7,e*.8]];return{line1Sum:k.sum(S(t)),line2Sum:k.sum(S(s)),line1Point:t.map(r=>r.join(",")).join(" "),line2Point:s.map(r=>r.join(",")).join(" ")}}const M=V.styled.div`
width: 100%;
height: 100%;
`("decoration-5"),_=u.withInstall(n.defineComponent({name:"Decoration5",props:v(),setup(o,{expose:e}){const{autoBindRef:t,refreshLayoutSize:s,domSize:r}=q.useResize();return e({refreshLayoutSize:s}),()=>{const{width:c,height:d}=r,{color:j,duration:m}=o,p=u.mergeColor(T,j),{line1Sum:i,line2Sum:a,line1Point:D,line2Point:b}=z(c,d);return n.createVNode(M,{ref:t},{default:()=>[n.createVNode("svg",{width:c,height:d},[n.createVNode("polyline",{fill:"transparent",stroke:p[0],"stroke-width":"3",points:D},[n.createVNode("animate",{attributeName:"stroke-dasharray",attributeType:"XML",from:`0, ${i/2}, 0, ${i/2}`,to:`0, 0, ${i}, 0`,dur:`${m}s`,begin:"0s",calcMode:"spline",keyTimes:"0;1",keySplines:"0.4,1,0.49,0.98",repeatCount:"indefinite"},null)]),n.createVNode("polyline",{fill:"transparent",stroke:p[1],"stroke-width":"2",points:b},[n.createVNode("animate",{attributeName:"stroke-dasharray",attributeType:"XML",from:`0, ${a/2}, 0, ${a/2}`,to:`0, 0, ${a}, 0`,dur:`${m}s`,begin:"0s",calcMode:"spline",keyTimes:"0;1",keySplines:".4,1,.49,.98",repeatCount:"indefinite"},null)])])]})}}}));exports.Decoration5=_;