@lichking-kit/charts 0.1.0

package/README.md

@@ -0,0 +1,3 @@
+# @lichking-kit/charts
+
+Local compiled chart components package.

package/index.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export type RealTimeCurveProps = { wellName?: string; data?: any[]; height?: number | string };
+export type WellStructControlProps = { name?: string; jsjgData?: any[]; gjData?: any[]; dcfcData?: any[] };
+export type TrajectoryControlProps = { name?: string; designData?: any[]; actualData?: any[]; bdData?: any[]; azimuth?: number; type?: string };
+export const RealTimeCurve: React.FC<RealTimeCurveProps>;
+export const WellStructControl: React.FC<WellStructControlProps>;
+export const TrajectoryControl: React.FC<TrajectoryControlProps>;

package/index.js

@@ -0,0 +1,2 @@
+"use client";
+export{default as RealTimeCurve}from"./sections/realtime/components/realtime-curve.js";export{default as WellStructControl}from"./sections/general/wellstruct/wellstruct-control.js";export{default as TrajectoryControl}from"./sections/general/trajectory/trajectory-control.js";

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@lichking-kit/charts",
+  "version": "0.1.0",
+  "private": false,
+  "type": "module",
+  "main": "./index.js",
+  "module": "./index.js",
+  "sideEffects": false,
+  "files": [
+    "**/*.js",
+    "**/*.d.ts",
+    "package.json",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "@emotion/react": "^11.0.0",
+    "@emotion/styled": "^11.0.0",
+    "@mui/material": "^5.0.0",
+    "d3": "^7.0.0",
+    "date-fns": "^2.0.0",
+    "next": "^13.0.0",
+    "react": "^18.0.0",
+    "react-cool-dimensions": "^3.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

package/sections/general/trajectory/trajectory-control.js

@@ -0,0 +1,2 @@
+"use client";
+import*as t from"d3";import e,{useRef as a,useEffect as r,useCallback as i}from"react";import{useTheme as n}from"@mui/material/styles";import{Regulate as l}from"../../../utils/graphic.js";export default d=>{const{name:o,designData:s,actualData:h,bdData:c,azimuth:p,type:x}=d,y=n(),m="light"===y.palette.mode,[g,w]=e.useState({minX:-10,minY:-10,maxX:10,maxY:10}),f=a(null),k=a(null);r(()=>{let e=10,a=-10,r=10,i=-10;if(h){let n=t.min(h,t=>"SPTYT"===x?t.e_coordinate:t.closed_displacement);a=a<n?a:n,n=t.max(h,t=>"SPTYT"===x?t.e_coordinate:t.closed_displacement),e=e>n?e:n,n=t.min(h,t=>"SPTYT"===x?t.n_coordinate:t.vertical_depth),i=i<n?i:n,n=t.max(h,t=>"SPTYT"===x?t.n_coordinate:t.vertical_depth),r=r>n?r:n}if(s){let n=t.min(s,t=>"SPTYT"===x?t.e_coordinate:t.closed_displacement);a=a<n?a:n,n=t.max(s,t=>"SPTYT"===x?t.e_coordinate:t.closed_displacement),e=e>n?e:n,n=t.min(s,t=>"SPTYT"===x?t.n_coordinate:t.vertical_depth),i=i<n?i:n,n=t.max(s,t=>"SPTYT"===x?t.n_coordinate:t.vertical_depth),r=r>n?r:n}w({minX:a,maxX:e,minY:i,maxY:r})},[s,h,x]);const u=i(()=>{var e,a;const r=null===(e=f.current)||void 0===e?void 0:e.clientWidth,i=null===(a=f.current)||void 0===a?void 0:a.clientHeight;if(!r||!i||!k.current)return;k.current.innerHTML="";const n=0,d=0,w=50,u=50,T=50,Y=r-d-0,_=i-n-0,P=d+T,S=n+w,v={width:Y-T-50,height:_-w-u},M=m?"#000000":"#FFFFFF",z=y.palette.background.default,F=y.palette.text.primary,j=(y.palette.background.neutral,y.palette.background.paper),A=m?"#CC0033DD":"#FF6666DD",D=m?"#0000CCDD":"#99CCFFDD",C=(g.maxX-g.minX)/(g.maxY-g.minY)/(v.width/v.height);let{minX:X}=g,{maxX:b}=g,{minY:E}=g,{maxY:L}=g;if(C>1){const t=(L-E)*C-(L-E);E-=t/2,L+=t/2}else if(C<1){const t=(b-X)/C-(b-X);X-=t/2,b+=t/2}t.select(f.current).attr("width",r).attr("height",i).style("background-color","transparent");const Z=t.select(k.current).attr("width",Y).attr("height",_).attr("transform",`translate(${P},${S})`);Z.append("rect").attr("x",T).attr("y",w).attr("width",Y).attr("height",_).attr("fill",z).style("stroke","none").style("stroke-width",1);let H="南北位移";"SPTYT"!==x&&"PMZKT"!==x||(H="垂深");let I="东西位移";"CZTYT"===x&&(I="位移"),"PMZKT"===x&&(I="水平投影长度");const K=Z.append("text").attr("x",-T/2).attr("y",v.height/2).style("font-size",14).style("fill",F).style("text-anchor","middle");K.selectAll("tspan").data(H).enter().append("tspan").attr("x",K.attr("x")).attr("dy","1em").text(t=>t),Z.append("text").text(I).attr("x",v.width/2).attr("y",v.height+u/2).style("font-size",14).style("fill",F).style("text-anchor","middle"),Z.append("text").text(o||"").attr("x",v.width/2).attr("y",-20).style("font-size",20).style("fill",F).style("text-anchor","middle");const $=50,B=t.scaleLinear().domain([X,b]).range([50,v.width-$]);let W=t.scaleLinear().domain([E,L]).range([50,v.height-$]);"SPTYT"===x&&(W=t.scaleLinear().domain([E,L]).range([v.height-$,50])),Z.append("clipPath").attr("id","border").append("rect").attr("x",0).attr("y",0).attr("width",v.width).attr("height",v.height).attr("fill",j);Z.append("g");const q=Z.append("g").attr("viewBox",[0,0,v.width,v.height]).attr("clip-path","url(#border)");q.append("rect").attr("x",0).attr("y",0).attr("width",v.width).attr("height",v.height).attr("stroke",M).attr("stroke-width",1).attr("fill",j);const G=q.append("g").attr("x",0).attr("y",0).attr("width",v.width).attr("height",v.height),J=t.zoom().extent([[0,0],[v.width,v.height]]).scaleExtent([1,20]).translateExtent([[0,0],[v.width,v.height]]).on("zoom",function(t){G.attr("transform",t.transform)});q.call(J);const N=t.line().x(t=>{if("SPTYT"===x)return B(t.e_coordinate);if("CZTYT"===x){const e=null!=p?p:0,a=Math.cos((t.closed_azimuth-e)*Math.PI/180)*t.closed_displacement;return B(a)}return B(t.closed_displacement)}).y(t=>W("SPTYT"===x?t.n_coordinate:t.vertical_depth)),O=l(X,b+500,Math.trunc(v.width/50)),Q=l(E,L+500,Math.trunc(v.height/50)),R=t.range(O.Min,O.Max,O.Step),U=t.range(Q.Min,Q.Max,Q.Step),V=t.range(O.Min,O.Max,O.Step/5),tt=t.range(Q.Min,Q.Max,Q.Step/5);G.append("g").selectAll("line").data(R).join("line").attr("x1",t=>B(t)).attr("y1",0).attr("x2",t=>B(t)).attr("y2",v.height).attr("stroke",M).attr("stroke-width",.2).attr("stroke-dasharray","1 1"),G.append("g").selectAll("line").data(R).join("line").attr("x1",t=>B(t)).attr("y1",t=>W(0)).attr("x2",t=>B(t)).attr("y2",t=>W(0)-5).attr("stroke",M).attr("stroke-width",1),G.append("g").selectAll("text").data(R).join("text").text(t=>t).attr("x",t=>B(t)).attr("y",t=>W(0)+10).style("font-size",10).style("text-anchor","middle").style("fill",F),G.append("g").selectAll("line").data(V).join("line").attr("x1",t=>B(t)).attr("y1",t=>W(0)).attr("x2",t=>B(t)).attr("y2",t=>W(0)-2).attr("stroke",M).attr("stroke-width",1),G.append("g").selectAll("line").data(U).join("line").attr("y1",t=>W(t)).attr("x1",0).attr("y2",t=>W(t)).attr("x2",v.width).attr("stroke",M).attr("stroke-width",.2).attr("stroke-dasharray","1 1"),G.append("g").selectAll("line").data(U).join("line").attr("x1",t=>B(0)).attr("y1",t=>W(t)).attr("x2",t=>B(0)+5).attr("y2",t=>W(t)).attr("stroke",M).attr("stroke-width",1),G.append("g").selectAll("text").data(U).join("text").text(t=>t).attr("x",t=>B(0)-2).attr("y",t=>W(t)+5).style("font-size",10).style("fill",F).style("text-anchor","end"),G.append("g").selectAll("line").data(tt).join("line").attr("x1",t=>B(0)).attr("y1",t=>W(t)).attr("x2",t=>B(0)+2).attr("y2",t=>W(t)).attr("stroke",M).attr("stroke-width",1),G.append("line").attr("x1",B(0)).attr("y1",0).attr("x2",B(0)).attr("y2",v.height).attr("stroke",M).attr("stroke-width",1),G.append("line").attr("y1",W(0)).attr("x1",0).attr("y2",W(0)).attr("x2",v.width).attr("stroke",M).attr("stroke-width",1);G.append("path").datum(s||[]).attr("d",N).attr("fill","none").attr("stroke",A).attr("stroke-width",2),G.append("path").datum(h||[]).attr("d",N).attr("fill","none").attr("stroke",D).attr("stroke-width",2);if("SPTYT"===x||"CZTYT"===x){const t=t=>{if("SPTYT"===x)return B(t.e_coordinate);const e=null!=p?p:0,a=Math.cos((t.closed_azimuth-e)*Math.PI/180)*t.closedarea;return B(a)},e=t=>W("SPTYT"===x?t.n_coordinate:t.vertical_depth);G.append("g").selectAll("circle").data(c||[]).join("circle").attr("cx",e=>t(e)).attr("cy",t=>e(t)).attr("r",3).attr("fill","#FF0000").attr("stroke","#00FF00").attr("stroke-width",1),G.append("g").selectAll("text").data(c||[]).join("text").text(t=>t.targetname).attr("x",e=>t(e)+60).attr("y",t=>e(t)+30).style("font-size",10).style("fill",F).style("text-anchor","start"),G.append("g").selectAll("line").data(c||[]).join("line").text(t=>t.targetname).attr("x1",e=>t(e)).attr("y1",t=>e(t)).attr("x2",e=>t(e)+60).attr("y2",t=>e(t)+30).attr("stroke",M).attr("stroke-width",.5).attr("stroke-dasharray","1 1")}const et=q.append("g");et.append("rect").attr("x",v.width-150).attr("y",0).attr("width",150).attr("height",80).attr("stroke",M).attr("stroke-width",1).attr("fill",z).attr("opacity",.6),et.append("line").attr("x1",v.width-140).attr("y1",20).attr("x2",v.width-65).attr("y2",20).attr("stroke",A).attr("stroke-width",3),et.append("text").text("设计").attr("x",v.width-60).attr("y",25).attr("fill",M).style("font-size",18).style("text-anchor","start"),et.append("line").attr("x1",v.width-140).attr("y1",50).attr("x2",v.width-65).attr("y2",50).attr("stroke",D).attr("stroke-width",3),et.append("text").text("实际").attr("x",v.width-60).attr("y",55).attr("fill",M).style("font-size",18).style("text-anchor","start")},[h,p,c,s,m,o,y,x,g]);return r(()=>{u()},[g,y,u]),r(()=>(window.addEventListener("resize",u),()=>{window.removeEventListener("resize",u)}),[u]),e.createElement("div",{style:{width:"100%",height:"100%"}},e.createElement("svg",{ref:f,style:{width:"100%",height:"100%"}},e.createElement("g",{ref:k})))};

package/sections/general/wellstruct/wellstruct-control.js

@@ -0,0 +1,2 @@
+"use client";
+import*as t from"d3";import e from"react-cool-dimensions";import a,{useRef as r,useMemo as l,useEffect as p,useCallback as o}from"react";import{Box as n}from"@mui/material";import{useTheme as i}from"@mui/material/styles";import{CalExtendPath as s}from"../../../utils/graphic.js";export default d=>{const{name:h,jsjgData:y,gjData:c,dcfcData:x,...f}=d,g=i(),m=r(null),{observe:u,width:$,height:w}=e(),k="light"===g.palette.mode,P=l(()=>({top:30,right:5,bottom:5,left:5}),[]),[C,A,v,_]=l(()=>{const e=$-P.left-P.right,a=w-P.top-P.bottom,r={x:P.left,y:P.top},l=e,p=a,o=r.x+60+120;let n=1e3,i=1e3,s=1e3;c&&(n=t.max(c,t=>t.vertical_depth),i=t.max(c,t=>t.well_depth),s=t.max(c,t=>t.closed_displacement),n+=n/10,s+=s/10);let d=t.scaleLinear().domain([0,n]).range([o,o+p]);s/(l-60-120)>n/p&&(d=t.scaleLinear().domain([0,s]).range([o,o+(l-60-120)]));return[d,t.scaleLinear().domain([0,n]).range([r.y,r.y+p]),n,i]},[$,P,w,c]),G=o(()=>{if($<=0||w<=0||!m.current)return;m.current.innerHTML="";const e=$-P.left-P.right,a=w-P.top-P.bottom,r={x:P.left,y:P.top},l={width:e,height:a},p=60,o=g.palette.background.default,n=k?g.palette.primary.darker:g.palette.primary.lighter,i=t.interpolate("#996633DD","#000033DD"),d=t.scaleLinear().domain([0,null==x?void 0:x.length]).range([0,1]),f=t.line().x(t=>t.x).y(t=>t.y).curve(t.curveBasis),u=t.select(m.current),G=u.append("defs");G.append("pattern").attr("id","SNFG").attr("patternUnits","userSpaceOnUse").attr("x",0).attr("y",0).attr("width",50).attr("height",50).append("svg:image").attr("xlink:href","/assets/images/drilling/水泥.jpg").attr("x",0).attr("y",0).attr("width",50).attr("height",50);const L=u.append("g");L.append("rect").attr("x",P.left).attr("y",P.top).attr("width",e).attr("height",a).attr("fill",o).style("stroke","none").style("stroke-width",1),L.append("text").text("垂深").attr("x",r.x+30).attr("y",r.y-10).style("font-size",15).style("text-anchor","middle").attr("fill",n);const b=parseInt((v/1e3).toString(),10),j=t.range(0,v,b>0?100*b:100),S=t.range(0,v,b>0?50*b:50),z=t.range(0,v,b>0?10*b:10);if(L.append("g").selectAll("line").data(z).join("line").attr("x1",r.x+p).attr("y1",t=>A(t)).attr("x2",r.x+p-5).attr("y2",t=>A(t)).attr("stroke",n).attr("stroke-width",1),L.append("g").selectAll("line").data(S).join("line").attr("x1",r.x+p).attr("y1",t=>A(t)).attr("x2",r.x+p-10).attr("y2",t=>A(t)).attr("stroke",n).attr("stroke-width",1.2),L.append("g").selectAll("line").data(j).join("line").attr("x1",r.x+p).attr("y1",t=>A(t)).attr("x2",r.x+p-20).attr("y2",t=>A(t)).attr("stroke",n).attr("stroke-width",1.5),L.append("g").selectAll("text").data(j).join("text").text(t=>t).attr("x",r.x+p-25).attr("y",t=>A(t)).attr("fill",n).style("font-size",12).style("text-anchor","end").style("dominant-baseline","middle"),L.append("rect").attr("x",r.x+p).attr("y",r.y).attr("width",l.width-p).attr("height",l.height).attr("stroke",n).attr("stroke-width",1).attr("fill","none"),null!=x){u.append("g").append("g").selectAll("rect").data(x).join("rect").attr("x",r.x+p).attr("y",(t,e)=>A(0===e?0:x[e-1].vertical_depth)).attr("width",l.width-p).attr("height",(t,e)=>0===e?A(t.vertical_depth):A(t.vertical_depth)-A(x[e-1].vertical_depth)).attr("opacity",.8).attr("fill",(t,e)=>i(d(e)))}const D=15,T=15;if(u.append("rect").attr("x",r.x+l.width-200).attr("y",r.y).attr("width",200).attr("height",l.height).attr("stroke","none").attr("stroke-width",1).attr("fill",g.palette.background.paper),u.append("text").text("图例").attr("x",r.x+l.width-200+75).attr("y",r.y+20).attr("fill",g.palette.text.primary).style("font-size",25).style("text-anchor","middle").style("dominant-baseline","middle"),u.append("rect").attr("x",r.x+l.width-200+5).attr("y",r.y+50).attr("width",50).attr("height",D).attr("stroke",k?g.palette.primary.darker:g.palette.primary.lighter).attr("stroke-width",1).attr("fill",`url(#${h}TGGradient)`),u.append("text").text("套管").attr("x",r.x+l.width-200+5+50+10).attr("y",r.y+50+7.5).attr("fill",g.palette.text.primary).style("font-size",T).style("text-anchor","start").style("dominant-baseline","middle"),u.append("rect").attr("x",r.x+l.width-200+5).attr("y",r.y+50+D+10).attr("width",50).attr("height",D).attr("stroke",k?g.palette.primary.darker:g.palette.primary.lighter).attr("stroke-width",1).attr("fill","url(#SNFG)"),u.append("text").text("水泥返高").attr("x",r.x+l.width-200+5+50+10).attr("y",r.y+50+D+10+7.5).attr("fill",g.palette.text.primary).style("font-size",T).style("text-anchor","start").style("dominant-baseline","middle"),null!=x&&(u.append("g").selectAll("rect").data(x).join("rect").attr("x",r.x+l.width-200+5).attr("y",(t,e)=>r.y+50+25*(e+2)).attr("width",50).attr("height",D).attr("opacity",.8).attr("fill",(t,e)=>i(d(e))).style("stroke",k?g.palette.primary.darker:g.palette.primary.lighter).style("stroke-width",1),u.append("g").selectAll("text").data(x).join("text").text((t,e)=>t.layer_lith).attr("x",r.x+l.width-200+5+50+10).attr("y",(t,e)=>r.y+50+25*(e+2)+7.5).attr("fill",g.palette.text.primary).style("font-size",T).style("text-anchor","start").style("dominant-baseline","middle")),y&&c){const e=[];c.forEach(t=>{null!=t.vertical_depth&&null!=t.closed_displacement&&e.push({x:C(t.closed_displacement),y:A(t.vertical_depth)})});const a=u.append("g"),r=a.append("path").attr("d",f(e)).style("fill","none").node(),l=t.line().x(t=>t.x).y(t=>t.y);if(r&&e.length>1){const t=12,e=10,p=r.getTotalLength()/_;let o=0;for(let n=0;n<y.length;n+=1){const i=y[n].well_depth,d=y[n].cement_top,h=y[n].casing_top_depth||0,c=y[n].casing_shoe_depth||0,x=y[n].bit_outsize||100,f=y[n].casing_outsize||100;if(null!=i){const t=[];for(let a=o;a<=i;a+=e){let l=r.getPointAtLength(a*p);t.push({x:l.x,y:l.y}),a<i&&a+e>i&&(l=r.getPointAtLength(i*p),t.push({x:l.x,y:l.y}))}o=i;const l=s(t,C(x/2)-C(0)),d=[];for(let t=0;t<l.leftPath.length-1;t+=1){const e=l.leftPath[t],a=l.leftPath[t+1],r=l.rightPath[t+1],p=l.rightPath[t];d.push({pt1:e,pt2:a,pt3:r,pt4:p});const o=G.append("linearGradient").attr("id",`linearColor-ZT-${n}-${t}`).attr("gradientUnits","userSpaceOnUse").attr("x1",r.x).attr("y1",r.y).attr("x2",a.x).attr("y2",a.y);o.append("stop").attr("offset",0).style("stop-color",g.palette.primary.darker),o.append("stop").attr("offset",.3).style("stop-color",g.palette.primary.main),o.append("stop").attr("offset",.5).style("stop-color",g.palette.primary.lighter),o.append("stop").attr("offset",.7).style("stop-color",g.palette.primary.main),o.append("stop").attr("offset",1).style("stop-color",g.palette.primary.darker)}a.selectAll(".polygon").data(d).enter().append("polygon").attr("points",(t,e)=>{let a=`${t.pt1.x},${t.pt1.y},`;return a=`${a+t.pt2.x},${t.pt2.y},`,a=`${a+t.pt3.x},${t.pt3.y},`,a=`${a+t.pt4.x},${t.pt4.y}`,a}).style("fill",(t,e)=>`url(#linearColor-ZT-${n}-${e})`).attr("stroke",(t,e)=>`url(#linearColor-ZT-${n}-${e})`).attr("stroke-width",1)}if(null!=d&&null!=i){const t=[];for(let a=d;a<=i;a+=e){let l=r.getPointAtLength(a*p);t.push({x:l.x,y:l.y}),a<i&&a+e>i&&(l=r.getPointAtLength(i*p),t.push({x:l.x,y:l.y}))}const o=s(t,C(x/2)-C(0)),h=s(t,C(f/2)-C(0)),y=[];for(let t=0;t<h.leftPath.length-1;t+=1){const e=h.leftPath[t],a=h.leftPath[t+1],r=h.rightPath[t+1],l=h.rightPath[t];y.push({pt1:e,pt2:a,pt3:r,pt4:l});const p=G.append("linearGradient").attr("id",`linearColor-SNFG-${n}-${t}`).attr("gradientUnits","userSpaceOnUse").attr("x1",r.x).attr("y1",r.y).attr("x2",a.x).attr("y2",a.y);p.append("stop").attr("offset",0).style("stop-color","#999966"),p.append("stop").attr("offset",.3).style("stop-color","#99CCCC"),p.append("stop").attr("offset",.5).style("stop-color","#CCCCCC"),p.append("stop").attr("offset",.7).style("stop-color","#99CCCC"),p.append("stop").attr("offset",1).style("stop-color","#999966")}a.selectAll(".polygon").data(y).enter().append("polygon").attr("points",(t,e)=>{let a=`${t.pt1.x},${t.pt1.y},`;return a=`${a+t.pt2.x},${t.pt2.y},`,a=`${a+t.pt3.x},${t.pt3.y},`,a=`${a+t.pt4.x},${t.pt4.y}`,a}).style("fill",(t,e)=>`url(#linearColor-SNFG-${n}-${e})`).attr("stroke",(t,e)=>`url(#linearColor-SNFG-${n}-${e})`).attr("stroke-width",1);const c=o.leftPath.concat(h.leftPath.reverse()),g=o.rightPath.concat(h.rightPath.reverse());a.append("path").datum(c).attr("fill","url(#SNFG)").attr("d",l),a.append("path").datum(g).attr("fill","url(#SNFG)").attr("d",l)}if(c>h){const o=[];for(let t=h;t<=c;t+=e){let a=r.getPointAtLength(t*p);o.push({x:a.x,y:a.y}),t<c&&t+e>c&&(a=r.getPointAtLength(c*p),o.push({x:a.x,y:a.y}))}const i=s(o,C(f/2)-C(0)),d=s(o,C(f/2-t)-C(0)),y=[];for(let t=0;t<i.leftPath.length-1;t+=1){const e=i.leftPath[t],a=i.leftPath[t+1],r=i.rightPath[t+1],l=i.rightPath[t];y.push({pt1:e,pt2:a,pt3:r,pt4:l});const p=G.append("linearGradient").attr("id",`linearColor-TG-${n}-${t}`).attr("gradientUnits","userSpaceOnUse").attr("x1",r.x).attr("y1",r.y).attr("x2",a.x).attr("y2",a.y);p.append("stop").attr("offset",0).style("stop-color","#696969"),p.append("stop").attr("offset",.3).style("stop-color","#A9A9A9"),p.append("stop").attr("offset",.5).style("stop-color","#D3D3D3"),p.append("stop").attr("offset",.7).style("stop-color","#A9A9A9"),p.append("stop").attr("offset",1).style("stop-color","#696969")}a.selectAll(".polygon").data(y).enter().append("polygon").attr("points",(t,e)=>{let a=`${t.pt1.x},${t.pt1.y},`;return a=`${a+t.pt2.x},${t.pt2.y},`,a=`${a+t.pt3.x},${t.pt3.y},`,a=`${a+t.pt4.x},${t.pt4.y}`,a}).style("fill",(t,e)=>`url(#linearColor-TG-${n}-${e})`).attr("stroke",(t,e)=>`url(#linearColor-TG-${n}-${e})`).attr("stroke-width",1);const x=i.leftPath.concat(d.leftPath.reverse()),g=i.rightPath.concat(d.rightPath.reverse());a.append("path").datum(x).attr("fill","#080808").attr("d",l),a.append("path").datum(g).attr("fill","#080808").attr("d",l)}}}}},[C,A,x,c,w,k,y,P,_,v,h,g,$]);return p(()=>(G(),window.addEventListener("resize",G),()=>{window.removeEventListener("resize",G)}),[y,c,g,G]),a.createElement(n,{component:"div",ref:u,sx:{width:"100%",height:"100%"}},a.createElement("svg",{ref:m,style:{width:"100%",height:"100%"}}))};

package/sections/realtime/components/realtime-curve.js

@@ -0,0 +1,2 @@
+"use client";
+import*as t from"d3";import e from"react-cool-dimensions";import r,{useRef as a,useState as i,useEffect as n}from"react";import l from"@mui/material/Box";import{useTheme as o}from"@mui/material/styles";import{fDate as c}from"../../../utils/format-time.js";export default s=>{const{wellName:d,data:m,height:p,...u}=s,h=o(),g="dark"===h.palette.mode,f=a(null),{observe:y,width:x,height:v}=e(),[C]=i({margin:{top:0,right:5,bottom:0,left:5},dimension:{left:5,top:0,right:5,bottom:0},rulerWidth:70,curveTitleHeight:150,gridOffset:50}),T=a(60),w=a(0),k=a(new Date((new Date).getTime()-6e5)),D=a(new Date),b=[{type:"groupObj",children:[{type:"curveObj",name:"钻压(kN)",field:"woba",min:-350,max:350,color:"#996600",colorDark:"#FFFFCC"},{type:"curveObj",name:"钩载(kN)",field:"hkla",min:0,max:3e3,color:"#336666",colorDark:"#CCFFCC"},{type:"curveObj",name:"转盘转速(r/min)",field:"rpma",min:0,max:150,color:"#CC0033",colorDark:"#CCFFFF"},{type:"curveObj",name:"扭矩",field:"tqa",min:0,max:50,color:"#CC0033",colorDark:"#CCFFFF"},{type:"curveObj",name:"大钩高度",field:"bpos",min:0,max:50,color:"#0066CC",colorDark:"#CCCCFF"}]},{type:"groupObj",children:[{type:"curveObj",name:"立压(MPa)",field:"sppa",min:0,max:40,color:"#993399",colorDark:"#669999"},{type:"curveObj",name:"泵冲1",field:"spm1",min:0,max:150,color:"#333366",colorDark:"#CCCCFF"},{type:"curveObj",name:"泵冲2",field:"spm2",min:0,max:150,color:"#003333",colorDark:"#FFFFCC"},{type:"curveObj",name:"泵冲3",field:"spm3",min:0,max:150,color:"#CC0033",colorDark:"#99CCFF"},{type:"curveObj",name:"排量(L/s)",field:"mfop",min:0,max:100,color:"#006699",colorDark:"#CCFF66"},{type:"curveObj",name:"相对流量(%)",field:"mfia",min:0,max:100,color:"#CC0033",colorDark:"#66CC66"}]},{type:"groupObj",children:[{type:"curveObj",name:"全烃含量(%)",field:"gasa",min:0,max:100,color:"#FF6600",colorDark:"#996633"},{type:"curveObj",name:"钻时(min/m)",field:"ropa",min:0,max:60,color:"#006699",colorDark:"#CCFF66"},{type:"curveObj",name:"总池体积(m³)",field:"tvt",min:0,max:400,color:"#336633",colorDark:"#CC99CC"},{type:"curveObj",name:"伽马(API)",field:"gama",min:0,max:400,color:"#336633",colorDark:"#CC99CC"},{type:"curveObj",name:"出口密度(g/cm³)",field:"mdoa",min:1,max:3,color:"#336633",colorDark:"#CC99CC"},{type:"curveObj",name:"入口密度(g/cm³)",field:"mdia",min:1,max:3,color:"#336633",colorDark:"#CC99CC"}]}];function F(t,e,r,a,i,n){t.append("rect").classed("mapCurveTitle",!0).attr("x",r).attr("y",a).attr("width",i).attr("height",n).attr("fill",h.palette.background.neutral).attr("stroke",h.palette.divider).attr("stroke-width",1),t.append("text").classed("mapCurveTitleText",!0).text(e.name).attr("x",r+i/2).attr("y",a+n/3).attr("fill",h.palette.text.primary).style("font-family","Microsoft YaHei").style("font-weight","bold").style("font-size",12).style("text-anchor","middle").style("dominant-baseline","middle"),t.append("text").classed("mapCurveTitleText",!0).text(e.min).attr("x",r+5).attr("y",a+n/5*4).attr("fill",g?e.colorDark:e.color).style("font-family","Microsoft YaHei").style("font-size",8).style("text-anchor","start").style("dominant-baseline","middle"),t.append("text").classed("mapCurveTitleText",!0).text(e.max).attr("x",r+i-5).attr("y",a+n/5*4).attr("fill",g?e.colorDark:e.color).style("font-family","Microsoft YaHei").style("font-size",8).style("text-anchor","end").style("dominant-baseline","middle"),t.append("line").attr("x1",r+25).attr("y1",a+n/5*4).attr("x2",r+i-25).attr("y2",a+n/5*4).attr("stroke",g?e.colorDark:e.color).attr("stroke-width",1.3)}const H=()=>{if(x<=0||v<=0||!f.current)return;f.current.innerHTML="";const e=new Date(D.current.getTime()-1e3*w.current),r=new Date(e.getTime()-1e3*T.current),a=x-C.margin.left-C.margin.right,i=v-C.margin.top-C.margin.bottom,n={width:a-C.dimension.left-C.dimension.right,height:i-C.dimension.top-C.dimension.bottom},l=n.height-C.curveTitleHeight,o=(n.width-C.rulerWidth)/b.length,s=t.scaleTime().domain([r,e]).range([0,l]),d=t.scaleTime().domain([k.current,D.current]).range([0,l]);function p(){return t.select(f.current)}const u=t.brushY().extent([[0,0],[30,l]]).on("brush end",j);!function(){const t=p().append("defs").attr("id","defs");let e=t.append("linearGradient").attr("id","curveTitleLinear").attr("x1",0).attr("y1",0).attr("x2",0).attr("y2",1);e.append("stop").attr("offset",0).style("stop-color","#DCDCDC"),e.append("stop").attr("offset",1).style("stop-color","#6C6C6C"),e=t.append("linearGradient").attr("id","curveTitleLinearDark").attr("x1",0).attr("y1",0).attr("x2",0).attr("y2",1),e.append("stop").attr("offset",0).style("stop-color","#263238"),e.append("stop").attr("offset",1).style("stop-color","#212121")}(),p().attr("width",a).attr("height",i).attr("transform",`translate(${C.margin.left}, ${C.margin.top})`),p().append("rect").classed("mapRoot",!0).attr("x",0).attr("y",0).attr("width",a).attr("height",i).attr("stroke-width",1).attr("fill",h.palette.background.default).attr("stroke","transparent");const y=p().append("g").attr("transform",`translate(${C.dimension.left}, ${C.dimension.top})`),H=y.append("g").attr("id","curveMap").attr("width",n.width).attr("height",n.height);H.append("rect").classed("mapCurveTitle",!0).attr("x",0).attr("y",0).attr("width",C.rulerWidth).attr("height",C.curveTitleHeight).attr("fill",h.palette.background.neutral).attr("stroke",h.palette.divider).attr("stroke-width",1),H.append("rect").classed("mapCurveBody",!0).attr("x",0).attr("y",C.curveTitleHeight).attr("width",C.rulerWidth).attr("height",n.height-C.curveTitleHeight).attr("fill","#FFFFFF00").attr("stroke",h.palette.divider).attr("stroke-width",1),H.append("text").classed("mapCurveTitleText",!0).text("标尺").attr("x",C.rulerWidth/2).attr("y",C.curveTitleHeight/3).attr("fill",h.palette.text.primary).style("font-family","Microsoft YaHei").style("font-weight","bold").style("font-size",15).style("text-anchor","middle").style("dominant-baseline","middle");const W=t.select("#defs"),A=[];b.forEach((r,a)=>{var c,s;if("groupObj"===r.type){const t=(null===(c=r.children)||void 0===c?void 0:c.length)||1,e=C.curveTitleHeight/t;null===(s=r.children)||void 0===s||s.forEach((t,r)=>{F(H,t,C.rulerWidth+o*a,e*r,o,e),A.push({x:C.rulerWidth+o*a,y:0,width:o,height:l,item:t,columnIndex:a})})}else"curveObj"===r.type&&(F(H,r,C.rulerWidth+o*a,0,o,C.curveTitleHeight),A.push({x:C.rulerWidth+o*a,y:0,width:o,height:l,item:r,columnIndex:a}));W.append("clipPath").attr("id",`clipColumn${a}`).append("rect").attr("x",C.rulerWidth+o*a).attr("y",0).attr("width",o).attr("height",n.height-C.curveTitleHeight);const d=t.range(0,n.height-C.curveTitleHeight,C.gridOffset),p=(t.range(0,o,o/25),H.append("g").attr("width",o).attr("height",n.height-C.curveTitleHeight).attr("transform",`translate(${C.rulerWidth+o*a}, ${C.curveTitleHeight})`));p.append("g").selectAll("line").data(d).join("line").classed("mapGridLine",!0).attr("x1",0).attr("y1",t=>t).attr("x2",o).attr("y2",t=>t).attr("stroke",h.palette.divider).attr("stroke-width",1),p.append("rect").classed("mapCurveBody",!0).attr("x",0).attr("y",0).attr("width",o).attr("height",n.height-C.curveTitleHeight).attr("fill","transparent").attr("stroke",h.palette.divider).attr("stroke-width",1);y.append("rect").attr("fill","none").attr("pointer-events","all").attr("x",C.rulerWidth+o*a).attr("y",C.curveTitleHeight).attr("width",o).attr("height",n.height-C.curveTitleHeight).on("mousemove",r=>function(r,a){var n;N.attr("display",null);const l=t.pointer(r),c=new Date(D.current.getTime()-1e3*w.current),s=new Date(e.getTime()-1e3*T.current),d=t.scaleTime().domain([s,c]).range([0,O()[1]]).invert(l[1]-C.curveTitleHeight),p=C.rulerWidth+o*a;B.attr("x1",C.rulerWidth+o*a).attr("y1",l[1]).attr("x2",C.rulerWidth+o*(a+1)).attr("y2",l[1]).attr("opacity","1");const u=t.timeFormat("%X");I.selectAll(".tooltip-text-line").remove(),H.selectAll(".tooltip-line-circles").remove(),I.append("tspan").attr("class","tooltip-text-line").attr("x","5").attr("y","5").attr("dy","13px").attr("font-weight","bold").text(`${u(d)}`),l[1]>i-200?N.attr("transform",`translate(${p},${l[1]-100})`):N.attr("transform",`translate(${p},${l[1]})`);if(m){let t=-1;for(let e=0;e<m.length-1;e+=1)if(new Date(m[e].data_time)>=d&&new Date(m[e+1].data_time)<=d){t=e;break}t>=0&&(null===(n=b[a].children)||void 0===n||n.forEach((e,r)=>{const a=m[t][e.field];I.append("tspan").attr("class","tooltip-text-line").attr("x","5").attr("dy","14px").attr("font-weight","bold").text(`${e.name}:${a}`)}))}}(r,a)).on("mouseover",R).on("mouseout",G)});H.append("g").attr("transform",`translate(0, ${C.curveTitleHeight})`).selectAll("path").data(A).join("path").classed("mapCurve",!0).attr("fill","none").attr("stroke",t=>g?t.item.colorDark:t.item.color).attr("stroke-width",2).attr("stroke-linejoin","round").attr("stroke-linecap","round").attr("d",t=>$(t)).attr("clip-path",t=>`url(#clipColumn${t.columnIndex})`);const E=H.append("g").attr("id","rulerObj").attr("transform",`translate(0, ${C.curveTitleHeight})`);E.append("line").classed("mapNormalLine",!0).attr("x1",30).attr("y1",0).attr("x2",30).attr("y2",l).attr("stroke",h.palette.divider);const M=t.range(0,l,C.gridOffset);E.append("g").selectAll("line").data(M).join("line").classed("mapRulerDataLine",!0).attr("x1",30).attr("y1",t=>t).attr("x2",C.rulerWidth).attr("y2",t=>t).attr("stroke",h.palette.divider),E.append("g").selectAll("text").data(M).join("text").classed("mapRulerDataTime",!0).text(t=>c(s.invert(t),"HH:mm:ss")).attr("x",C.rulerWidth-10).attr("y",t=>t+5).attr("fill",h.palette.text.primary).style("font-family","Microsoft YaHei").style("font-size",8).style("text-anchor","end").style("dominant-baseline","middle");const L=new Date(D.current.getTime()-1e3*w.current),Y=[d(new Date(L.getTime()-1e3*T.current)),d(L)],z=E.append("g");z.append("rect").classed("mapNav",!0).attr("x",0).attr("y",0).attr("width",30).attr("height",l).attr("fill","none").style("shape-rendering","crispEdges");const _=z.append("g").classed("mapBrush",!0).call(u).call(u.move,Y);_.selectAll(".selection").attr("fill",h.palette.primary.main).attr("fill-opacity",.5).attr("stroke","transparent"),_.selectAll(".overlay").attr("fill",h.palette.background.paper).attr("fill-opacity",.1).attr("stroke","transparent");const B=H.append("line").attr("class","mouse-line").attr("stroke",h.palette.text.primary).attr("stroke-width",1).attr("opacity","0"),N=H.append("g").attr("class","tooltip-wrapper").attr("display","none"),I=(N.append("rect").attr("fill",h.palette.background.default),N.append("text").attr("fill",h.palette.text.primary).style("font-family","Microsoft YaHei").style("font-size",12).style("text-anchor","start").style("dominant-baseline","middle"));function R(){B.attr("opacity","1"),N.attr("display",null)}function G(){B.attr("opacity","0"),N.attr("display","none")}},j=e=>{if(e.sourceEvent&&"zoom"===e.sourceEvent.type)return;if(e.sourceEvent&&"mouseup"===e.sourceEvent.type){}const r=t.scaleTime().domain([k.current,D.current]).range([0,O()[1]]),a=(e.selection||r.range()).map(r.invert,r);T.current=(a[1].getTime()-a[0].getTime())/1e3,w.current=(D.current.getTime()-a[1].getTime())/1e3,W()},O=()=>{const t=x-C.margin.left-C.margin.right,e=v-C.margin.top-C.margin.bottom,r=t-C.dimension.left-C.dimension.right,a=e-C.dimension.top-C.dimension.bottom-C.curveTitleHeight;return[(r-C.rulerWidth)/b.length,a]},W=()=>{const e=new Date(D.current.getTime()-1e3*w.current),r=new Date(e.getTime()-1e3*T.current),a=t.scaleTime().domain([r,e]).range([0,O()[1]]);t.scaleTime().domain([k.current,D.current]).range([0,O()[1]]);t.selectAll(".mapRulerDataTime").text(t=>c(a.invert(t),"HH:mm:ss")),t.selectAll(".mapCurve").attr("d",t=>$(t))},$=e=>{const r=t.scaleLinear().domain([e.item.min||0,e.item.max||100]).range([e.x,e.x+e.width]),a=new Date(D.current.getTime()-1e3*w.current),i=new Date(a.getTime()-1e3*(T.current+T.current/5)),n=new Date(D.current.getTime()-1e3*w.current),l=new Date(n.getTime()-1e3*T.current),o=t.scaleTime().domain([l,n]).range([0,O()[1]]);t.scaleTime().domain([k.current,D.current]).range([0,O()[1]]);return t.line().defined((t,e)=>new Date(t.data_time)>=i&&new Date(t.data_time)<=a).x((t,a)=>{var i;return r(t[null===(i=null==e?void 0:e.item)||void 0===i?void 0:i.field])}).y((t,e)=>o(new Date(t.data_time)))(m||[])};return n(()=>{m&&m.length>1&&(H(),k.current=new Date(m[m.length-1].data_time),D.current=new Date(new Date(m[0].data_time).getTime()+T.current/10*1e3),(()=>{const e=new Date(D.current.getTime()-1e3*w.current),r=new Date(e.getTime()-1e3*T.current),a=t.scaleTime().domain([r,e]).range([0,O()[1]]),i=t.scaleTime().domain([k.current,D.current]).range([0,O()[1]]),n=t.brushY().extent([[0,0],[30,O()[1]]]).on("brush end",j);a.domain([r,e]),i.domain([k.current,D.current]);const l=[i(r),i(e)];t.selectAll(".mapBrush").classed("mapBrush",!0).call(n).call(n.move,l)})(),W())},[m]),n(()=>{H(),W()},[x,v,h]),r.createElement(l,{component:"div",sx:{width:"100%",height:p||700},ref:y},r.createElement("svg",{ref:f,className:"d3Container",style:{width:"100%",height:"100%"}}))};

package/utils/format-time.js

@@ -0,0 +1,2 @@
+"use client";
+import{zhCN as t}from"date-fns/locale";import{format as e,getTime as n,formatDistanceToNow as o}from"date-fns";export function fDate(t,n){const o=n||"yyyy/MM/dd";return t?e(new Date(t),o):""}export function fDateTime(t,n){const o=n||"dd MMM yyyy p";return t?e(new Date(t),o):""}export function fTimestamp(t){return t?n(new Date(t)):""}export function fToNow(e){return e?o(new Date(e),{addSuffix:!0,locale:t}):""}

package/utils/graphic.js

@@ -0,0 +1,2 @@
+"use client";
+export const conversion_getDPI=()=>{var t;const e=[],x=document.createElement("DIV");return x.style.cssText="width:1in;height:1in;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden",document.body.appendChild(x),e[0]=x.offsetWidth,e[1]=x.offsetHeight,null===(t=x.parentNode)||void 0===t||t.removeChild(x),e};export const pxConversionMm=t=>25.4*(t/conversion_getDPI()[0]);export const mmConversionPx=t=>t/25.4*conversion_getDPI()[0];export const Regulate=(t,e,x)=>{let n=x;const o=(e-t)/n;let y;y=10**Math.trunc(Math.log(o)/Math.log(10))===o?10**Math.trunc(Math.log(o)/Math.log(10)):10**Math.trunc(Math.log(o)/Math.log(10)+1);let r=o/y;if(r=r>=0&&r<=.1?.1:r>=.1&&r<=.2?.2:r>=.2&&r<=.25?.25:r>=.25&&r<=.5?.5:1,r*=y,Math.trunc(t/r)!==t/r){t=t<0?-1*Math.ceil(Math.abs(t/r))*r:Math.trunc(Math.abs(t/r))*r,Math.trunc(e/r)!==e/r&&(e=Math.trunc(e/r+1)*r);let x=(e-t)/r;if(x<n){const o=n-x;x=n,e+=o%2==0?r*Math.trunc(o/2):r*Math.trunc(o/2+1),t-=r*Math.trunc(o/2)}n=x}else{Math.trunc(e/r)!==e/r&&(e=Math.trunc(e/r+1)*r);n=(e-t)/r}return{Min:t,Max:e,Count:n,Step:r}};export const CalExtendPath=(e,x)=>{const n={leftPath:[],rightPath:[]};let o=null;for(let y=0;y<e.length;y+=1){const r=e[y];if(o){const e={x:0,y:0},y={x:0,y:0};t(x,o.x,o.y,r.x,r.y,e,y)&&(n.leftPath.push(e),n.rightPath.push(y))}else if(o=r,e.length>1){const o={x:0,y:0},y={x:0,y:0};t(x,e[1].x,e[1].y,e[0].x,e[0].y,o,y)&&(n.leftPath.push(o),n.rightPath.push(y))}o=r}return n};function t(t,e,x,n,o,y,r){let h=!0;if(e===n&&x===o)h=!1;else if(e===n)y.x=n-t,y.y=o,r.x=n+t,r.y=o;else if(x===o)y.x=n,y.y=o+t,r.x=n,r.y=o-t;else{const h=-1/((x-o)/(e-n));h<=0?(y.x=n-Math.sqrt(t*t/(h*h+1)),y.y=o+h*(y.x-n),r.x=n+Math.sqrt(t*t/(h*h+1)),r.y=o+h*(r.x-n)):(y.x=n-Math.sqrt(t*t/(h*h+1)),y.y=o-h*(y.x-n),r.x=n+Math.sqrt(t*t/(h*h+1)),r.y=o-h*(r.x-n))}return h}export const findCross=(t,x,n,o,y,r)=>{const h={x:t.x+10,y:10*x+t.y},s=e(t,h,n,o),a=e(t,h,o,y),c=e(t,h,y,r),i=e(t,h,r,n),l=y.x-n.x>y.y-n.y?y.x-n.x:y.y-n.y;let u=s||a||c||i,M=i;return s&&u!==s?M=s:a&&u!==a?M=a:c&&u!==c&&(M=c),u&&(u={x:(u.x-n.x)/l,y:(u.y-n.y)/l}),M&&(M={x:(M.x-n.x)/l,y:(M.y-n.y)/l}),[u,M]};function e(t,e,x,n){const o=(e.y-t.y)*(n.x-x.x)-(t.x-e.x)*(x.y-n.y);if(0===o)return!1;const y=((e.x-t.x)*(n.x-x.x)*(x.y-t.y)+(e.y-t.y)*(n.x-x.x)*t.x-(n.y-x.y)*(e.x-t.x)*x.x)/o,r=-((e.y-t.y)*(n.y-x.y)*(x.x-t.x)+(e.x-t.x)*(n.y-x.y)*t.y-(n.x-x.x)*(e.y-t.y)*x.y)/o;return(y-x.x)*(y-n.x)<=.01&&(r-x.y)*(r-n.y)<=.01&&{x:y,y:r}}