@mapvx/web-components-ssr 1.6.1 → 1.7.0-dev.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -17
- package/dist/browser/chunk-BcTPI0Ei.js +4336 -0
- package/dist/browser/chunk-BxefRtM9.js +3 -0
- package/dist/browser/chunk-C64ZrtDH.js +348 -0
- package/dist/browser/chunk-C7x5ioh5.js +6148 -0
- package/dist/browser/chunk-C8XJWaI5.js +2 -0
- package/dist/browser/chunk-CHv413eO.js +13 -0
- package/dist/browser/chunk-CRCKWzfw.js +3 -0
- package/dist/browser/chunk-CYtO4qrL.js +3 -0
- package/dist/browser/chunk-CgRco1rJ.js +2 -0
- package/dist/browser/chunk-CwafJShv.js +3 -0
- package/dist/browser/chunk-D6zG2upO.js +1180 -0
- package/dist/browser/chunk-DIEcQ4a-.js +1318 -0
- package/dist/browser/chunk-DtPiRK4g.js +3 -0
- package/dist/browser/chunk-FjUzkN6v.js +2 -0
- package/dist/browser/chunk-KW-jIWmp.js +3 -0
- package/dist/browser/chunk-sqKVpUVP.js +4116 -0
- package/dist/browser/main.js +552 -533
- package/dist/browser/styles.css +1 -1
- package/dist/types/public-api.d.ts +90 -24
- package/package.json +40 -33
- package/dist/browser/chunk-Bjk3HkK2.js +0 -2
- package/dist/browser/chunk-CCaUxYwr.js +0 -2
- package/dist/browser/chunk-CP_etSVX.js +0 -4343
- package/dist/browser/chunk-CTFjnL_B.js +0 -1
- package/dist/browser/chunk-CdqAsQa0.js +0 -2047
- package/dist/browser/chunk-Dkhxm9pV.js +0 -1
- package/dist/browser/chunk-Dm8HBhbB.js +0 -1
- package/dist/browser/chunk-DsKCGfdq.js +0 -1
- package/dist/browser/chunk-LltjhLJU.js +0 -4115
- package/dist/browser/chunk-UfDdP4s_.js +0 -1
- package/dist/browser/chunk-VDwq1GVr.js +0 -511
|
@@ -0,0 +1,4336 @@
|
|
|
1
|
+
import{a as v,i as u,n as s,s as x,t as r}from"./main.js";import{$ as re$1,O as Zo$1,X as pt$1,Z as qr,h as Oi$1,l as Ko$1,n as De}from"./chunk-C7x5ioh5.js";import{C as Yr,L as ma,M as ie$1,O as ee,R as ne$1,T as ao,X as xs$1,Y as xe$1,f as Ka,v as S,w as _m,x as Wa,z as nt$1}from"./chunk-DIEcQ4a-.js";var po=v((vc,kt)=>{"use strict";kt.exports=ft;kt.exports.default=ft;function ft(i,e,t){t=t||2;var o=e&&e.length,n=o?e[0]*t:i.length,s=lo(i,0,n,t,!0),r=[];if(!s||s.next===s.prev)return r;var a,l,c,f,d,p,u;if(o&&(s=Rs(i,e,s,t)),i.length>80*t){a=c=i[0],l=f=i[1];for(var g=t;g<n;g+=t)d=i[g],p=i[g+1],d<a&&(a=d),p<l&&(l=p),d>c&&(c=d),p>f&&(f=p);u=Math.max(c-a,f-l),u=u!==0?32767/u:0}return ke(s,r,t,a,l,u,0),r}function lo(i,e,t,o,n){var s,r;if(n===zt(i,e,t,o)>0)for(s=e;s<t;s+=o)r=ao(s,i[s],i[s+1],r);else for(s=t-o;s>=e;s-=o)r=ao(s,i[s],i[s+1],r);return r&&dt(r,r.next)&&(Fe(r),r=r.next),r}function X(i,e){if(!i)return i;e||(e=i);var t=i,o;do if(o=!1,!t.steiner&&(dt(t,t.next)||w(t.prev,t,t.next)===0)){if(Fe(t),t=e=t.prev,t===t.next)break;o=!0}else t=t.next;while(o||t!==e);return e}function ke(i,e,t,o,n,s,r){if(i){!r&&s&&Fs(i,o,n,s);for(var a=i,l,c;i.prev!==i.next;){if(l=i.prev,c=i.next,s?Es(i,o,n,s):As(i)){e.push(l.i/t|0),e.push(i.i/t|0),e.push(c.i/t|0),Fe(i),i=c.next,a=c.next;continue}if(i=c,i===a){r?r===1?(i=Ts(X(i),e,t),ke(i,e,t,o,n,s,2)):r===2&&Os(i,e,t,o,n,s):ke(X(i),e,t,o,n,s,1);break}}}}function As(i){var e=i.prev,t=i,o=i.next;if(w(e,t,o)>=0)return!1;for(var n=e.x,s=t.x,r=o.x,a=e.y,l=t.y,c=o.y,f=n<s?n<r?n:r:s<r?s:r,d=a<l?a<c?a:c:l<c?l:c,p=n>s?n>r?n:r:s>r?s:r,u=a>l?a>c?a:c:l>c?l:c,g=o.next;g!==e;){if(g.x>=f&&g.x<=p&&g.y>=d&&g.y<=u&&se(n,a,s,l,r,c,g.x,g.y)&&w(g.prev,g,g.next)>=0)return!1;g=g.next}return!0}function Es(i,e,t,o){var n=i.prev,s=i,r=i.next;if(w(n,s,r)>=0)return!1;for(var a=n.x,l=s.x,c=r.x,f=n.y,d=s.y,p=r.y,u=a<l?a<c?a:c:l<c?l:c,g=f<d?f<p?f:p:d<p?d:p,h=a>l?a>c?a:c:l>c?l:c,v=f>d?f>p?f:p:d>p?d:p,P=Rt(u,g,e,t,o),C=Rt(h,v,e,t,o),m=i.prevZ,x=i.nextZ;m&&m.z>=P&&x&&x.z<=C;){if(m.x>=u&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&se(a,f,l,d,c,p,m.x,m.y)&&w(m.prev,m,m.next)>=0||(m=m.prevZ,x.x>=u&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&se(a,f,l,d,c,p,x.x,x.y)&&w(x.prev,x,x.next)>=0))return!1;x=x.nextZ}for(;m&&m.z>=P;){if(m.x>=u&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&se(a,f,l,d,c,p,m.x,m.y)&&w(m.prev,m,m.next)>=0)return!1;m=m.prevZ}for(;x&&x.z<=C;){if(x.x>=u&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&se(a,f,l,d,c,p,x.x,x.y)&&w(x.prev,x,x.next)>=0)return!1;x=x.nextZ}return!0}function Ts(i,e,t){var o=i;do{var n=o.prev,s=o.next.next;!dt(n,s)&&co(n,o,o.next,s)&&De(n,s)&&De(s,n)&&(e.push(n.i/t|0),e.push(o.i/t|0),e.push(s.i/t|0),Fe(o),Fe(o.next),o=i=s),o=o.next}while(o!==i);return X(o)}function Os(i,e,t,o,n,s){var r=i;do{for(var a=r.next.next;a!==r.prev;){if(r.i!==a.i&&js(r,a)){var l=fo(r,a);r=X(r,r.next),l=X(l,l.next),ke(r,e,t,o,n,s,0),ke(l,e,t,o,n,s,0);return}a=a.next}r=r.next}while(r!==i)}function Rs(i,e,t,o){var n=[],s=0,r=e.length,a,l,c;for(;s<r;s++)a=e[s]*o,l=s<r-1?e[s+1]*o:i.length,c=lo(i,a,l,o,!1),c===c.next&&(c.steiner=!0),n.push(Gs(c));for(n.sort(Ms),s=0;s<n.length;s++)t=zs(n[s],t);return t}function Ms(i,e){return i.x-e.x}function zs(i,e){var t=ks(i,e);if(!t)return e;var o=fo(t,i);return X(o,o.next),X(t,t.next)}function ks(i,e){var t=e,o=i.x,n=i.y,s=-1/0,r;do{if(n<=t.y&&n>=t.next.y&&t.next.y!==t.y){var a=t.x+(n-t.y)*(t.next.x-t.x)/(t.next.y-t.y);if(a<=o&&a>s&&(s=a,r=t.x<t.next.x?t:t.next,a===o))return r}t=t.next}while(t!==e);if(!r)return null;var l=r,c=r.x,f=r.y,d=1/0,p;t=r;do o>=t.x&&t.x>=c&&o!==t.x&&se(n<f?o:s,n,c,f,n<f?s:o,n,t.x,t.y)&&(p=Math.abs(n-t.y)/(o-t.x),De(t,i)&&(p<d||p===d&&(t.x>r.x||t.x===r.x&&Ds(r,t)))&&(r=t,d=p)),t=t.next;while(t!==l);return r}function Ds(i,e){return w(i.prev,i,e.prev)<0&&w(e.next,i,i.next)<0}function Fs(i,e,t,o){var n=i;do n.z===0&&(n.z=Rt(n.x,n.y,e,t,o)),n.prevZ=n.prev,n.nextZ=n.next,n=n.next;while(n!==i);n.prevZ.nextZ=null,n.prevZ=null,Ns(n)}function Ns(i){var e,t,o,n,s,r,a,l,c=1;do{for(t=i,i=null,s=null,r=0;t;){for(r++,o=t,a=0,e=0;e<c&&(a++,o=o.nextZ,!!o);e++);for(l=c;a>0||l>0&&o;)a!==0&&(l===0||!o||t.z<=o.z)?(n=t,t=t.nextZ,a--):(n=o,o=o.nextZ,l--),s?s.nextZ=n:i=n,n.prevZ=s,s=n;t=o}s.nextZ=null,c*=2}while(r>1);return i}function Rt(i,e,t,o,n){return i=(i-t)*n|0,e=(e-o)*n|0,i=(i|i<<8)&16711935,i=(i|i<<4)&252645135,i=(i|i<<2)&858993459,i=(i|i<<1)&1431655765,e=(e|e<<8)&16711935,e=(e|e<<4)&252645135,e=(e|e<<2)&858993459,e=(e|e<<1)&1431655765,i|e<<1}function Gs(i){var e=i,t=i;do(e.x<t.x||e.x===t.x&&e.y<t.y)&&(t=e),e=e.next;while(e!==i);return t}function se(i,e,t,o,n,s,r,a){return(n-r)*(e-a)>=(i-r)*(s-a)&&(i-r)*(o-a)>=(t-r)*(e-a)&&(t-r)*(s-a)>=(n-r)*(o-a)}function js(i,e){return i.next.i!==e.i&&i.prev.i!==e.i&&!Bs(i,e)&&(De(i,e)&&De(e,i)&&Ws(i,e)&&(w(i.prev,i,e.prev)||w(i,e.prev,e))||dt(i,e)&&w(i.prev,i,i.next)>0&&w(e.prev,e,e.next)>0)}function w(i,e,t){return(e.y-i.y)*(t.x-e.x)-(e.x-i.x)*(t.y-e.y)}function dt(i,e){return i.x===e.x&&i.y===e.y}function co(i,e,t,o){var n=ct(w(i,e,t)),s=ct(w(i,e,o)),r=ct(w(t,o,i)),a=ct(w(t,o,e));return!!(n!==s&&r!==a||n===0&<(i,t,e)||s===0&<(i,o,e)||r===0&<(t,i,o)||a===0&<(t,e,o))}function lt(i,e,t){return e.x<=Math.max(i.x,t.x)&&e.x>=Math.min(i.x,t.x)&&e.y<=Math.max(i.y,t.y)&&e.y>=Math.min(i.y,t.y)}function ct(i){return i>0?1:i<0?-1:0}function Bs(i,e){var t=i;do{if(t.i!==i.i&&t.next.i!==i.i&&t.i!==e.i&&t.next.i!==e.i&&co(t,t.next,i,e))return!0;t=t.next}while(t!==i);return!1}function De(i,e){return w(i.prev,i,i.next)<0?w(i,e,i.next)>=0&&w(i,i.prev,e)>=0:w(i,e,i.prev)<0||w(i,i.next,e)<0}function Ws(i,e){var t=i,o=!1,n=(i.x+e.x)/2,s=(i.y+e.y)/2;do t.y>s!=t.next.y>s&&t.next.y!==t.y&&n<(t.next.x-t.x)*(s-t.y)/(t.next.y-t.y)+t.x&&(o=!o),t=t.next;while(t!==i);return o}function fo(i,e){var t=new Mt(i.i,i.x,i.y),o=new Mt(e.i,e.x,e.y),n=i.next,s=e.prev;return i.next=e,e.prev=i,t.next=n,n.prev=t,o.next=t,t.prev=o,s.next=o,o.prev=s,o}function ao(i,e,t,o){var n=new Mt(i,e,t);return o?(n.next=o.next,n.prev=o,o.next.prev=n,o.next=n):(n.prev=n,n.next=n),n}function Fe(i){i.next.prev=i.prev,i.prev.next=i.next,i.prevZ&&(i.prevZ.nextZ=i.nextZ),i.nextZ&&(i.nextZ.prevZ=i.prevZ)}function Mt(i,e,t){this.i=i,this.x=e,this.y=t,this.prev=null,this.next=null,this.z=0,this.prevZ=null,this.nextZ=null,this.steiner=!1}ft.deviation=function(i,e,t,o){var n=e&&e.length,s=n?e[0]*t:i.length,r=Math.abs(zt(i,0,s,t));if(n)for(var a=0,l=e.length;a<l;a++){var c=e[a]*t,f=a<l-1?e[a+1]*t:i.length;r-=Math.abs(zt(i,c,f,t))}var d=0;for(a=0;a<o.length;a+=3){var p=o[a]*t,u=o[a+1]*t,g=o[a+2]*t;d+=Math.abs((i[p]-i[g])*(i[u+1]-i[p+1])-(i[p]-i[u])*(i[g+1]-i[p+1]))}return r===0&&d===0?0:Math.abs((d-r)/r)};function zt(i,e,t,o){for(var n=0,s=e,r=t-o;s<t;s+=o)n+=(i[r]-i[s])*(i[s+1]+i[r+1]),r=s;return n}ft.flatten=function(i){for(var e=i[0][0].length,t={vertices:[],holes:[],dimensions:e},o=0,n=0;n<i.length;n++){for(var s=0;s<i[n].length;s++)for(var r=0;r<e;r++)t.vertices.push(i[n][s][r]);n>0&&(o+=i[n-1].length,t.holes.push(o))}return t}});var pn=`struct ArcUniforms {
|
|
2
|
+
greatCircle: f32,
|
|
3
|
+
useShortestPath: f32,
|
|
4
|
+
numSegments: f32,
|
|
5
|
+
widthScale: f32,
|
|
6
|
+
widthMinPixels: f32,
|
|
7
|
+
widthMaxPixels: f32,
|
|
8
|
+
widthUnits: i32,
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
@group(0) @binding(auto) var<uniform> arc: ArcUniforms;
|
|
12
|
+
`;var Xt=`layout(std140) uniform arcUniforms {
|
|
13
|
+
bool greatCircle;
|
|
14
|
+
bool useShortestPath;
|
|
15
|
+
float numSegments;
|
|
16
|
+
float widthScale;
|
|
17
|
+
float widthMinPixels;
|
|
18
|
+
float widthMaxPixels;
|
|
19
|
+
highp int widthUnits;
|
|
20
|
+
} arc;
|
|
21
|
+
`;var qt={name:`arc`,source:pn,vs:Xt,fs:Xt,uniformTypes:{greatCircle:`f32`,useShortestPath:`f32`,numSegments:`f32`,widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,widthUnits:`i32`}};var Qt=`const ZERO_OFFSET: vec3<f32> = vec3<f32>(0.0, 0.0, 0.0);
|
|
22
|
+
|
|
23
|
+
struct Attributes {
|
|
24
|
+
@location(0) instanceSourcePositions: vec3<f32>,
|
|
25
|
+
@location(1) instanceSourcePositions64Low: vec3<f32>,
|
|
26
|
+
@location(2) instanceTargetPositions: vec3<f32>,
|
|
27
|
+
@location(3) instanceTargetPositions64Low: vec3<f32>,
|
|
28
|
+
@location(4) instanceSourceColors: vec4<f32>,
|
|
29
|
+
@location(5) instanceTargetColors: vec4<f32>,
|
|
30
|
+
@location(6) instanceWidths: f32,
|
|
31
|
+
@location(7) instanceHeights: f32,
|
|
32
|
+
@location(8) instanceTilts: f32,
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
struct Varyings {
|
|
36
|
+
@builtin(position) position: vec4<f32>,
|
|
37
|
+
@location(0) color: vec4<f32>,
|
|
38
|
+
@location(1) uv: vec2<f32>,
|
|
39
|
+
@location(2) pickingColor: vec3<f32>,
|
|
40
|
+
@location(3) isValid: f32,
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
fn paraboloid(
|
|
44
|
+
distance: f32,
|
|
45
|
+
sourceZ: f32,
|
|
46
|
+
targetZ: f32,
|
|
47
|
+
ratio: f32,
|
|
48
|
+
height: f32
|
|
49
|
+
) -> f32 {
|
|
50
|
+
let deltaZ = targetZ - sourceZ;
|
|
51
|
+
let dh = distance * height;
|
|
52
|
+
if (dh == 0.0) {
|
|
53
|
+
return sourceZ + deltaZ * ratio;
|
|
54
|
+
}
|
|
55
|
+
let unitZ = deltaZ / dh;
|
|
56
|
+
let p2 = unitZ * unitZ + 1.0;
|
|
57
|
+
let dir = select(0.0, 1.0, deltaZ <= 0.0);
|
|
58
|
+
let z0 = mix(sourceZ, targetZ, dir);
|
|
59
|
+
let r = mix(ratio, 1.0 - ratio, dir);
|
|
60
|
+
return sqrt(max(r * (p2 - r), 0.0)) * dh + z0;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
fn getExtrusionOffset(lineClipspace: vec2<f32>, side: f32, width: f32) -> vec2<f32> {
|
|
64
|
+
var direction = normalize(lineClipspace * project.viewportSize);
|
|
65
|
+
direction = vec2<f32>(-direction.y, direction.x);
|
|
66
|
+
return direction * side * width / 2.0;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
fn getSegmentRatio(index: f32) -> f32 {
|
|
70
|
+
return smoothstep(0.0, 1.0, index / max(arc.numSegments - 1.0, 1.0));
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
fn interpolateFlat(
|
|
74
|
+
source: vec3<f32>,
|
|
75
|
+
targetPosition: vec3<f32>,
|
|
76
|
+
ratio: f32,
|
|
77
|
+
height: f32,
|
|
78
|
+
tiltDegrees: f32
|
|
79
|
+
) -> vec3<f32> {
|
|
80
|
+
let distance = length(source.xy - targetPosition.xy);
|
|
81
|
+
let z = paraboloid(distance, source.z, targetPosition.z, ratio, height);
|
|
82
|
+
let tiltAngle = radians(tiltDegrees);
|
|
83
|
+
let tiltDirection = normalize(targetPosition.xy - source.xy);
|
|
84
|
+
let tilt = vec2<f32>(-tiltDirection.y, tiltDirection.x) * z * sin(tiltAngle);
|
|
85
|
+
return vec3<f32>(mix(source.xy, targetPosition.xy, ratio) + tilt, z * cos(tiltAngle));
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
// Great circle interpolation
|
|
89
|
+
// http://www.movable-type.co.uk/scripts/latlong.html
|
|
90
|
+
fn getAngularDistance(source: vec2<f32>, targetPosition: vec2<f32>) -> f32 {
|
|
91
|
+
let sourceRadians = radians(source);
|
|
92
|
+
let targetRadians = radians(targetPosition);
|
|
93
|
+
let sinHalfDelta = sin((sourceRadians - targetRadians) / 2.0);
|
|
94
|
+
let sinHalfDeltaSquared = sinHalfDelta * sinHalfDelta;
|
|
95
|
+
let a = sinHalfDeltaSquared.y +
|
|
96
|
+
cos(sourceRadians.y) * cos(targetRadians.y) * sinHalfDeltaSquared.x;
|
|
97
|
+
return 2.0 * asin(sqrt(a));
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
fn interpolateGreatCircle(
|
|
101
|
+
source: vec3<f32>,
|
|
102
|
+
targetPosition: vec3<f32>,
|
|
103
|
+
source3D: vec3<f32>,
|
|
104
|
+
target3D: vec3<f32>,
|
|
105
|
+
angularDistance: f32,
|
|
106
|
+
ratio: f32,
|
|
107
|
+
height: f32
|
|
108
|
+
) -> vec3<f32> {
|
|
109
|
+
var longitudeLatitude: vec2<f32>;
|
|
110
|
+
|
|
111
|
+
// If the angular distance is PI, use linear interpolation. Otherwise use spherical interpolation.
|
|
112
|
+
if (abs(angularDistance - PI) < 0.001) {
|
|
113
|
+
longitudeLatitude = (1.0 - ratio) * source.xy + ratio * targetPosition.xy;
|
|
114
|
+
} else {
|
|
115
|
+
let a = sin((1.0 - ratio) * angularDistance);
|
|
116
|
+
let b = sin(ratio * angularDistance);
|
|
117
|
+
let p = source3D.yxz * a + target3D.yxz * b;
|
|
118
|
+
longitudeLatitude = degrees(vec2<f32>(
|
|
119
|
+
atan2(p.y, -p.x),
|
|
120
|
+
atan2(p.z, length(p.xy))
|
|
121
|
+
));
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
let z = paraboloid(
|
|
125
|
+
angularDistance * EARTH_RADIUS,
|
|
126
|
+
source.z,
|
|
127
|
+
targetPosition.z,
|
|
128
|
+
ratio,
|
|
129
|
+
height
|
|
130
|
+
);
|
|
131
|
+
return vec3<f32>(longitudeLatitude, z);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
@vertex
|
|
135
|
+
fn vertexMain(
|
|
136
|
+
attributes: Attributes,
|
|
137
|
+
@builtin(vertex_index) vertexIndex: u32,
|
|
138
|
+
@builtin(instance_index) instanceIndex: u32
|
|
139
|
+
) -> Varyings {
|
|
140
|
+
geometry.worldPosition = attributes.instanceSourcePositions;
|
|
141
|
+
geometry.worldPositionAlt = attributes.instanceTargetPositions;
|
|
142
|
+
|
|
143
|
+
let segmentIndex = f32(vertexIndex / 2u);
|
|
144
|
+
let segmentSide = select(-1.0, 1.0, vertexIndex % 2u == 1u);
|
|
145
|
+
var segmentRatio = getSegmentRatio(segmentIndex);
|
|
146
|
+
let previousRatio = getSegmentRatio(max(0.0, segmentIndex - 1.0));
|
|
147
|
+
var nextRatio = getSegmentRatio(min(arc.numSegments - 1.0, segmentIndex + 1.0));
|
|
148
|
+
// If this is the first point, use next - current as direction.
|
|
149
|
+
var indexDirection = select(-1.0, 1.0, segmentIndex <= 0.0);
|
|
150
|
+
var isValid = 1.0;
|
|
151
|
+
|
|
152
|
+
var currentClip: vec4<f32>;
|
|
153
|
+
var nextClip: vec4<f32>;
|
|
154
|
+
|
|
155
|
+
if (
|
|
156
|
+
(arc.greatCircle != 0.0 || project.projectionMode == PROJECTION_MODE_GLOBE) &&
|
|
157
|
+
project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT
|
|
158
|
+
) {
|
|
159
|
+
let source = project_globe_(vec3<f32>(attributes.instanceSourcePositions.xy, 0.0));
|
|
160
|
+
let targetPosition = project_globe_(vec3<f32>(attributes.instanceTargetPositions.xy, 0.0));
|
|
161
|
+
let angularDistance = getAngularDistance(
|
|
162
|
+
attributes.instanceSourcePositions.xy,
|
|
163
|
+
attributes.instanceTargetPositions.xy
|
|
164
|
+
);
|
|
165
|
+
|
|
166
|
+
let previousPosition = interpolateGreatCircle(
|
|
167
|
+
attributes.instanceSourcePositions,
|
|
168
|
+
attributes.instanceTargetPositions,
|
|
169
|
+
source,
|
|
170
|
+
targetPosition,
|
|
171
|
+
angularDistance,
|
|
172
|
+
previousRatio,
|
|
173
|
+
attributes.instanceHeights
|
|
174
|
+
);
|
|
175
|
+
var currentPosition = interpolateGreatCircle(
|
|
176
|
+
attributes.instanceSourcePositions,
|
|
177
|
+
attributes.instanceTargetPositions,
|
|
178
|
+
source,
|
|
179
|
+
targetPosition,
|
|
180
|
+
angularDistance,
|
|
181
|
+
segmentRatio,
|
|
182
|
+
attributes.instanceHeights
|
|
183
|
+
);
|
|
184
|
+
var nextPosition = interpolateGreatCircle(
|
|
185
|
+
attributes.instanceSourcePositions,
|
|
186
|
+
attributes.instanceTargetPositions,
|
|
187
|
+
source,
|
|
188
|
+
targetPosition,
|
|
189
|
+
angularDistance,
|
|
190
|
+
nextRatio,
|
|
191
|
+
attributes.instanceHeights
|
|
192
|
+
);
|
|
193
|
+
|
|
194
|
+
if (abs(currentPosition.x - previousPosition.x) > 180.0) {
|
|
195
|
+
indexDirection = -1.0;
|
|
196
|
+
isValid = 0.0;
|
|
197
|
+
} else if (abs(currentPosition.x - nextPosition.x) > 180.0) {
|
|
198
|
+
indexDirection = 1.0;
|
|
199
|
+
isValid = 0.0;
|
|
200
|
+
}
|
|
201
|
+
nextPosition = select(nextPosition, previousPosition, indexDirection < 0.0);
|
|
202
|
+
nextRatio = select(nextRatio, previousRatio, indexDirection < 0.0);
|
|
203
|
+
|
|
204
|
+
if (isValid == 0.0) {
|
|
205
|
+
// Split at the antimeridian.
|
|
206
|
+
nextPosition.x += select(360.0, -360.0, nextPosition.x > 0.0);
|
|
207
|
+
let ratio = (
|
|
208
|
+
select(-180.0, 180.0, currentPosition.x > 0.0) - currentPosition.x
|
|
209
|
+
) / (nextPosition.x - currentPosition.x);
|
|
210
|
+
currentPosition = mix(currentPosition, nextPosition, ratio);
|
|
211
|
+
segmentRatio = mix(segmentRatio, nextRatio, ratio);
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
let currentPosition64Low = mix(
|
|
215
|
+
attributes.instanceSourcePositions64Low,
|
|
216
|
+
attributes.instanceTargetPositions64Low,
|
|
217
|
+
segmentRatio
|
|
218
|
+
);
|
|
219
|
+
let nextPosition64Low = mix(
|
|
220
|
+
attributes.instanceSourcePositions64Low,
|
|
221
|
+
attributes.instanceTargetPositions64Low,
|
|
222
|
+
nextRatio
|
|
223
|
+
);
|
|
224
|
+
let currentProjection = project_position_to_clipspace_and_commonspace(
|
|
225
|
+
currentPosition,
|
|
226
|
+
currentPosition64Low,
|
|
227
|
+
ZERO_OFFSET
|
|
228
|
+
);
|
|
229
|
+
currentClip = currentProjection.clipPosition;
|
|
230
|
+
nextClip = project_position_to_clipspace(nextPosition, nextPosition64Low, ZERO_OFFSET);
|
|
231
|
+
geometry.position = currentProjection.commonPosition;
|
|
232
|
+
} else {
|
|
233
|
+
var sourceWorld = attributes.instanceSourcePositions;
|
|
234
|
+
var targetWorld = attributes.instanceTargetPositions;
|
|
235
|
+
if (arc.useShortestPath != 0.0) {
|
|
236
|
+
sourceWorld.x = ((sourceWorld.x + 180.0) % 360.0) - 180.0;
|
|
237
|
+
targetWorld.x = ((targetWorld.x + 180.0) % 360.0) - 180.0;
|
|
238
|
+
let deltaLongitude = targetWorld.x - sourceWorld.x;
|
|
239
|
+
if (deltaLongitude > 180.0) {
|
|
240
|
+
targetWorld.x -= 360.0;
|
|
241
|
+
}
|
|
242
|
+
if (deltaLongitude < -180.0) {
|
|
243
|
+
sourceWorld.x -= 360.0;
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
let source = project_position_vec3_f64(
|
|
248
|
+
sourceWorld,
|
|
249
|
+
attributes.instanceSourcePositions64Low
|
|
250
|
+
);
|
|
251
|
+
let targetPosition = project_position_vec3_f64(
|
|
252
|
+
targetWorld,
|
|
253
|
+
attributes.instanceTargetPositions64Low
|
|
254
|
+
);
|
|
255
|
+
|
|
256
|
+
// Common x at longitude=-180.
|
|
257
|
+
var antimeridianX = 0.0;
|
|
258
|
+
if (arc.useShortestPath != 0.0) {
|
|
259
|
+
if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
|
|
260
|
+
antimeridianX = -(project.coordinateOrigin.x + 180.0) / 360.0 * TILE_SIZE;
|
|
261
|
+
}
|
|
262
|
+
let thresholdRatio = (antimeridianX - source.x) / (targetPosition.x - source.x);
|
|
263
|
+
if (previousRatio <= thresholdRatio && nextRatio > thresholdRatio) {
|
|
264
|
+
isValid = 0.0;
|
|
265
|
+
indexDirection = sign(segmentRatio - thresholdRatio);
|
|
266
|
+
segmentRatio = thresholdRatio;
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
nextRatio = select(nextRatio, previousRatio, indexDirection < 0.0);
|
|
271
|
+
var currentPosition = interpolateFlat(
|
|
272
|
+
source,
|
|
273
|
+
targetPosition,
|
|
274
|
+
segmentRatio,
|
|
275
|
+
attributes.instanceHeights,
|
|
276
|
+
attributes.instanceTilts
|
|
277
|
+
);
|
|
278
|
+
var nextPosition = interpolateFlat(
|
|
279
|
+
source,
|
|
280
|
+
targetPosition,
|
|
281
|
+
nextRatio,
|
|
282
|
+
attributes.instanceHeights,
|
|
283
|
+
attributes.instanceTilts
|
|
284
|
+
);
|
|
285
|
+
|
|
286
|
+
if (arc.useShortestPath != 0.0 && nextPosition.x < antimeridianX) {
|
|
287
|
+
currentPosition.x += TILE_SIZE;
|
|
288
|
+
nextPosition.x += TILE_SIZE;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
currentClip = project_common_position_to_clipspace(vec4<f32>(currentPosition, 1.0));
|
|
292
|
+
nextClip = project_common_position_to_clipspace(vec4<f32>(nextPosition, 1.0));
|
|
293
|
+
geometry.position = vec4<f32>(currentPosition, 1.0);
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
geometry.uv = vec2<f32>(segmentRatio, segmentSide);
|
|
297
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(instanceIndex);
|
|
298
|
+
|
|
299
|
+
let widthPixels = clamp(
|
|
300
|
+
project_unit_size_to_pixel(attributes.instanceWidths * arc.widthScale, arc.widthUnits),
|
|
301
|
+
arc.widthMinPixels,
|
|
302
|
+
arc.widthMaxPixels
|
|
303
|
+
);
|
|
304
|
+
#ifdef ANTIALIASING
|
|
305
|
+
var offset = getExtrusionOffset(
|
|
306
|
+
#else
|
|
307
|
+
let offset = getExtrusionOffset(
|
|
308
|
+
#endif
|
|
309
|
+
(nextClip.xy - currentClip.xy) * indexDirection,
|
|
310
|
+
segmentSide,
|
|
311
|
+
widthPixels
|
|
312
|
+
);
|
|
313
|
+
#ifdef ANTIALIASING
|
|
314
|
+
let halfWidthPixels = length(offset);
|
|
315
|
+
if (halfWidthPixels > 0.0) {
|
|
316
|
+
// Keep the declared edge at abs(uv.y) == 1 while rasterizing the outer half of the centered
|
|
317
|
+
// one-device-pixel coverage ramp.
|
|
318
|
+
let coverageScale = 1.0 + 0.5 / project.devicePixelRatio / halfWidthPixels;
|
|
319
|
+
offset *= coverageScale;
|
|
320
|
+
geometry.uv.y *= coverageScale;
|
|
321
|
+
}
|
|
322
|
+
#endif
|
|
323
|
+
|
|
324
|
+
var output: Varyings;
|
|
325
|
+
output.position = currentClip + vec4<f32>(project_pixel_size_to_clipspace(offset), 0.0, 0.0);
|
|
326
|
+
let color = mix(attributes.instanceSourceColors, attributes.instanceTargetColors, segmentRatio);
|
|
327
|
+
output.color = vec4<f32>(color.rgb, color.a * layer.opacity);
|
|
328
|
+
output.uv = geometry.uv;
|
|
329
|
+
output.pickingColor = geometry.pickingColor;
|
|
330
|
+
output.isValid = isValid;
|
|
331
|
+
return output;
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
@fragment
|
|
335
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
336
|
+
#ifdef ANTIALIASING
|
|
337
|
+
let edgeCoord = abs(varyings.uv.y);
|
|
338
|
+
let edgePixels = (1.0 - edgeCoord) / max(fwidth(edgeCoord), 1e-6);
|
|
339
|
+
#endif
|
|
340
|
+
|
|
341
|
+
if (varyings.isValid == 0.0) {
|
|
342
|
+
discard;
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
#ifdef ANTIALIASING
|
|
346
|
+
// Fragments outside the coverage ramp must not write depth or picking colors.
|
|
347
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
348
|
+
discard;
|
|
349
|
+
}
|
|
350
|
+
#endif
|
|
351
|
+
var color = varyings.color;
|
|
352
|
+
#ifdef ANTIALIASING
|
|
353
|
+
// Feather one device pixel across the width. Arc segments meet lengthwise, so only soften the
|
|
354
|
+
// two outer edges of the strip.
|
|
355
|
+
color.a *= smoothedge(0.0, edgePixels);
|
|
356
|
+
#endif
|
|
357
|
+
if (picking.isActive > 0.5) {
|
|
358
|
+
if (!picking_isColorValid(varyings.pickingColor)) {
|
|
359
|
+
discard;
|
|
360
|
+
}
|
|
361
|
+
return vec4<f32>(varyings.pickingColor, 1.0);
|
|
362
|
+
}
|
|
363
|
+
if (picking.isHighlightActive > 0.5) {
|
|
364
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
365
|
+
if (picking_isColorZero(abs(varyings.pickingColor - highlightedObjectColor))) {
|
|
366
|
+
let highlightAlpha = picking.highlightColor.a;
|
|
367
|
+
let blendedAlpha = highlightAlpha + color.a * (1.0 - highlightAlpha);
|
|
368
|
+
if (blendedAlpha > 0.0) {
|
|
369
|
+
let highlightRatio = highlightAlpha / blendedAlpha;
|
|
370
|
+
color = vec4<f32>(
|
|
371
|
+
mix(color.rgb, picking.highlightColor.rgb, highlightRatio),
|
|
372
|
+
blendedAlpha
|
|
373
|
+
);
|
|
374
|
+
}
|
|
375
|
+
}
|
|
376
|
+
}
|
|
377
|
+
return deckgl_premultiplied_alpha(color);
|
|
378
|
+
}
|
|
379
|
+
`;var ei=`#version 300 es
|
|
380
|
+
#define SHADER_NAME arc-layer-vertex-shader
|
|
381
|
+
in vec4 instanceSourceColors;
|
|
382
|
+
in vec4 instanceTargetColors;
|
|
383
|
+
in vec3 instanceSourcePositions;
|
|
384
|
+
in vec3 instanceSourcePositions64Low;
|
|
385
|
+
in vec3 instanceTargetPositions;
|
|
386
|
+
in vec3 instanceTargetPositions64Low;
|
|
387
|
+
in float instanceWidths;
|
|
388
|
+
in float instanceHeights;
|
|
389
|
+
in float instanceTilts;
|
|
390
|
+
out vec4 vColor;
|
|
391
|
+
out vec2 uv;
|
|
392
|
+
out float isValid;
|
|
393
|
+
float paraboloid(float distance, float sourceZ, float targetZ, float ratio) {
|
|
394
|
+
float deltaZ = targetZ - sourceZ;
|
|
395
|
+
float dh = distance * instanceHeights;
|
|
396
|
+
if (dh == 0.0) {
|
|
397
|
+
return sourceZ + deltaZ * ratio;
|
|
398
|
+
}
|
|
399
|
+
float unitZ = deltaZ / dh;
|
|
400
|
+
float p2 = unitZ * unitZ + 1.0;
|
|
401
|
+
float dir = step(deltaZ, 0.0);
|
|
402
|
+
float z0 = mix(sourceZ, targetZ, dir);
|
|
403
|
+
float r = mix(ratio, 1.0 - ratio, dir);
|
|
404
|
+
return sqrt(r * (p2 - r)) * dh + z0;
|
|
405
|
+
}
|
|
406
|
+
vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction, float width) {
|
|
407
|
+
vec2 dir_screenspace = normalize(line_clipspace * project.viewportSize);
|
|
408
|
+
dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
|
|
409
|
+
return dir_screenspace * offset_direction * width / 2.0;
|
|
410
|
+
}
|
|
411
|
+
float getSegmentRatio(float index) {
|
|
412
|
+
return smoothstep(0.0, 1.0, index / (arc.numSegments - 1.0));
|
|
413
|
+
}
|
|
414
|
+
vec3 interpolateFlat(vec3 source, vec3 target, float segmentRatio) {
|
|
415
|
+
float distance = length(source.xy - target.xy);
|
|
416
|
+
float z = paraboloid(distance, source.z, target.z, segmentRatio);
|
|
417
|
+
float tiltAngle = radians(instanceTilts);
|
|
418
|
+
vec2 tiltDirection = normalize(target.xy - source.xy);
|
|
419
|
+
vec2 tilt = vec2(-tiltDirection.y, tiltDirection.x) * z * sin(tiltAngle);
|
|
420
|
+
return vec3(
|
|
421
|
+
mix(source.xy, target.xy, segmentRatio) + tilt,
|
|
422
|
+
z * cos(tiltAngle)
|
|
423
|
+
);
|
|
424
|
+
}
|
|
425
|
+
float getAngularDist (vec2 source, vec2 target) {
|
|
426
|
+
vec2 sourceRadians = radians(source);
|
|
427
|
+
vec2 targetRadians = radians(target);
|
|
428
|
+
vec2 sin_half_delta = sin((sourceRadians - targetRadians) / 2.0);
|
|
429
|
+
vec2 shd_sq = sin_half_delta * sin_half_delta;
|
|
430
|
+
float a = shd_sq.y + cos(sourceRadians.y) * cos(targetRadians.y) * shd_sq.x;
|
|
431
|
+
return 2.0 * asin(sqrt(a));
|
|
432
|
+
}
|
|
433
|
+
vec3 interpolateGreatCircle(vec3 source, vec3 target, vec3 source3D, vec3 target3D, float angularDist, float t) {
|
|
434
|
+
vec2 lngLat;
|
|
435
|
+
if(abs(angularDist - PI) < 0.001) {
|
|
436
|
+
lngLat = (1.0 - t) * source.xy + t * target.xy;
|
|
437
|
+
} else {
|
|
438
|
+
float a = sin((1.0 - t) * angularDist);
|
|
439
|
+
float b = sin(t * angularDist);
|
|
440
|
+
vec3 p = source3D.yxz * a + target3D.yxz * b;
|
|
441
|
+
lngLat = degrees(vec2(atan(p.y, -p.x), atan(p.z, length(p.xy))));
|
|
442
|
+
}
|
|
443
|
+
float z = paraboloid(angularDist * EARTH_RADIUS, source.z, target.z, t);
|
|
444
|
+
return vec3(lngLat, z);
|
|
445
|
+
}
|
|
446
|
+
void main(void) {
|
|
447
|
+
geometry.worldPosition = instanceSourcePositions;
|
|
448
|
+
geometry.worldPositionAlt = instanceTargetPositions;
|
|
449
|
+
float segmentIndex = float(gl_VertexID / 2);
|
|
450
|
+
float segmentSide = mod(float(gl_VertexID), 2.) == 0. ? -1. : 1.;
|
|
451
|
+
float segmentRatio = getSegmentRatio(segmentIndex);
|
|
452
|
+
float prevSegmentRatio = getSegmentRatio(max(0.0, segmentIndex - 1.0));
|
|
453
|
+
float nextSegmentRatio = getSegmentRatio(min(arc.numSegments - 1.0, segmentIndex + 1.0));
|
|
454
|
+
float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));
|
|
455
|
+
isValid = 1.0;
|
|
456
|
+
uv = vec2(segmentRatio, segmentSide);
|
|
457
|
+
geometry.uv = uv;
|
|
458
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
459
|
+
vec4 curr;
|
|
460
|
+
vec4 next;
|
|
461
|
+
vec3 source;
|
|
462
|
+
vec3 target;
|
|
463
|
+
if ((arc.greatCircle || project.projectionMode == PROJECTION_MODE_GLOBE) && project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
|
|
464
|
+
source = project_globe_(vec3(instanceSourcePositions.xy, 0.0));
|
|
465
|
+
target = project_globe_(vec3(instanceTargetPositions.xy, 0.0));
|
|
466
|
+
float angularDist = getAngularDist(instanceSourcePositions.xy, instanceTargetPositions.xy);
|
|
467
|
+
vec3 prevPos = interpolateGreatCircle(instanceSourcePositions, instanceTargetPositions, source, target, angularDist, prevSegmentRatio);
|
|
468
|
+
vec3 currPos = interpolateGreatCircle(instanceSourcePositions, instanceTargetPositions, source, target, angularDist, segmentRatio);
|
|
469
|
+
vec3 nextPos = interpolateGreatCircle(instanceSourcePositions, instanceTargetPositions, source, target, angularDist, nextSegmentRatio);
|
|
470
|
+
if (abs(currPos.x - prevPos.x) > 180.0) {
|
|
471
|
+
indexDir = -1.0;
|
|
472
|
+
isValid = 0.0;
|
|
473
|
+
} else if (abs(currPos.x - nextPos.x) > 180.0) {
|
|
474
|
+
indexDir = 1.0;
|
|
475
|
+
isValid = 0.0;
|
|
476
|
+
}
|
|
477
|
+
nextPos = indexDir < 0.0 ? prevPos : nextPos;
|
|
478
|
+
nextSegmentRatio = indexDir < 0.0 ? prevSegmentRatio : nextSegmentRatio;
|
|
479
|
+
if (isValid == 0.0) {
|
|
480
|
+
nextPos.x += nextPos.x > 0.0 ? -360.0 : 360.0;
|
|
481
|
+
float t = ((currPos.x > 0.0 ? 180.0 : -180.0) - currPos.x) / (nextPos.x - currPos.x);
|
|
482
|
+
currPos = mix(currPos, nextPos, t);
|
|
483
|
+
segmentRatio = mix(segmentRatio, nextSegmentRatio, t);
|
|
484
|
+
}
|
|
485
|
+
vec3 currPos64Low = mix(instanceSourcePositions64Low, instanceTargetPositions64Low, segmentRatio);
|
|
486
|
+
vec3 nextPos64Low = mix(instanceSourcePositions64Low, instanceTargetPositions64Low, nextSegmentRatio);
|
|
487
|
+
curr = project_position_to_clipspace(currPos, currPos64Low, vec3(0.0), geometry.position);
|
|
488
|
+
next = project_position_to_clipspace(nextPos, nextPos64Low, vec3(0.0));
|
|
489
|
+
} else {
|
|
490
|
+
vec3 source_world = instanceSourcePositions;
|
|
491
|
+
vec3 target_world = instanceTargetPositions;
|
|
492
|
+
if (arc.useShortestPath) {
|
|
493
|
+
source_world.x = mod(source_world.x + 180., 360.0) - 180.;
|
|
494
|
+
target_world.x = mod(target_world.x + 180., 360.0) - 180.;
|
|
495
|
+
float deltaLng = target_world.x - source_world.x;
|
|
496
|
+
if (deltaLng > 180.) target_world.x -= 360.;
|
|
497
|
+
if (deltaLng < -180.) source_world.x -= 360.;
|
|
498
|
+
}
|
|
499
|
+
source = project_position(source_world, instanceSourcePositions64Low);
|
|
500
|
+
target = project_position(target_world, instanceTargetPositions64Low);
|
|
501
|
+
float antiMeridianX = 0.0;
|
|
502
|
+
if (arc.useShortestPath) {
|
|
503
|
+
if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
|
|
504
|
+
antiMeridianX = -(project.coordinateOrigin.x + 180.) / 360. * TILE_SIZE;
|
|
505
|
+
}
|
|
506
|
+
float thresholdRatio = (antiMeridianX - source.x) / (target.x - source.x);
|
|
507
|
+
if (prevSegmentRatio <= thresholdRatio && nextSegmentRatio > thresholdRatio) {
|
|
508
|
+
isValid = 0.0;
|
|
509
|
+
indexDir = sign(segmentRatio - thresholdRatio);
|
|
510
|
+
segmentRatio = thresholdRatio;
|
|
511
|
+
}
|
|
512
|
+
}
|
|
513
|
+
nextSegmentRatio = indexDir < 0.0 ? prevSegmentRatio : nextSegmentRatio;
|
|
514
|
+
vec3 currPos = interpolateFlat(source, target, segmentRatio);
|
|
515
|
+
vec3 nextPos = interpolateFlat(source, target, nextSegmentRatio);
|
|
516
|
+
if (arc.useShortestPath) {
|
|
517
|
+
if (nextPos.x < antiMeridianX) {
|
|
518
|
+
currPos.x += TILE_SIZE;
|
|
519
|
+
nextPos.x += TILE_SIZE;
|
|
520
|
+
}
|
|
521
|
+
}
|
|
522
|
+
curr = project_common_position_to_clipspace(vec4(currPos, 1.0));
|
|
523
|
+
next = project_common_position_to_clipspace(vec4(nextPos, 1.0));
|
|
524
|
+
geometry.position = vec4(currPos, 1.0);
|
|
525
|
+
}
|
|
526
|
+
float widthPixels = clamp(
|
|
527
|
+
project_size_to_pixel(instanceWidths * arc.widthScale, arc.widthUnits),
|
|
528
|
+
arc.widthMinPixels, arc.widthMaxPixels
|
|
529
|
+
);
|
|
530
|
+
vec3 offset = vec3(
|
|
531
|
+
getExtrusionOffset((next.xy - curr.xy) * indexDir, segmentSide, widthPixels),
|
|
532
|
+
0.0);
|
|
533
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
534
|
+
#ifdef ANTIALIASING
|
|
535
|
+
float halfWidthPixels = length(offset.xy);
|
|
536
|
+
if (halfWidthPixels > 0.0) {
|
|
537
|
+
float coverageScale = 1.0 + 0.5 / project.devicePixelRatio / halfWidthPixels;
|
|
538
|
+
offset.xy *= coverageScale;
|
|
539
|
+
uv.y *= coverageScale;
|
|
540
|
+
}
|
|
541
|
+
geometry.uv = uv;
|
|
542
|
+
#endif
|
|
543
|
+
DECKGL_FILTER_GL_POSITION(curr, geometry);
|
|
544
|
+
gl_Position = curr + vec4(project_pixel_size_to_clipspace(offset.xy), 0.0, 0.0);
|
|
545
|
+
vec4 color = mix(instanceSourceColors, instanceTargetColors, segmentRatio);
|
|
546
|
+
vColor = vec4(color.rgb, color.a * layer.opacity);
|
|
547
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
548
|
+
}
|
|
549
|
+
`;var ti=`#version 300 es
|
|
550
|
+
#define SHADER_NAME arc-layer-fragment-shader
|
|
551
|
+
precision highp float;
|
|
552
|
+
in vec4 vColor;
|
|
553
|
+
in vec2 uv;
|
|
554
|
+
in float isValid;
|
|
555
|
+
out vec4 fragColor;
|
|
556
|
+
void main(void) {
|
|
557
|
+
#ifdef ANTIALIASING
|
|
558
|
+
float edgeCoord = abs(uv.y);
|
|
559
|
+
float edgePixels = (1.0 - edgeCoord) / max(fwidth(edgeCoord), 1e-6);
|
|
560
|
+
#endif
|
|
561
|
+
if (isValid == 0.0) {
|
|
562
|
+
discard;
|
|
563
|
+
}
|
|
564
|
+
#ifdef ANTIALIASING
|
|
565
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
566
|
+
discard;
|
|
567
|
+
}
|
|
568
|
+
#endif
|
|
569
|
+
fragColor = vColor;
|
|
570
|
+
geometry.uv = uv;
|
|
571
|
+
#ifdef ANTIALIASING
|
|
572
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
573
|
+
#endif
|
|
574
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
575
|
+
}
|
|
576
|
+
`;var tt=[0,0,0,255];var un={getSourcePosition:{type:`accessor`,value:i=>i.sourcePosition},getTargetPosition:{type:`accessor`,value:i=>i.targetPosition},getSourceColor:{type:`accessor`,value:tt},getTargetColor:{type:`accessor`,value:tt},getWidth:{type:`accessor`,value:1},getHeight:{type:`accessor`,value:1},getTilt:{type:`accessor`,value:0},greatCircle:!1,numSegments:{type:`number`,value:50,min:1},widthUnits:`pixels`,widthScale:{type:`number`,value:1,min:0},widthMinPixels:{type:`number`,value:0,min:0},widthMaxPixels:{type:`number`,value:Number.MAX_SAFE_INTEGER,min:0},antialiasing:!1};var ce=class extends ao{getBounds(){return this.getAttributeManager()?.getBounds([`instanceSourcePositions`,`instanceTargetPositions`])}getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:ei,fs:ti,source:Qt,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,qt]})}get wrapLongitude(){return!1}initializeState(){this.getAttributeManager().addInstanced({instanceSourcePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getSourcePosition`},instanceTargetPositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getTargetPosition`},instanceSourceColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getSourceColor`,defaultValue:tt},instanceTargetColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getTargetColor`,defaultValue:tt},instanceWidths:{size:1,transition:!0,accessor:`getWidth`,defaultValue:1},instanceHeights:{size:1,transition:!0,accessor:`getHeight`,defaultValue:1},instanceTilts:{size:1,transition:!0,accessor:`getTilt`,defaultValue:0}})}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e;(n.extensionsChanged||t.antialiasing!==o.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{widthUnits:t,widthScale:o,widthMinPixels:n,widthMaxPixels:s,greatCircle:r,wrapLongitude:a,numSegments:l}=this.props,c={numSegments:l,widthUnits:ee[t],widthScale:o,widthMinPixels:n,widthMaxPixels:s,greatCircle:r,useShortestPath:a},f=this.state.model;f.shaderInputs.setProps({arc:c}),f.setVertexCount(l*2),f.draw(this.context.renderPass)}_getModel(){return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),topology:`triangle-strip`,isInstanced:!0}))}};ce.layerName=`ArcLayer`;ce.defaultProps=un;var gn=ce;var hn=new Uint32Array([0,2,1,0,3,2]);var xn=new Float32Array([0,1,0,0,1,0,1,1]);function bt(i,e){if(!e)return vn(i);let t=Math.max(Math.abs(i[0][0]-i[3][0]),Math.abs(i[1][0]-i[2][0])),o=Math.max(Math.abs(i[1][1]-i[0][1]),Math.abs(i[2][1]-i[3][1])),n=Math.ceil(t/e)+1,s=Math.ceil(o/e)+1,r=(n-1)*(s-1)*6,a=new Uint32Array(r),l=new Float32Array(n*s*2),c=new Float64Array(n*s*3),f=0,d=0;for(let p=0;p<n;p++){let u=p/(n-1);for(let g=0;g<s;g++){let h=g/(s-1),v=mn(i,u,h);c[f*3+0]=v[0],c[f*3+1]=v[1],c[f*3+2]=v[2]||0,l[f*2+0]=u,l[f*2+1]=1-h,p>0&&g>0&&(a[d++]=f-s,a[d++]=f-s-1,a[d++]=f-1,a[d++]=f-s,a[d++]=f-1,a[d++]=f),f++}}return{vertexCount:r,positions:c,indices:a,texCoords:l}}function vn(i){let e=new Float64Array(12);for(let t=0;t<i.length;t++)e[t*3+0]=i[t][0],e[t*3+1]=i[t][1],e[t*3+2]=i[t][2]||0;return{vertexCount:6,positions:e,indices:hn,texCoords:xn}}function mn(i,e,t){return Oi$1(Oi$1(i[0],i[1],t),Oi$1(i[3],i[2],t),e)}var yn=`
|
|
577
|
+
struct BitmapUniforms {
|
|
578
|
+
bounds: vec4<f32>,
|
|
579
|
+
coordinateConversion: f32,
|
|
580
|
+
desaturate: f32,
|
|
581
|
+
tintColor: vec3<f32>,
|
|
582
|
+
transparentColor: vec4<f32>,
|
|
583
|
+
};
|
|
584
|
+
|
|
585
|
+
@group(0) @binding(auto) var<uniform> bitmap: BitmapUniforms;
|
|
586
|
+
@group(0) @binding(auto) var bitmapTexture: texture_2d<f32>;
|
|
587
|
+
@group(0) @binding(auto) var bitmapTextureSampler: sampler;
|
|
588
|
+
`;var ii=`layout(std140) uniform bitmapUniforms {
|
|
589
|
+
vec4 bounds;
|
|
590
|
+
float coordinateConversion;
|
|
591
|
+
float desaturate;
|
|
592
|
+
vec3 tintColor;
|
|
593
|
+
vec4 transparentColor;
|
|
594
|
+
} bitmap;
|
|
595
|
+
`;var oi={name:`bitmap`,source:yn,vs:ii,fs:ii,uniformTypes:{bounds:`vec4<f32>`,coordinateConversion:`f32`,desaturate:`f32`,tintColor:`vec3<f32>`,transparentColor:`vec4<f32>`}};var ni=`struct Attributes {
|
|
596
|
+
@location(0) positions: vec3<f32>,
|
|
597
|
+
@location(1) positions64Low: vec3<f32>,
|
|
598
|
+
@location(2) texCoords: vec2<f32>,
|
|
599
|
+
};
|
|
600
|
+
|
|
601
|
+
struct Varyings {
|
|
602
|
+
@builtin(position) position: vec4<f32>,
|
|
603
|
+
@location(0) vTexCoord: vec2<f32>,
|
|
604
|
+
@location(1) vTexPos: vec2<f32>,
|
|
605
|
+
@location(2) pickingColor: vec3<f32>,
|
|
606
|
+
@location(3) pickingDepth: f32,
|
|
607
|
+
};
|
|
608
|
+
|
|
609
|
+
// from degrees to Web Mercator
|
|
610
|
+
fn lnglat_to_mercator(lnglat: vec2<f32>) -> vec2<f32> {
|
|
611
|
+
let x = lnglat.x;
|
|
612
|
+
let y = clamp(lnglat.y, -89.9, 89.9);
|
|
613
|
+
return vec2<f32>(
|
|
614
|
+
radians(x) + PI,
|
|
615
|
+
PI + log(tan(PI * 0.25 + radians(y) * 0.5))
|
|
616
|
+
) * WORLD_SCALE;
|
|
617
|
+
}
|
|
618
|
+
|
|
619
|
+
// from Web Mercator to degrees
|
|
620
|
+
fn mercator_to_lnglat(xy: vec2<f32>) -> vec2<f32> {
|
|
621
|
+
let position = xy / WORLD_SCALE;
|
|
622
|
+
return degrees(vec2<f32>(
|
|
623
|
+
position.x - PI,
|
|
624
|
+
atan(exp(position.y - PI)) * 2.0 - PI * 0.5
|
|
625
|
+
));
|
|
626
|
+
}
|
|
627
|
+
|
|
628
|
+
fn color_desaturate(colorValue: vec3<f32>) -> vec3<f32> {
|
|
629
|
+
let luminance = (colorValue.r + colorValue.g + colorValue.b) * 0.333333333;
|
|
630
|
+
return mix(colorValue, vec3<f32>(luminance), bitmap.desaturate);
|
|
631
|
+
}
|
|
632
|
+
|
|
633
|
+
fn color_tint(colorValue: vec3<f32>) -> vec3<f32> {
|
|
634
|
+
return colorValue * bitmap.tintColor;
|
|
635
|
+
}
|
|
636
|
+
|
|
637
|
+
fn apply_opacity(colorValue: vec3<f32>, alpha: f32) -> vec4<f32> {
|
|
638
|
+
if (bitmap.transparentColor.a == 0.0) {
|
|
639
|
+
return vec4<f32>(colorValue, alpha);
|
|
640
|
+
}
|
|
641
|
+
let blendedAlpha = alpha + bitmap.transparentColor.a * (1.0 - alpha);
|
|
642
|
+
let highLightRatio = alpha / blendedAlpha;
|
|
643
|
+
let blendedRGB = mix(bitmap.transparentColor.rgb, colorValue, highLightRatio);
|
|
644
|
+
return vec4<f32>(blendedRGB, blendedAlpha);
|
|
645
|
+
}
|
|
646
|
+
|
|
647
|
+
fn getUV(position: vec2<f32>) -> vec2<f32> {
|
|
648
|
+
return vec2<f32>(
|
|
649
|
+
(position.x - bitmap.bounds[0]) / (bitmap.bounds[2] - bitmap.bounds[0]),
|
|
650
|
+
(position.y - bitmap.bounds[3]) / (bitmap.bounds[1] - bitmap.bounds[3])
|
|
651
|
+
);
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
// Pack the top 12 bits of two normalized floats into three 8-bit values.
|
|
655
|
+
fn packUVsIntoRGB(uv: vec2<f32>) -> vec3<f32> {
|
|
656
|
+
let uv8bit = floor(uv * 256.0);
|
|
657
|
+
let uvFraction = fract(uv * 256.0);
|
|
658
|
+
let uvFraction4bit = floor(uvFraction * 16.0);
|
|
659
|
+
let fractions = uvFraction4bit.x + uvFraction4bit.y * 16.0;
|
|
660
|
+
return vec3<f32>(uv8bit, fractions) / 255.0;
|
|
661
|
+
}
|
|
662
|
+
|
|
663
|
+
@vertex
|
|
664
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
665
|
+
var output: Varyings;
|
|
666
|
+
geometry.worldPosition = attributes.positions;
|
|
667
|
+
geometry.uv = attributes.texCoords;
|
|
668
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(0u);
|
|
669
|
+
|
|
670
|
+
let projectedPosition = project_position_to_clipspace_and_commonspace(
|
|
671
|
+
attributes.positions,
|
|
672
|
+
attributes.positions64Low,
|
|
673
|
+
vec3<f32>(0.0)
|
|
674
|
+
);
|
|
675
|
+
geometry.position = projectedPosition.commonPosition;
|
|
676
|
+
output.position = projectedPosition.clipPosition;
|
|
677
|
+
output.vTexCoord = attributes.texCoords;
|
|
678
|
+
output.vTexPos = vec2<f32>(0.0);
|
|
679
|
+
output.pickingColor = geometry.pickingColor;
|
|
680
|
+
output.pickingDepth = output.position.z / output.position.w;
|
|
681
|
+
|
|
682
|
+
if (bitmap.coordinateConversion < -0.5) {
|
|
683
|
+
output.vTexPos = geometry.position.xy + project.commonOrigin.xy;
|
|
684
|
+
} else if (bitmap.coordinateConversion > 0.5) {
|
|
685
|
+
output.vTexPos = geometry.worldPosition.xy;
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
return output;
|
|
689
|
+
}
|
|
690
|
+
|
|
691
|
+
@fragment
|
|
692
|
+
fn fragmentMain(input: Varyings) -> @location(0) vec4<f32> {
|
|
693
|
+
var uv = input.vTexCoord;
|
|
694
|
+
if (bitmap.coordinateConversion < -0.5) {
|
|
695
|
+
uv = getUV(mercator_to_lnglat(input.vTexPos));
|
|
696
|
+
} else if (bitmap.coordinateConversion > 0.5) {
|
|
697
|
+
uv = getUV(lnglat_to_mercator(input.vTexPos));
|
|
698
|
+
}
|
|
699
|
+
|
|
700
|
+
let bitmapColor = textureSample(bitmapTexture, bitmapTextureSampler, uv);
|
|
701
|
+
var fragColor = apply_opacity(
|
|
702
|
+
color_tint(color_desaturate(bitmapColor.rgb)),
|
|
703
|
+
bitmapColor.a * layer.opacity
|
|
704
|
+
);
|
|
705
|
+
|
|
706
|
+
geometry.uv = uv;
|
|
707
|
+
|
|
708
|
+
if (picking.isActive > 0.5) {
|
|
709
|
+
if (picking.isAttribute > 0.5) {
|
|
710
|
+
return vec4<f32>(input.pickingDepth, 0.0, 0.0, 1.0);
|
|
711
|
+
}
|
|
712
|
+
return vec4<f32>(packUVsIntoRGB(uv), 1.0);
|
|
713
|
+
}
|
|
714
|
+
|
|
715
|
+
if (picking.isHighlightActive > 0.5) {
|
|
716
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
717
|
+
if (picking_isColorZero(abs(input.pickingColor - highlightedObjectColor))) {
|
|
718
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
719
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
720
|
+
if (blendedAlpha > 0.0) {
|
|
721
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
722
|
+
fragColor = vec4<f32>(
|
|
723
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
724
|
+
blendedAlpha
|
|
725
|
+
);
|
|
726
|
+
} else {
|
|
727
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
728
|
+
}
|
|
729
|
+
}
|
|
730
|
+
}
|
|
731
|
+
|
|
732
|
+
return deckgl_premultiplied_alpha(fragColor);
|
|
733
|
+
}
|
|
734
|
+
`;var si=`#version 300 es
|
|
735
|
+
#define SHADER_NAME bitmap-layer-vertex-shader
|
|
736
|
+
|
|
737
|
+
in vec2 texCoords;
|
|
738
|
+
in vec3 positions;
|
|
739
|
+
in vec3 positions64Low;
|
|
740
|
+
|
|
741
|
+
out vec2 vTexCoord;
|
|
742
|
+
out vec2 vTexPos;
|
|
743
|
+
|
|
744
|
+
const vec3 pickingColor = vec3(1.0, 0.0, 0.0);
|
|
745
|
+
|
|
746
|
+
void main(void) {
|
|
747
|
+
geometry.worldPosition = positions;
|
|
748
|
+
geometry.uv = texCoords;
|
|
749
|
+
geometry.pickingColor = pickingColor;
|
|
750
|
+
|
|
751
|
+
gl_Position = project_position_to_clipspace(positions, positions64Low, vec3(0.0), geometry.position);
|
|
752
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
753
|
+
|
|
754
|
+
vTexCoord = texCoords;
|
|
755
|
+
|
|
756
|
+
if (bitmap.coordinateConversion < -0.5) {
|
|
757
|
+
vTexPos = geometry.position.xy + project.commonOrigin.xy;
|
|
758
|
+
} else if (bitmap.coordinateConversion > 0.5) {
|
|
759
|
+
vTexPos = geometry.worldPosition.xy;
|
|
760
|
+
}
|
|
761
|
+
|
|
762
|
+
vec4 color = vec4(0.0);
|
|
763
|
+
DECKGL_FILTER_COLOR(color, geometry);
|
|
764
|
+
}
|
|
765
|
+
`;var ri=`#version 300 es
|
|
766
|
+
#define SHADER_NAME bitmap-layer-fragment-shader
|
|
767
|
+
|
|
768
|
+
#ifdef GL_ES
|
|
769
|
+
precision highp float;
|
|
770
|
+
#endif
|
|
771
|
+
|
|
772
|
+
uniform sampler2D bitmapTexture;
|
|
773
|
+
|
|
774
|
+
in vec2 vTexCoord;
|
|
775
|
+
in vec2 vTexPos;
|
|
776
|
+
|
|
777
|
+
out vec4 fragColor;
|
|
778
|
+
|
|
779
|
+
/* projection utils */
|
|
780
|
+
const float TILE_SIZE = 512.0;
|
|
781
|
+
const float PI = 3.1415926536;
|
|
782
|
+
const float WORLD_SCALE = TILE_SIZE / PI / 2.0;
|
|
783
|
+
|
|
784
|
+
// from degrees to Web Mercator
|
|
785
|
+
vec2 lnglat_to_mercator(vec2 lnglat) {
|
|
786
|
+
float x = lnglat.x;
|
|
787
|
+
float y = clamp(lnglat.y, -89.9, 89.9);
|
|
788
|
+
return vec2(
|
|
789
|
+
radians(x) + PI,
|
|
790
|
+
PI + log(tan(PI * 0.25 + radians(y) * 0.5))
|
|
791
|
+
) * WORLD_SCALE;
|
|
792
|
+
}
|
|
793
|
+
|
|
794
|
+
// from Web Mercator to degrees
|
|
795
|
+
vec2 mercator_to_lnglat(vec2 xy) {
|
|
796
|
+
xy /= WORLD_SCALE;
|
|
797
|
+
return degrees(vec2(
|
|
798
|
+
xy.x - PI,
|
|
799
|
+
atan(exp(xy.y - PI)) * 2.0 - PI * 0.5
|
|
800
|
+
));
|
|
801
|
+
}
|
|
802
|
+
/* End projection utils */
|
|
803
|
+
|
|
804
|
+
// apply desaturation
|
|
805
|
+
vec3 color_desaturate(vec3 color) {
|
|
806
|
+
float luminance = (color.r + color.g + color.b) * 0.333333333;
|
|
807
|
+
return mix(color, vec3(luminance), bitmap.desaturate);
|
|
808
|
+
}
|
|
809
|
+
|
|
810
|
+
// apply tint
|
|
811
|
+
vec3 color_tint(vec3 color) {
|
|
812
|
+
return color * bitmap.tintColor;
|
|
813
|
+
}
|
|
814
|
+
|
|
815
|
+
// blend with background color
|
|
816
|
+
vec4 apply_opacity(vec3 color, float alpha) {
|
|
817
|
+
if (bitmap.transparentColor.a == 0.0) {
|
|
818
|
+
return vec4(color, alpha);
|
|
819
|
+
}
|
|
820
|
+
float blendedAlpha = alpha + bitmap.transparentColor.a * (1.0 - alpha);
|
|
821
|
+
float highLightRatio = alpha / blendedAlpha;
|
|
822
|
+
vec3 blendedRGB = mix(bitmap.transparentColor.rgb, color, highLightRatio);
|
|
823
|
+
return vec4(blendedRGB, blendedAlpha);
|
|
824
|
+
}
|
|
825
|
+
|
|
826
|
+
vec2 getUV(vec2 pos) {
|
|
827
|
+
return vec2(
|
|
828
|
+
(pos.x - bitmap.bounds[0]) / (bitmap.bounds[2] - bitmap.bounds[0]),
|
|
829
|
+
(pos.y - bitmap.bounds[3]) / (bitmap.bounds[1] - bitmap.bounds[3])
|
|
830
|
+
);
|
|
831
|
+
}
|
|
832
|
+
|
|
833
|
+
|
|
834
|
+
vec3 packUVsIntoRGB(vec2 uv) {
|
|
835
|
+
// Extract the top 8 bits. We want values to be truncated down so we can add a fraction
|
|
836
|
+
vec2 uv8bit = floor(uv * 256.);
|
|
837
|
+
|
|
838
|
+
// Calculate the normalized remainders of u and v parts that do not fit into 8 bits
|
|
839
|
+
// Scale and clamp to 0-1 range
|
|
840
|
+
vec2 uvFraction = fract(uv * 256.);
|
|
841
|
+
vec2 uvFraction4bit = floor(uvFraction * 16.);
|
|
842
|
+
|
|
843
|
+
// Remainder can be encoded in blue channel, encode as 4 bits for pixel coordinates
|
|
844
|
+
float fractions = uvFraction4bit.x + uvFraction4bit.y * 16.;
|
|
845
|
+
|
|
846
|
+
return vec3(uv8bit, fractions) / 255.;
|
|
847
|
+
}
|
|
848
|
+
|
|
849
|
+
|
|
850
|
+
void main(void) {
|
|
851
|
+
vec2 uv = vTexCoord;
|
|
852
|
+
if (bitmap.coordinateConversion < -0.5) {
|
|
853
|
+
vec2 lnglat = mercator_to_lnglat(vTexPos);
|
|
854
|
+
uv = getUV(lnglat);
|
|
855
|
+
} else if (bitmap.coordinateConversion > 0.5) {
|
|
856
|
+
vec2 commonPos = lnglat_to_mercator(vTexPos);
|
|
857
|
+
uv = getUV(commonPos);
|
|
858
|
+
}
|
|
859
|
+
vec4 bitmapColor = texture(bitmapTexture, uv);
|
|
860
|
+
|
|
861
|
+
fragColor = apply_opacity(color_tint(color_desaturate(bitmapColor.rgb)), bitmapColor.a * layer.opacity);
|
|
862
|
+
|
|
863
|
+
geometry.uv = uv;
|
|
864
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
865
|
+
|
|
866
|
+
if (bool(picking.isActive) && !bool(picking.isAttribute)) {
|
|
867
|
+
// Since instance information is not used, we can use picking color for pixel index
|
|
868
|
+
fragColor.rgb = packUVsIntoRGB(uv);
|
|
869
|
+
}
|
|
870
|
+
}
|
|
871
|
+
`;var _n={image:{type:`image`,value:null,async:!0},bounds:{type:`array`,value:[1,0,0,1],compare:!0},_imageCoordinateSystem:`default`,desaturate:{type:`number`,min:0,max:1,value:0},transparentColor:{type:`color`,value:[0,0,0,0]},tintColor:{type:`color`,value:[255,255,255]},textureParameters:{type:`object`,ignore:!0,value:null}};var fe=class extends ao{getShaders(){return super.getShaders({vs:si,fs:ri,source:ni,modules:[ma,Wa,Ka,oi]})}initializeState(){let e=this.getAttributeManager(),t=!0;e.add({indices:{size:1,isIndexed:!0,update:o=>o.value=this.state.mesh.indices,noAlloc:t},positions:{size:3,type:`float64`,fp64:this.use64bitPositions(),update:o=>o.value=this.state.mesh.positions,noAlloc:t},texCoords:{size:2,update:o=>o.value=this.state.mesh.texCoords,noAlloc:t}})}updateState({props:e,oldProps:t,changeFlags:o}){let n=this.getAttributeManager();if(o.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),n.invalidateAll()),e.bounds!==t.bounds){let s=this.state.mesh,r$1=this._createMesh();this.state.model.setVertexCount(r$1.vertexCount);for(let a in r$1)s&&s[a]!==r$1[a]&&n.invalidate(a);this.setState(r({mesh:r$1},this._getCoordinateUniforms()))}else e._imageCoordinateSystem!==t._imageCoordinateSystem&&this.setState(this._getCoordinateUniforms())}getPickingInfo(e){let{image:t}=this.props,o=e.info;if(!o.color||!t)return o.bitmap=null,o;let{width:n,height:s}=t;o.index=0;let r=Sn(o.color);return o.bitmap={size:{width:n,height:s},uv:r,pixel:[Math.floor(r[0]*n),Math.floor(r[1]*s)]},o}disablePickingIndex(){this.setState({disablePicking:!0})}restorePickingColors(){this.setState({disablePicking:!1})}_updateAutoHighlight(e){super._updateAutoHighlight(s(r({},e),{color:this.encodePickingColor(0)}))}_createMesh(){let{bounds:e}=this.props,t=e;return ai(e)&&(t=[[e[0],e[1]],[e[0],e[3]],[e[2],e[3]],[e[2],e[1]]]),bt(t,this.context.viewport.resolution)}_getModel(){let e=this.context.device.type===`webgpu`?this.getAttributeManager().getBufferLayouts({isInstanced:!1}).filter(t=>t.name!==`indices`):this.getAttributeManager().getBufferLayouts();return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:e,topology:`triangle-list`,isInstanced:!1}))}draw(e){let{shaderModuleProps:t}=e,{model:o,coordinateConversion:n,bounds:s,disablePicking:r}=this.state,{image:a,desaturate:l,transparentColor:c,tintColor:f}=this.props;if(!(t.picking.isActive&&r)&&a&&o){let d={bitmapTexture:a,bounds:s,coordinateConversion:n,desaturate:l,tintColor:f.slice(0,3).map(p=>p/255),transparentColor:c.map(p=>p/255)};o.shaderInputs.setProps({bitmap:d}),o.draw(this.context.renderPass)}}_getCoordinateUniforms(){let{_imageCoordinateSystem:e}=this.props;if(e!=="default"){let{bounds:t}=this.props;if(!ai(t))throw new Error(`_imageCoordinateSystem only supports rectangular bounds`);let o=this.context.viewport.resolution?`lnglat`:`cartesian`;if(e=e===`lnglat`?`lnglat`:`cartesian`,e===`lnglat`&&o===`cartesian`)return{coordinateConversion:-1,bounds:t};if(e===`cartesian`&&o===`lnglat`){let n=nt$1([t[0],t[1]]),s=nt$1([t[2],t[3]]);return{coordinateConversion:1,bounds:[n[0],n[1],s[0],s[1]]}}}return{coordinateConversion:0,bounds:[0,0,0,0]}}};fe.layerName=`BitmapLayer`;fe.defaultProps=_n;var Cn=fe;function Sn(i){let[e,t,o]=i,n=(o&240)/256;return[(e+(o&15)/16)/256,(t+n)/256]}function ai(i){return Number.isFinite(i[0])}var li=`layout(std140) uniform iconUniforms {
|
|
872
|
+
float sizeScale;
|
|
873
|
+
vec2 iconsTextureDim;
|
|
874
|
+
float sizeBasis;
|
|
875
|
+
float sizeMinPixels;
|
|
876
|
+
float sizeMaxPixels;
|
|
877
|
+
bool billboard;
|
|
878
|
+
highp int sizeUnits;
|
|
879
|
+
float alphaCutoff;
|
|
880
|
+
} icon;
|
|
881
|
+
`;var ci={name:`icon`,vs:li,fs:li,uniformTypes:{sizeScale:`f32`,iconsTextureDim:`vec2<f32>`,sizeBasis:`f32`,sizeMinPixels:`f32`,sizeMaxPixels:`f32`,billboard:`f32`,sizeUnits:`i32`,alphaCutoff:`f32`}};var fi=`#version 300 es
|
|
882
|
+
#define SHADER_NAME icon-layer-vertex-shader
|
|
883
|
+
in vec2 positions;
|
|
884
|
+
in vec3 instancePositions;
|
|
885
|
+
in vec3 instancePositions64Low;
|
|
886
|
+
in float instanceSizes;
|
|
887
|
+
in float instanceAngles;
|
|
888
|
+
in vec4 instanceColors;
|
|
889
|
+
#ifdef USE_ROW_INDEXES
|
|
890
|
+
in float rowIndexes;
|
|
891
|
+
#endif
|
|
892
|
+
in vec4 instanceIconFrames;
|
|
893
|
+
in float instanceColorModes;
|
|
894
|
+
in vec2 instanceOffsets;
|
|
895
|
+
in vec2 instancePixelOffset;
|
|
896
|
+
out float vColorMode;
|
|
897
|
+
out vec4 vColor;
|
|
898
|
+
out vec2 vTextureCoords;
|
|
899
|
+
out vec2 uv;
|
|
900
|
+
vec2 rotate_by_angle(vec2 vertex, float angle) {
|
|
901
|
+
float angle_radian = angle * PI / 180.0;
|
|
902
|
+
float cos_angle = cos(angle_radian);
|
|
903
|
+
float sin_angle = sin(angle_radian);
|
|
904
|
+
mat2 rotationMatrix = mat2(cos_angle, -sin_angle, sin_angle, cos_angle);
|
|
905
|
+
return rotationMatrix * vertex;
|
|
906
|
+
}
|
|
907
|
+
void main(void) {
|
|
908
|
+
geometry.worldPosition = instancePositions;
|
|
909
|
+
geometry.uv = positions;
|
|
910
|
+
#ifdef USE_ROW_INDEXES
|
|
911
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(rowIndexes);
|
|
912
|
+
#else
|
|
913
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
914
|
+
#endif
|
|
915
|
+
uv = positions;
|
|
916
|
+
vec2 iconSize = instanceIconFrames.zw;
|
|
917
|
+
float sizePixels = clamp(
|
|
918
|
+
project_size_to_pixel(instanceSizes * icon.sizeScale, icon.sizeUnits),
|
|
919
|
+
icon.sizeMinPixels, icon.sizeMaxPixels
|
|
920
|
+
);
|
|
921
|
+
float iconConstraint = icon.sizeBasis == 0.0 ? iconSize.x : iconSize.y;
|
|
922
|
+
float instanceScale = iconConstraint == 0.0 ? 0.0 : sizePixels / iconConstraint;
|
|
923
|
+
vec2 pixelOffset = positions / 2.0 * iconSize + instanceOffsets;
|
|
924
|
+
pixelOffset = rotate_by_angle(pixelOffset, instanceAngles) * instanceScale;
|
|
925
|
+
pixelOffset += instancePixelOffset;
|
|
926
|
+
pixelOffset.y *= -1.0;
|
|
927
|
+
if (icon.billboard) {
|
|
928
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.0), geometry.position);
|
|
929
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
930
|
+
vec3 offset = vec3(pixelOffset, 0.0);
|
|
931
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
932
|
+
gl_Position.xy += project_pixel_size_to_clipspace(offset.xy);
|
|
933
|
+
} else {
|
|
934
|
+
vec3 offset_common = vec3(project_pixel_size(pixelOffset), 0.0);
|
|
935
|
+
DECKGL_FILTER_SIZE(offset_common, geometry);
|
|
936
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, offset_common, geometry.position);
|
|
937
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
938
|
+
}
|
|
939
|
+
vTextureCoords = mix(
|
|
940
|
+
instanceIconFrames.xy,
|
|
941
|
+
instanceIconFrames.xy + iconSize,
|
|
942
|
+
(positions.xy + 1.0) / 2.0
|
|
943
|
+
) / icon.iconsTextureDim;
|
|
944
|
+
vColor = instanceColors;
|
|
945
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
946
|
+
vColorMode = instanceColorModes;
|
|
947
|
+
}
|
|
948
|
+
`;var di=`#version 300 es
|
|
949
|
+
#define SHADER_NAME icon-layer-fragment-shader
|
|
950
|
+
precision highp float;
|
|
951
|
+
uniform sampler2D iconsTexture;
|
|
952
|
+
in float vColorMode;
|
|
953
|
+
in vec4 vColor;
|
|
954
|
+
in vec2 vTextureCoords;
|
|
955
|
+
in vec2 uv;
|
|
956
|
+
out vec4 fragColor;
|
|
957
|
+
void main(void) {
|
|
958
|
+
geometry.uv = uv;
|
|
959
|
+
vec4 texColor = texture(iconsTexture, vTextureCoords);
|
|
960
|
+
vec3 color = mix(texColor.rgb, vColor.rgb, vColorMode);
|
|
961
|
+
float a = texColor.a * layer.opacity * vColor.a;
|
|
962
|
+
if (a < icon.alphaCutoff) {
|
|
963
|
+
discard;
|
|
964
|
+
}
|
|
965
|
+
fragColor = vec4(color, a);
|
|
966
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
967
|
+
}
|
|
968
|
+
`;var Ln=`struct IconUniforms {
|
|
969
|
+
sizeScale: f32,
|
|
970
|
+
iconsTextureDim: vec2<f32>,
|
|
971
|
+
sizeBasis: f32,
|
|
972
|
+
sizeMinPixels: f32,
|
|
973
|
+
sizeMaxPixels: f32,
|
|
974
|
+
billboard: i32,
|
|
975
|
+
sizeUnits: i32,
|
|
976
|
+
alphaCutoff: f32
|
|
977
|
+
};
|
|
978
|
+
|
|
979
|
+
@group(0) @binding(auto) var<uniform> icon: IconUniforms;
|
|
980
|
+
@group(0) @binding(auto) var iconsTexture : texture_2d<f32>;
|
|
981
|
+
@group(0) @binding(auto) var iconsTextureSampler : sampler;
|
|
982
|
+
|
|
983
|
+
fn rotate_by_angle(vertex: vec2<f32>, angle_deg: f32) -> vec2<f32> {
|
|
984
|
+
let angle_radian = angle_deg * PI / 180.0;
|
|
985
|
+
let c = cos(angle_radian);
|
|
986
|
+
let s = sin(angle_radian);
|
|
987
|
+
let rotation = mat2x2<f32>(vec2<f32>(c, s), vec2<f32>(-s, c));
|
|
988
|
+
return rotation * vertex;
|
|
989
|
+
}
|
|
990
|
+
|
|
991
|
+
struct Attributes {
|
|
992
|
+
@builtin(instance_index) instanceIndex : u32,
|
|
993
|
+
@location(0) positions: vec2<f32>,
|
|
994
|
+
|
|
995
|
+
@location(1) instancePositions: vec3<f32>,
|
|
996
|
+
@location(2) instancePositions64Low: vec3<f32>,
|
|
997
|
+
@location(3) instanceSizes: f32,
|
|
998
|
+
@location(4) instanceAngles: f32,
|
|
999
|
+
@location(5) instanceColors: vec4<f32>,
|
|
1000
|
+
@location(6) instanceIconFrames: vec4<f32>,
|
|
1001
|
+
@location(7) instanceColorModes: f32,
|
|
1002
|
+
@location(8) instanceOffsets: vec2<f32>,
|
|
1003
|
+
@location(9) instancePixelOffset: vec2<f32>,
|
|
1004
|
+
PICKING_COLOR_ATTRIBUTE
|
|
1005
|
+
};
|
|
1006
|
+
|
|
1007
|
+
struct Varyings {
|
|
1008
|
+
@builtin(position) position: vec4<f32>,
|
|
1009
|
+
|
|
1010
|
+
@location(0) vColorMode: f32,
|
|
1011
|
+
@location(1) vColor: vec4<f32>,
|
|
1012
|
+
@location(2) vTextureCoords: vec2<f32>,
|
|
1013
|
+
@location(3) uv: vec2<f32>,
|
|
1014
|
+
@location(4) pickingColor: vec3<f32>,
|
|
1015
|
+
};
|
|
1016
|
+
|
|
1017
|
+
@vertex
|
|
1018
|
+
fn vertexMain(inp: Attributes) -> Varyings {
|
|
1019
|
+
// write geometry fields used by filters + FS
|
|
1020
|
+
geometry.worldPosition = inp.instancePositions;
|
|
1021
|
+
geometry.uv = inp.positions;
|
|
1022
|
+
geometry.pickingColor = PICKING_COLOR_VALUE;
|
|
1023
|
+
|
|
1024
|
+
var outp: Varyings;
|
|
1025
|
+
outp.uv = inp.positions;
|
|
1026
|
+
|
|
1027
|
+
let iconSize = inp.instanceIconFrames.zw;
|
|
1028
|
+
|
|
1029
|
+
// convert size in meters to pixels, then clamp
|
|
1030
|
+
let sizePixels = clamp(
|
|
1031
|
+
project_unit_size_to_pixel(inp.instanceSizes * icon.sizeScale, icon.sizeUnits),
|
|
1032
|
+
icon.sizeMinPixels, icon.sizeMaxPixels
|
|
1033
|
+
);
|
|
1034
|
+
|
|
1035
|
+
// scale icon height to match instanceSize
|
|
1036
|
+
let iconConstraint = select(iconSize.y, iconSize.x, icon.sizeBasis == 0.0);
|
|
1037
|
+
let instanceScale = select(sizePixels / iconConstraint, 0.0, iconConstraint == 0.0);
|
|
1038
|
+
|
|
1039
|
+
// scale and rotate vertex in "pixel" units; then add per-instance pixel offset
|
|
1040
|
+
var pixelOffset = inp.positions / 2.0 * iconSize + inp.instanceOffsets;
|
|
1041
|
+
pixelOffset = rotate_by_angle(pixelOffset, inp.instanceAngles) * instanceScale;
|
|
1042
|
+
pixelOffset = pixelOffset + inp.instancePixelOffset;
|
|
1043
|
+
pixelOffset.y = pixelOffset.y * -1.0;
|
|
1044
|
+
|
|
1045
|
+
if (icon.billboard != 0) {
|
|
1046
|
+
var pos = project_position_to_clipspace(inp.instancePositions, inp.instancePositions64Low, vec3<f32>(0.0)); // TODO, &geometry.position);
|
|
1047
|
+
// DECKGL_FILTER_GL_POSITION(pos, geometry);
|
|
1048
|
+
|
|
1049
|
+
var offset = vec3<f32>(pixelOffset, 0.0);
|
|
1050
|
+
// DECKGL_FILTER_SIZE(offset, geometry);
|
|
1051
|
+
let clipOffset = project_pixel_size_to_clipspace(offset.xy);
|
|
1052
|
+
pos = vec4<f32>(pos.x + clipOffset.x, pos.y + clipOffset.y, pos.z, pos.w);
|
|
1053
|
+
outp.position = pos;
|
|
1054
|
+
} else {
|
|
1055
|
+
var offset_common = vec3<f32>(project_pixel_size_vec2(pixelOffset), 0.0);
|
|
1056
|
+
// DECKGL_FILTER_SIZE(offset_common, geometry);
|
|
1057
|
+
var pos = project_position_to_clipspace(inp.instancePositions, inp.instancePositions64Low, offset_common); // TODO, &geometry.position);
|
|
1058
|
+
// DECKGL_FILTER_GL_POSITION(pos, geometry);
|
|
1059
|
+
outp.position = pos;
|
|
1060
|
+
}
|
|
1061
|
+
|
|
1062
|
+
let uvMix = (inp.positions.xy + vec2<f32>(1.0, 1.0)) * 0.5;
|
|
1063
|
+
outp.vTextureCoords = mix(inp.instanceIconFrames.xy, inp.instanceIconFrames.xy + iconSize, uvMix) / icon.iconsTextureDim;
|
|
1064
|
+
|
|
1065
|
+
outp.vColor = inp.instanceColors;
|
|
1066
|
+
// DECKGL_FILTER_COLOR(outp.vColor, geometry);
|
|
1067
|
+
|
|
1068
|
+
outp.vColorMode = inp.instanceColorModes;
|
|
1069
|
+
outp.pickingColor = geometry.pickingColor;
|
|
1070
|
+
|
|
1071
|
+
return outp;
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
@fragment
|
|
1075
|
+
fn fragmentMain(inp: Varyings) -> @location(0) vec4<f32> {
|
|
1076
|
+
// expose to deck.gl filter hooks
|
|
1077
|
+
geometry.uv = inp.uv;
|
|
1078
|
+
|
|
1079
|
+
let texColor = textureSample(iconsTexture, iconsTextureSampler, inp.vTextureCoords);
|
|
1080
|
+
|
|
1081
|
+
// if colorMode == 0, use pixel color from the texture
|
|
1082
|
+
// if colorMode == 1 (or picking), use texture as transparency mask
|
|
1083
|
+
let rgb = mix(texColor.rgb, inp.vColor.rgb, inp.vColorMode);
|
|
1084
|
+
let a = texColor.a * layer.opacity * inp.vColor.a;
|
|
1085
|
+
|
|
1086
|
+
if (a < icon.alphaCutoff) {
|
|
1087
|
+
discard;
|
|
1088
|
+
}
|
|
1089
|
+
|
|
1090
|
+
if (picking.isActive > 0.5) {
|
|
1091
|
+
if (!picking_isColorValid(inp.pickingColor)) {
|
|
1092
|
+
discard;
|
|
1093
|
+
}
|
|
1094
|
+
return vec4<f32>(inp.pickingColor, 1.0);
|
|
1095
|
+
}
|
|
1096
|
+
|
|
1097
|
+
var fragColor = deckgl_premultiplied_alpha(vec4<f32>(rgb, a));
|
|
1098
|
+
|
|
1099
|
+
if (picking.isHighlightActive > 0.5) {
|
|
1100
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
1101
|
+
if (picking_isColorZero(abs(inp.pickingColor - highlightedObjectColor))) {
|
|
1102
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
1103
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
1104
|
+
if (blendedAlpha > 0.0) {
|
|
1105
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
1106
|
+
fragColor = vec4<f32>(
|
|
1107
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
1108
|
+
blendedAlpha
|
|
1109
|
+
);
|
|
1110
|
+
} else {
|
|
1111
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
1112
|
+
}
|
|
1113
|
+
}
|
|
1114
|
+
}
|
|
1115
|
+
|
|
1116
|
+
return fragColor;
|
|
1117
|
+
}
|
|
1118
|
+
`;function pi(i){return Ln.replace(`PICKING_COLOR_ATTRIBUTE`,i?`@location(10) rowIndexes: u32,`:``).replace(`PICKING_COLOR_VALUE`,i?`picking_getPickingColorFromIndex(inp.rowIndexes)`:`picking_getPickingColorFromIndex(inp.instanceIndex)`)}var bn=1024;var wn=4;var ui=()=>{};var gi={minFilter:`linear`,mipmapFilter:`linear`,magFilter:`linear`,addressModeU:`clamp-to-edge`,addressModeV:`clamp-to-edge`};var In={x:0,y:0,width:0,height:0};function An(i){return Math.pow(2,Math.ceil(Math.log2(i)))}function En(i,e,t,o){let n=Math.min(t/e.width,o/e.height),s=Math.floor(e.width*n),r=Math.floor(e.height*n);return n===1?{image:e,width:s,height:r}:(i.canvas.height=r,i.canvas.width=s,i.clearRect(0,0,s,r),i.drawImage(e,0,0,e.width,e.height,0,0,s,r),{image:i.canvas,width:s,height:r})}function de(i){return i&&(i.id||i.url)}function xi(i){let{device:e}=i;e.type===`webgl`?i.generateMipmapsWebGL():e.type===`webgpu`&&e.generateMipmapsWebGPU(i)}function Tn(i,e,t,o){let{width:n,height:s,device:r}=i,a=r.createTexture({format:`rgba8unorm`,width:e,height:t,sampler:o,mipLevels:r.getMipLevelCount(e,t)}),l=r.createCommandEncoder();l.copyTextureToTexture({sourceTexture:i,destinationTexture:a,width:n,height:s});let c=l.finish();return r.submit(c),xi(a),i.destroy(),a}function hi(i,e,t){for(let o=0;o<e.length;o++){let{icon:n,xOffset:s$1}=e[o],r$2=de(n);i[r$2]=s(r({},n),{x:s$1,y:t})}}function On({icons:i,buffer:e,mapping:t={},xOffset:o=0,yOffset:n=0,rowHeight:s=0,canvasWidth:r}){let a=[];for(let l=0;l<i.length;l++){let c=i[l];if(!t[de(c)]){let{height:d,width:p}=c;o+p+e>r&&(hi(t,a,n),o=0,n=s+n+e,s=0,a=[]),a.push({icon:c,xOffset:o}),o=o+p+e,s=Math.max(s,d)}}return a.length>0&&hi(t,a,n),{mapping:t,rowHeight:s,xOffset:o,yOffset:n,canvasWidth:r,canvasHeight:An(s+n+e)}}function Rn(i,e,t){if(!i||!e)return null;t=t||{};let o={},{iterable:n,objectInfo:s$2}=Yr(i);for(let r$3 of n){s$2.index++;let a=e(r$3,s$2),l=de(a);if(!a)throw new Error(`Icon is missing.`);if(!a.url)throw new Error(`Icon url is missing.`);!o[l]&&(!t[l]||a.url!==t[l].url)&&(o[l]=s(r({},a),{source:r$3,sourceIndex:s$2.index}))}return o}var pe=class{constructor(e,{onUpdate:t=ui,onError:o=ui}){this._loadOptions=null,this._texture=null,this._externalTexture=null,this._mapping={},this._samplerParameters=null,this._pendingCount=0,this._autoPacking=!1,this._xOffset=0,this._yOffset=0,this._rowHeight=0,this._buffer=wn,this._canvasWidth=bn,this._canvasHeight=0,this._canvas=null,this.device=e,this.onUpdate=t,this.onError=o}finalize(){this._texture?.delete()}getTexture(){return this._texture||this._externalTexture}getIconMapping(e){let t=this._autoPacking?de(e):e;return this._mapping[t]||In}setProps({loadOptions:e,autoPacking:t,iconAtlas:o,iconMapping:n,textureParameters:s}){e&&(this._loadOptions=e),t!==void 0&&(this._autoPacking=t),n&&(this._mapping=n),o&&(this._texture?.delete(),this._texture=null,this._externalTexture=o),s&&(this._samplerParameters=s)}get isLoaded(){return this._pendingCount===0}packIcons(e,t){if(!this._autoPacking||typeof document>`u`)return;let o=Object.values(Rn(e,t,this._mapping)||{});if(o.length>0){let{mapping:n,xOffset:s,yOffset:r,rowHeight:a,canvasHeight:l}=On({icons:o,buffer:this._buffer,canvasWidth:this._canvasWidth,mapping:this._mapping,rowHeight:this._rowHeight,xOffset:this._xOffset,yOffset:this._yOffset});this._rowHeight=a,this._mapping=n,this._xOffset=s,this._yOffset=r,this._canvasHeight=l,this._texture||(this._texture=this.device.createTexture({format:`rgba8unorm`,data:null,width:this._canvasWidth,height:this._canvasHeight,sampler:this._samplerParameters||gi,mipLevels:this.device.getMipLevelCount(this._canvasWidth,this._canvasHeight)})),this._texture.height!==this._canvasHeight&&(this._texture=Tn(this._texture,this._canvasWidth,this._canvasHeight,this._samplerParameters||gi)),this.onUpdate(!0),this._canvas=this._canvas||document.createElement(`canvas`),this._loadIcons(o)}}_loadIcons(e){let t=this._canvas.getContext(`2d`,{willReadFrequently:!0});for(let o of e)this._pendingCount++,xe$1(o.url,this._loadOptions).then(n=>{let s=de(o),r=this._mapping[s],{x:a,y:l,width:c,height:f}=r,{image:d,width:p,height:u}=En(t,n,c,f),g=a+(c-p)/2,h=l+(f-u)/2;this._texture?.copyExternalImage({image:d,x:g,y:h,width:p,height:u}),r.x=g,r.y=h,r.width=p,r.height=u,this._texture&&xi(this._texture),this.onUpdate(p!==c||u!==f)}).catch(n=>{this.onError({url:o.url,source:o.source,sourceIndex:o.sourceIndex,loadOptions:this._loadOptions,error:n})}).finally(()=>{this._pendingCount--})}};var vi=[0,0,0,255];var Mn={iconAtlas:{type:`image`,value:null,async:!0},iconMapping:{type:`object`,value:{},async:!0},sizeScale:{type:`number`,value:1,min:0},billboard:!0,sizeUnits:`pixels`,sizeBasis:`height`,sizeMinPixels:{type:`number`,min:0,value:0},sizeMaxPixels:{type:`number`,min:0,value:Number.MAX_SAFE_INTEGER},alphaCutoff:{type:`number`,value:.05,min:0,max:1},getPosition:{type:`accessor`,value:i=>i.position},getIcon:{type:`accessor`,value:i=>i.icon},getColor:{type:`accessor`,value:vi},getSize:{type:`accessor`,value:1},getAngle:{type:`accessor`,value:0},getPixelOffset:{type:`accessor`,value:[0,0]},onIconError:{type:`function`,value:null,optional:!0},textureParameters:{type:`object`,ignore:!0,value:null}};var ue=class extends ao{getShaders(){let e=!!this.props.data?.attributes?.rowIndexes;return super.getShaders({vs:fi,fs:di,source:pi(e),defines:e?{USE_ROW_INDEXES:!0}:{},modules:[Wa,ma,Ka,ci]})}initializeState(){this.state={iconManager:new pe(this.context.device,{onUpdate:this._onUpdate.bind(this),onError:this._onError.bind(this)})},this.getAttributeManager().addInstanced(r({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceSizes:{size:1,transition:!0,bufferGroup:`icon-instance-data`,accessor:`getSize`,defaultValue:1},instanceIconDefs:{size:7,bufferGroup:`icon-instance-data`,accessor:`getIcon`,transform:this.getInstanceIconDef,shaderAttributes:{instanceOffsets:{size:2,elementOffset:0},instanceIconFrames:{size:4,elementOffset:2},instanceColorModes:{size:1,elementOffset:6}}},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,bufferGroup:`icon-instance-data`,accessor:`getColor`,defaultValue:vi},instanceAngles:{size:1,transition:!0,bufferGroup:`icon-instance-data`,accessor:`getAngle`},instancePixelOffset:{size:2,transition:!0,bufferGroup:`icon-instance-data`,accessor:`getPixelOffset`}},this.props.data?.attributes?.rowIndexes?{rowIndexes:{size:1,type:`uint32`,noAlloc:!0}}:{}))}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e,s=this.getAttributeManager(),{iconAtlas:r,iconMapping:a,data:l,getIcon:c,textureParameters:f}=t,{iconManager:d}=this.state;if(typeof r==`string`)return;let p=r||this.internalState.isAsyncPropLoading(`iconAtlas`);d.setProps({loadOptions:t.loadOptions,autoPacking:!p,iconAtlas:r,iconMapping:p?a:null,textureParameters:f}),p?o.iconMapping!==t.iconMapping&&s.invalidate(`getIcon`):(n.dataChanged||n.updateTriggersChanged&&(n.updateTriggersChanged.all||n.updateTriggersChanged.getIcon))&&d.packIcons(l,c),n.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),s.invalidateAll())}get isLoaded(){return super.isLoaded&&this.state.iconManager.isLoaded}finalizeState(e){super.finalizeState(e),this.state.iconManager.finalize()}draw({uniforms:e}){this._drawModel(this.state.model)}_drawModel(e){let{sizeScale:t,sizeBasis:o,sizeMinPixels:n,sizeMaxPixels:s,sizeUnits:r,billboard:a,alphaCutoff:l}=this.props,{iconManager:c}=this.state,f=c.getTexture();if(f){let d={iconsTexture:f,iconsTextureDim:[f.width,f.height],sizeUnits:ee[r],sizeScale:t,sizeBasis:o===`height`?1:0,sizeMinPixels:n,sizeMaxPixels:s,billboard:a,alphaCutoff:l};e.shaderInputs.setProps({icon:d}),e.draw(this.context.renderPass)}}_getModel(e=this.props.id){return new De(this.context.device,s(r({},this.getShaders()),{id:e,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-strip`,attributes:{positions:{size:2,value:new Float32Array([-1,-1,1,-1,-1,1,1,1])}}}),isInstanced:!0}))}_onUpdate(e){e?(this.getAttributeManager()?.invalidate(`getIcon`),this.setNeedsUpdate()):this.setNeedsRedraw()}_onError(e){let t=this.getCurrentLayer()?.props.onIconError;t?t(e):S.error(e.error.message)()}getInstanceIconDef(e){let{x:t,y:o,width:n,height:s,mask:r,anchorX:a=n/2,anchorY:l=s/2}=this.state.iconManager.getIconMapping(e);return[n/2-a,s/2-l,t,o,n,s,r?1:0]}};ue.defaultProps=Mn;ue.layerName=`IconLayer`;var ge=ue;var mi=`layout(std140) uniform lineUniforms {
|
|
1119
|
+
float widthScale;
|
|
1120
|
+
float widthMinPixels;
|
|
1121
|
+
float widthMaxPixels;
|
|
1122
|
+
float useShortestPath;
|
|
1123
|
+
highp int widthUnits;
|
|
1124
|
+
} line;
|
|
1125
|
+
`;var yi={name:`line`,source:``,vs:mi,fs:mi,uniformTypes:{widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,useShortestPath:`f32`,widthUnits:`i32`}};var Pi=`// ---------- Helper Structures & Functions ----------
|
|
1126
|
+
|
|
1127
|
+
// Placeholder filter functions.
|
|
1128
|
+
fn deckgl_filter_size(offset: vec3<f32>, geometry: Geometry) -> vec3<f32> {
|
|
1129
|
+
return offset;
|
|
1130
|
+
}
|
|
1131
|
+
fn deckgl_filter_gl_position(p: vec4<f32>, geometry: Geometry) -> vec4<f32> {
|
|
1132
|
+
if (picking.isAttribute > 0.5) {
|
|
1133
|
+
// For depth picking, write normalized depth into the picking payload.
|
|
1134
|
+
// This mirrors the legacy DECKGL_FILTER_GL_POSITION hook on WebGL.
|
|
1135
|
+
}
|
|
1136
|
+
return p;
|
|
1137
|
+
}
|
|
1138
|
+
|
|
1139
|
+
// Compute an extrusion offset given a line direction (in clipspace),
|
|
1140
|
+
// an offset direction (-1 or 1), and a width in pixels.
|
|
1141
|
+
// Assumes a uniform "project" with a viewportSize field is available.
|
|
1142
|
+
fn getExtrusionOffset(line_clipspace: vec2<f32>, offset_direction: f32, width: f32) -> vec2<f32> {
|
|
1143
|
+
// project.viewportSize should be provided as a uniform (not shown here)
|
|
1144
|
+
let dir_screenspace = normalize(line_clipspace * project.viewportSize);
|
|
1145
|
+
// Rotate by 90\xB0: (x,y) becomes (-y,x)
|
|
1146
|
+
let rotated = vec2<f32>(-dir_screenspace.y, dir_screenspace.x);
|
|
1147
|
+
return rotated * offset_direction * width / 2.0;
|
|
1148
|
+
}
|
|
1149
|
+
|
|
1150
|
+
// Splits the line between two points at a given x coordinate.
|
|
1151
|
+
// Interpolates the y and z components.
|
|
1152
|
+
fn splitLine(a: vec3<f32>, b: vec3<f32>, x: f32) -> vec3<f32> {
|
|
1153
|
+
let t: f32 = (x - a.x) / (b.x - a.x);
|
|
1154
|
+
return vec3<f32>(x, a.yz + t * (b.yz - a.yz));
|
|
1155
|
+
}
|
|
1156
|
+
|
|
1157
|
+
// ---------- Uniforms & Global Structures ----------
|
|
1158
|
+
|
|
1159
|
+
struct LineUniforms {
|
|
1160
|
+
widthScale: f32,
|
|
1161
|
+
widthMinPixels: f32,
|
|
1162
|
+
widthMaxPixels: f32,
|
|
1163
|
+
useShortestPath: f32,
|
|
1164
|
+
widthUnits: i32,
|
|
1165
|
+
};
|
|
1166
|
+
|
|
1167
|
+
@group(0) @binding(0)
|
|
1168
|
+
var<uniform> line: LineUniforms;
|
|
1169
|
+
|
|
1170
|
+
|
|
1171
|
+
|
|
1172
|
+
// ---------- Vertex Output Structure ----------
|
|
1173
|
+
|
|
1174
|
+
struct Varyings {
|
|
1175
|
+
@builtin(position) gl_Position: vec4<f32>,
|
|
1176
|
+
@location(0) vColor: vec4<f32>,
|
|
1177
|
+
@location(1) uv: vec2<f32>,
|
|
1178
|
+
@location(2) pickingColor: vec3<f32>,
|
|
1179
|
+
};
|
|
1180
|
+
|
|
1181
|
+
// ---------- Vertex Shader Entry Point ----------
|
|
1182
|
+
|
|
1183
|
+
@vertex
|
|
1184
|
+
fn vertexMain(
|
|
1185
|
+
@builtin(instance_index) instanceIndex: u32,
|
|
1186
|
+
@location(0) positions: vec3<f32>,
|
|
1187
|
+
@location(1) instanceSourcePositions: vec3<f32>,
|
|
1188
|
+
@location(2) instanceTargetPositions: vec3<f32>,
|
|
1189
|
+
@location(3) instanceSourcePositions64Low: vec3<f32>,
|
|
1190
|
+
@location(4) instanceTargetPositions64Low: vec3<f32>,
|
|
1191
|
+
@location(5) instanceColors: vec4<f32>,
|
|
1192
|
+
@location(6) instanceWidths: f32
|
|
1193
|
+
) -> Varyings {
|
|
1194
|
+
geometry.worldPosition = instanceSourcePositions;
|
|
1195
|
+
geometry.worldPositionAlt = instanceTargetPositions;
|
|
1196
|
+
|
|
1197
|
+
var source_world: vec3<f32> = instanceSourcePositions;
|
|
1198
|
+
var target_world: vec3<f32> = instanceTargetPositions;
|
|
1199
|
+
var source_world_64low: vec3<f32> = instanceSourcePositions64Low;
|
|
1200
|
+
var target_world_64low: vec3<f32> = instanceTargetPositions64Low;
|
|
1201
|
+
|
|
1202
|
+
// Apply shortest-path adjustments if needed.
|
|
1203
|
+
if (line.useShortestPath > 0.5 || line.useShortestPath < -0.5) {
|
|
1204
|
+
source_world.x = (source_world.x + 180.0 % 360.0) - 180.0;
|
|
1205
|
+
target_world.x = (target_world.x + 180.0 % 360.0) - 180.0;
|
|
1206
|
+
let deltaLng: f32 = target_world.x - source_world.x;
|
|
1207
|
+
|
|
1208
|
+
if (deltaLng * line.useShortestPath > 180.0) {
|
|
1209
|
+
source_world.x = source_world.x + 360.0 * line.useShortestPath;
|
|
1210
|
+
source_world = splitLine(source_world, target_world, 180.0 * line.useShortestPath);
|
|
1211
|
+
source_world_64low = vec3<f32>(0.0, 0.0, 0.0);
|
|
1212
|
+
} else if (deltaLng * line.useShortestPath < -180.0) {
|
|
1213
|
+
target_world.x = target_world.x + 360.0 * line.useShortestPath;
|
|
1214
|
+
target_world = splitLine(source_world, target_world, 180.0 * line.useShortestPath);
|
|
1215
|
+
target_world_64low = vec3<f32>(0.0, 0.0, 0.0);
|
|
1216
|
+
} else if (line.useShortestPath < 0.0) {
|
|
1217
|
+
var abortOut: Varyings;
|
|
1218
|
+
abortOut.gl_Position = vec4<f32>(0.0);
|
|
1219
|
+
abortOut.vColor = vec4<f32>(0.0);
|
|
1220
|
+
abortOut.uv = vec2<f32>(0.0);
|
|
1221
|
+
return abortOut;
|
|
1222
|
+
}
|
|
1223
|
+
}
|
|
1224
|
+
|
|
1225
|
+
// Project Pos and target positions to clip space.
|
|
1226
|
+
let sourceResult = project_position_to_clipspace_and_commonspace(source_world, source_world_64low, vec3<f32>(0.0));
|
|
1227
|
+
let targetResult = project_position_to_clipspace_and_commonspace(target_world, target_world_64low, vec3<f32>(0.0));
|
|
1228
|
+
let sourcePos: vec4<f32> = sourceResult.clipPosition;
|
|
1229
|
+
let targetPos: vec4<f32> = targetResult.clipPosition;
|
|
1230
|
+
let source_commonspace: vec4<f32> = sourceResult.commonPosition;
|
|
1231
|
+
let target_commonspace: vec4<f32> = targetResult.commonPosition;
|
|
1232
|
+
|
|
1233
|
+
// Interpolate along the line segment.
|
|
1234
|
+
let segmentIndex: f32 = positions.x;
|
|
1235
|
+
let p: vec4<f32> = sourcePos + segmentIndex * (targetPos - sourcePos);
|
|
1236
|
+
geometry.position = source_commonspace + segmentIndex * (target_commonspace - source_commonspace);
|
|
1237
|
+
#ifdef ANTIALIASING
|
|
1238
|
+
var uv: vec2<f32> = positions.xy;
|
|
1239
|
+
#else
|
|
1240
|
+
let uv: vec2<f32> = positions.xy;
|
|
1241
|
+
#endif
|
|
1242
|
+
geometry.uv = uv;
|
|
1243
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(instanceIndex);
|
|
1244
|
+
|
|
1245
|
+
// Determine width in pixels.
|
|
1246
|
+
let widthPixels: f32 = clamp(
|
|
1247
|
+
project_unit_size_to_pixel(instanceWidths * line.widthScale, line.widthUnits),
|
|
1248
|
+
line.widthMinPixels, line.widthMaxPixels
|
|
1249
|
+
);
|
|
1250
|
+
|
|
1251
|
+
// Compute extrusion offset.
|
|
1252
|
+
let extrusion: vec2<f32> = getExtrusionOffset(targetPos.xy - sourcePos.xy, positions.y, widthPixels);
|
|
1253
|
+
let offset: vec3<f32> = vec3<f32>(extrusion, 0.0);
|
|
1254
|
+
|
|
1255
|
+
// Apply deck.gl filter functions.
|
|
1256
|
+
#ifdef ANTIALIASING
|
|
1257
|
+
var filteredOffset = deckgl_filter_size(offset, geometry);
|
|
1258
|
+
let halfWidthPixels = length(filteredOffset.xy);
|
|
1259
|
+
if (halfWidthPixels > 0.0) {
|
|
1260
|
+
// Keep the declared edge at abs(uv.y) == 1 while rasterizing the outer half of the centered
|
|
1261
|
+
// one-device-pixel coverage ramp.
|
|
1262
|
+
let coverageScale = 1.0 + 0.5 / project.devicePixelRatio / halfWidthPixels;
|
|
1263
|
+
filteredOffset *= coverageScale;
|
|
1264
|
+
uv.y *= coverageScale;
|
|
1265
|
+
}
|
|
1266
|
+
geometry.uv = uv;
|
|
1267
|
+
#else
|
|
1268
|
+
let filteredOffset = deckgl_filter_size(offset, geometry);
|
|
1269
|
+
#endif
|
|
1270
|
+
let filteredP = deckgl_filter_gl_position(p, geometry);
|
|
1271
|
+
|
|
1272
|
+
let clipOffset: vec2<f32> = project_pixel_size_to_clipspace(filteredOffset.xy);
|
|
1273
|
+
let finalPosition: vec4<f32> = filteredP + vec4<f32>(clipOffset, 0.0, 0.0);
|
|
1274
|
+
|
|
1275
|
+
// Compute color.
|
|
1276
|
+
var vColor: vec4<f32> = vec4<f32>(instanceColors.rgb, instanceColors.a * layer.opacity);
|
|
1277
|
+
// vColor = deckgl_filter_color(vColor, geometry);
|
|
1278
|
+
|
|
1279
|
+
var output: Varyings;
|
|
1280
|
+
output.gl_Position = finalPosition;
|
|
1281
|
+
output.vColor = vColor;
|
|
1282
|
+
output.uv = uv;
|
|
1283
|
+
output.pickingColor = geometry.pickingColor;
|
|
1284
|
+
return output;
|
|
1285
|
+
}
|
|
1286
|
+
|
|
1287
|
+
@fragment
|
|
1288
|
+
fn fragmentMain(
|
|
1289
|
+
@location(0) vColor: vec4<f32>,
|
|
1290
|
+
@location(1) uv: vec2<f32>,
|
|
1291
|
+
@location(2) pickingColor: vec3<f32>
|
|
1292
|
+
) -> @location(0) vec4<f32> {
|
|
1293
|
+
// Create and initialize geometry with the provided uv.
|
|
1294
|
+
var geometry: Geometry;
|
|
1295
|
+
geometry.uv = uv;
|
|
1296
|
+
|
|
1297
|
+
// Start with the input color.
|
|
1298
|
+
var fragColor: vec4<f32> = vColor;
|
|
1299
|
+
|
|
1300
|
+
#ifdef ANTIALIASING
|
|
1301
|
+
// Distance to the edge in device pixels, from the derivative of uv.y. Taken in uniform control
|
|
1302
|
+
// flow, ahead of the picking discard below
|
|
1303
|
+
let edgeCoord = abs(uv.y);
|
|
1304
|
+
let edgePixels = (1.0 - edgeCoord) / max(fwidth(edgeCoord), 1e-6);
|
|
1305
|
+
|
|
1306
|
+
// Fragments outside the coverage ramp must not write depth or picking colors.
|
|
1307
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
1308
|
+
discard;
|
|
1309
|
+
}
|
|
1310
|
+
|
|
1311
|
+
// Feather one device pixel across the width, before premultiplication below. The ends are left
|
|
1312
|
+
// hard - they abut neighbors
|
|
1313
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
1314
|
+
#endif
|
|
1315
|
+
|
|
1316
|
+
if (picking.isActive > 0.5) {
|
|
1317
|
+
if (!picking_isColorValid(pickingColor)) {
|
|
1318
|
+
discard;
|
|
1319
|
+
}
|
|
1320
|
+
return vec4<f32>(pickingColor, 1.0);
|
|
1321
|
+
}
|
|
1322
|
+
|
|
1323
|
+
if (picking.isHighlightActive > 0.5) {
|
|
1324
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
1325
|
+
if (picking_isColorZero(abs(pickingColor - highlightedObjectColor))) {
|
|
1326
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
1327
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
1328
|
+
if (blendedAlpha > 0.0) {
|
|
1329
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
1330
|
+
fragColor = vec4<f32>(
|
|
1331
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
1332
|
+
blendedAlpha
|
|
1333
|
+
);
|
|
1334
|
+
} else {
|
|
1335
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
1336
|
+
}
|
|
1337
|
+
}
|
|
1338
|
+
}
|
|
1339
|
+
|
|
1340
|
+
// Apply premultiplied alpha as required by transparent canvas
|
|
1341
|
+
fragColor = deckgl_premultiplied_alpha(fragColor);
|
|
1342
|
+
|
|
1343
|
+
return fragColor;
|
|
1344
|
+
}
|
|
1345
|
+
`;var _i=`#version 300 es
|
|
1346
|
+
#define SHADER_NAME line-layer-vertex-shader
|
|
1347
|
+
in vec3 positions;
|
|
1348
|
+
in vec3 instanceSourcePositions;
|
|
1349
|
+
in vec3 instanceTargetPositions;
|
|
1350
|
+
in vec3 instanceSourcePositions64Low;
|
|
1351
|
+
in vec3 instanceTargetPositions64Low;
|
|
1352
|
+
in vec4 instanceColors;
|
|
1353
|
+
in float instanceWidths;
|
|
1354
|
+
out vec4 vColor;
|
|
1355
|
+
out vec2 uv;
|
|
1356
|
+
vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction, float width) {
|
|
1357
|
+
vec2 dir_screenspace = normalize(line_clipspace * project.viewportSize);
|
|
1358
|
+
dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);
|
|
1359
|
+
return dir_screenspace * offset_direction * width / 2.0;
|
|
1360
|
+
}
|
|
1361
|
+
vec3 splitLine(vec3 a, vec3 b, float x) {
|
|
1362
|
+
float t = (x - a.x) / (b.x - a.x);
|
|
1363
|
+
return vec3(x, mix(a.yz, b.yz, t));
|
|
1364
|
+
}
|
|
1365
|
+
void main(void) {
|
|
1366
|
+
geometry.worldPosition = instanceSourcePositions;
|
|
1367
|
+
geometry.worldPositionAlt = instanceTargetPositions;
|
|
1368
|
+
vec3 source_world = instanceSourcePositions;
|
|
1369
|
+
vec3 target_world = instanceTargetPositions;
|
|
1370
|
+
vec3 source_world_64low = instanceSourcePositions64Low;
|
|
1371
|
+
vec3 target_world_64low = instanceTargetPositions64Low;
|
|
1372
|
+
if (line.useShortestPath > 0.5 || line.useShortestPath < -0.5) {
|
|
1373
|
+
source_world.x = mod(source_world.x + 180., 360.0) - 180.;
|
|
1374
|
+
target_world.x = mod(target_world.x + 180., 360.0) - 180.;
|
|
1375
|
+
float deltaLng = target_world.x - source_world.x;
|
|
1376
|
+
if (deltaLng * line.useShortestPath > 180.) {
|
|
1377
|
+
source_world.x += 360. * line.useShortestPath;
|
|
1378
|
+
source_world = splitLine(source_world, target_world, 180. * line.useShortestPath);
|
|
1379
|
+
source_world_64low = vec3(0.0);
|
|
1380
|
+
} else if (deltaLng * line.useShortestPath < -180.) {
|
|
1381
|
+
target_world.x += 360. * line.useShortestPath;
|
|
1382
|
+
target_world = splitLine(source_world, target_world, 180. * line.useShortestPath);
|
|
1383
|
+
target_world_64low = vec3(0.0);
|
|
1384
|
+
} else if (line.useShortestPath < 0.) {
|
|
1385
|
+
gl_Position = vec4(0.);
|
|
1386
|
+
return;
|
|
1387
|
+
}
|
|
1388
|
+
}
|
|
1389
|
+
vec4 source_commonspace;
|
|
1390
|
+
vec4 target_commonspace;
|
|
1391
|
+
vec4 source = project_position_to_clipspace(source_world, source_world_64low, vec3(0.), source_commonspace);
|
|
1392
|
+
vec4 target = project_position_to_clipspace(target_world, target_world_64low, vec3(0.), target_commonspace);
|
|
1393
|
+
float segmentIndex = positions.x;
|
|
1394
|
+
vec4 p = mix(source, target, segmentIndex);
|
|
1395
|
+
geometry.position = mix(source_commonspace, target_commonspace, segmentIndex);
|
|
1396
|
+
uv = positions.xy;
|
|
1397
|
+
geometry.uv = uv;
|
|
1398
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
1399
|
+
float widthPixels = clamp(
|
|
1400
|
+
project_size_to_pixel(instanceWidths * line.widthScale, line.widthUnits),
|
|
1401
|
+
line.widthMinPixels, line.widthMaxPixels
|
|
1402
|
+
);
|
|
1403
|
+
vec3 offset = vec3(
|
|
1404
|
+
getExtrusionOffset(target.xy - source.xy, positions.y, widthPixels),
|
|
1405
|
+
0.0);
|
|
1406
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
1407
|
+
#ifdef ANTIALIASING
|
|
1408
|
+
float halfWidthPixels = length(offset.xy);
|
|
1409
|
+
if (halfWidthPixels > 0.0) {
|
|
1410
|
+
float coverageScale = 1.0 + 0.5 / project.devicePixelRatio / halfWidthPixels;
|
|
1411
|
+
offset.xy *= coverageScale;
|
|
1412
|
+
uv.y *= coverageScale;
|
|
1413
|
+
}
|
|
1414
|
+
geometry.uv = uv;
|
|
1415
|
+
#endif
|
|
1416
|
+
DECKGL_FILTER_GL_POSITION(p, geometry);
|
|
1417
|
+
gl_Position = p + vec4(project_pixel_size_to_clipspace(offset.xy), 0.0, 0.0);
|
|
1418
|
+
vColor = vec4(instanceColors.rgb, instanceColors.a * layer.opacity);
|
|
1419
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
1420
|
+
}
|
|
1421
|
+
`;var Ci=`#version 300 es
|
|
1422
|
+
#define SHADER_NAME line-layer-fragment-shader
|
|
1423
|
+
precision highp float;
|
|
1424
|
+
in vec4 vColor;
|
|
1425
|
+
in vec2 uv;
|
|
1426
|
+
out vec4 fragColor;
|
|
1427
|
+
void main(void) {
|
|
1428
|
+
geometry.uv = uv;
|
|
1429
|
+
fragColor = vColor;
|
|
1430
|
+
#ifdef ANTIALIASING
|
|
1431
|
+
float edgeCoord = abs(uv.y);
|
|
1432
|
+
float edgePixels = (1.0 - edgeCoord) / max(fwidth(edgeCoord), 1e-6);
|
|
1433
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
1434
|
+
discard;
|
|
1435
|
+
}
|
|
1436
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
1437
|
+
#endif
|
|
1438
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
1439
|
+
}
|
|
1440
|
+
`;var kn={getSourcePosition:{type:`accessor`,value:i=>i.sourcePosition},getTargetPosition:{type:`accessor`,value:i=>i.targetPosition},getColor:{type:`accessor`,value:[0,0,0,255]},getWidth:{type:`accessor`,value:1},widthUnits:`pixels`,widthScale:{type:`number`,value:1,min:0},widthMinPixels:{type:`number`,value:0,min:0},widthMaxPixels:{type:`number`,value:Number.MAX_SAFE_INTEGER,min:0},antialiasing:!1};var he=class extends ao{getBounds(){return this.getAttributeManager()?.getBounds([`instanceSourcePositions`,`instanceTargetPositions`])}getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:_i,fs:Ci,source:Pi,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,yi]})}get wrapLongitude(){return!1}initializeState(){this.getAttributeManager().addInstanced({instanceSourcePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getSourcePosition`},instanceTargetPositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getTargetPosition`},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getColor`,defaultValue:[0,0,0,255]},instanceWidths:{size:1,transition:!0,accessor:`getWidth`,defaultValue:1}})}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e;(n.extensionsChanged||t.antialiasing!==o.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{widthUnits:t,widthScale:o,widthMinPixels:n,widthMaxPixels:s$3,wrapLongitude:r$4}=this.props,a=this.state.model,l={widthUnits:ee[t],widthScale:o,widthMinPixels:n,widthMaxPixels:s$3,useShortestPath:r$4?1:0};a.shaderInputs.setProps({line:l}),a.draw(this.context.renderPass),r$4&&(a.shaderInputs.setProps({line:s(r({},l),{useShortestPath:-1})}),a.draw(this.context.renderPass))}_getModel(){return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-strip`,attributes:{positions:{size:3,value:new Float32Array([0,-1,0,0,1,0,1,-1,0,1,1,0])}}}),isInstanced:!0}))}};he.layerName=`LineLayer`;he.defaultProps=kn;var Dn=he;var Si=`layout(std140) uniform pointCloudUniforms {
|
|
1441
|
+
float radiusPixels;
|
|
1442
|
+
highp int sizeUnits;
|
|
1443
|
+
} pointCloud;
|
|
1444
|
+
`;var Li={name:`pointCloud`,source:``,vs:Si,fs:Si,uniformTypes:{radiusPixels:`f32`,sizeUnits:`i32`}};var bi=`#version 300 es
|
|
1445
|
+
#define SHADER_NAME point-cloud-layer-vertex-shader
|
|
1446
|
+
in vec3 positions;
|
|
1447
|
+
in vec3 instanceNormals;
|
|
1448
|
+
in vec4 instanceColors;
|
|
1449
|
+
in vec3 instancePositions;
|
|
1450
|
+
in vec3 instancePositions64Low;
|
|
1451
|
+
out vec4 vColor;
|
|
1452
|
+
out vec2 unitPosition;
|
|
1453
|
+
void main(void) {
|
|
1454
|
+
geometry.worldPosition = instancePositions;
|
|
1455
|
+
geometry.normal = project_normal(instanceNormals);
|
|
1456
|
+
unitPosition = positions.xy;
|
|
1457
|
+
geometry.uv = unitPosition;
|
|
1458
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
1459
|
+
vec3 offset = vec3(positions.xy * project_size_to_pixel(pointCloud.radiusPixels, pointCloud.sizeUnits), 0.0);
|
|
1460
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
1461
|
+
#ifdef ANTIALIASING
|
|
1462
|
+
float triangleRadiusPixels = length(offset.xy);
|
|
1463
|
+
if (triangleRadiusPixels > 0.0) {
|
|
1464
|
+
float coverageScale = 1.0 + 1.0 / project.devicePixelRatio / triangleRadiusPixels;
|
|
1465
|
+
offset.xy *= coverageScale;
|
|
1466
|
+
unitPosition *= coverageScale;
|
|
1467
|
+
geometry.uv = unitPosition;
|
|
1468
|
+
}
|
|
1469
|
+
#endif
|
|
1470
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.), geometry.position);
|
|
1471
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
1472
|
+
gl_Position.xy += project_pixel_size_to_clipspace(offset.xy);
|
|
1473
|
+
vec3 lightColor = lighting_getLightColor(instanceColors.rgb, project.cameraPosition, geometry.position.xyz, geometry.normal);
|
|
1474
|
+
vColor = vec4(lightColor, instanceColors.a * layer.opacity);
|
|
1475
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
1476
|
+
}
|
|
1477
|
+
`;var wi=`#version 300 es
|
|
1478
|
+
#define SHADER_NAME point-cloud-layer-fragment-shader
|
|
1479
|
+
precision highp float;
|
|
1480
|
+
in vec4 vColor;
|
|
1481
|
+
in vec2 unitPosition;
|
|
1482
|
+
out vec4 fragColor;
|
|
1483
|
+
void main(void) {
|
|
1484
|
+
geometry.uv = unitPosition.xy;
|
|
1485
|
+
float distToCenter = length(unitPosition);
|
|
1486
|
+
#ifdef ANTIALIASING
|
|
1487
|
+
float edgePixels = (1.0 - distToCenter) / max(fwidth(distToCenter), 1e-6);
|
|
1488
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
1489
|
+
#else
|
|
1490
|
+
if (distToCenter > 1.0) {
|
|
1491
|
+
#endif
|
|
1492
|
+
discard;
|
|
1493
|
+
}
|
|
1494
|
+
fragColor = vColor;
|
|
1495
|
+
#ifdef ANTIALIASING
|
|
1496
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
1497
|
+
#endif
|
|
1498
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
1499
|
+
}
|
|
1500
|
+
`;var Ii=`struct PointCloudUniforms {
|
|
1501
|
+
radiusPixels: f32,
|
|
1502
|
+
sizeUnits: i32,
|
|
1503
|
+
};
|
|
1504
|
+
|
|
1505
|
+
@group(0) @binding(0)
|
|
1506
|
+
var<uniform> pointCloudUniforms: PointCloudUniforms;
|
|
1507
|
+
|
|
1508
|
+
struct Attributes {
|
|
1509
|
+
@builtin(instance_index) instanceIndex : u32,
|
|
1510
|
+
@builtin(vertex_index) vertexIndex : u32,
|
|
1511
|
+
@location(0) positions: vec3<f32>,
|
|
1512
|
+
@location(1) instancePositions: vec3<f32>,
|
|
1513
|
+
@location(2) instancePositions64Low: vec3<f32>,
|
|
1514
|
+
@location(3) instanceNormals: vec3<f32>,
|
|
1515
|
+
@location(4) instanceColors: vec4<f32>
|
|
1516
|
+
};
|
|
1517
|
+
|
|
1518
|
+
struct Varyings {
|
|
1519
|
+
@builtin(position) position: vec4<f32>,
|
|
1520
|
+
@location(0) vColor: vec4<f32>,
|
|
1521
|
+
@location(1) unitPosition: vec2<f32>,
|
|
1522
|
+
@location(2) pickingColor: vec3<f32>,
|
|
1523
|
+
};
|
|
1524
|
+
|
|
1525
|
+
@vertex
|
|
1526
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
1527
|
+
var varyings: Varyings;
|
|
1528
|
+
|
|
1529
|
+
geometry.worldPosition = attributes.instancePositions;
|
|
1530
|
+
|
|
1531
|
+
let centerResult = project_position_to_clipspace_and_commonspace(
|
|
1532
|
+
attributes.instancePositions,
|
|
1533
|
+
attributes.instancePositions64Low,
|
|
1534
|
+
vec3<f32>(0.0)
|
|
1535
|
+
);
|
|
1536
|
+
geometry.position = centerResult.commonPosition;
|
|
1537
|
+
geometry.normal = project_normal(attributes.instanceNormals);
|
|
1538
|
+
|
|
1539
|
+
// Position on the enclosing triangle. Its edges are tangent to the unit circle.
|
|
1540
|
+
varyings.unitPosition = attributes.positions.xy;
|
|
1541
|
+
geometry.uv = varyings.unitPosition;
|
|
1542
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.instanceIndex);
|
|
1543
|
+
|
|
1544
|
+
// Find the center of the point and add the current vertex
|
|
1545
|
+
#ifdef ANTIALIASING
|
|
1546
|
+
var offset = vec3<f32>(
|
|
1547
|
+
#else
|
|
1548
|
+
let offset = vec3<f32>(
|
|
1549
|
+
#endif
|
|
1550
|
+
attributes.positions.xy *
|
|
1551
|
+
project_unit_size_to_pixel(pointCloudUniforms.radiusPixels, pointCloudUniforms.sizeUnits),
|
|
1552
|
+
0.0
|
|
1553
|
+
);
|
|
1554
|
+
// DECKGL_FILTER_SIZE(offset, geometry);
|
|
1555
|
+
#ifdef ANTIALIASING
|
|
1556
|
+
let triangleRadiusPixels = length(offset.xy);
|
|
1557
|
+
if (triangleRadiusPixels > 0.0) {
|
|
1558
|
+
// The triangle's inradius is half its vertex radius. Scaling its vertex radius by one device
|
|
1559
|
+
// pixel therefore adds half a device pixel around all three tangent points.
|
|
1560
|
+
let coverageScale = 1.0 + 1.0 / project.devicePixelRatio / triangleRadiusPixels;
|
|
1561
|
+
offset *= coverageScale;
|
|
1562
|
+
varyings.unitPosition *= coverageScale;
|
|
1563
|
+
geometry.uv = varyings.unitPosition;
|
|
1564
|
+
}
|
|
1565
|
+
#endif
|
|
1566
|
+
|
|
1567
|
+
varyings.position = centerResult.clipPosition;
|
|
1568
|
+
// DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
1569
|
+
let clipPixels = project_pixel_size_to_clipspace(offset.xy);
|
|
1570
|
+
varyings.position.x += clipPixels.x;
|
|
1571
|
+
varyings.position.y += clipPixels.y;
|
|
1572
|
+
|
|
1573
|
+
// Apply lighting
|
|
1574
|
+
let lightColor = lighting_getLightColor2(attributes.instanceColors.rgb, project.cameraPosition, geometry.position.xyz, geometry.normal);
|
|
1575
|
+
|
|
1576
|
+
// Apply opacity to instance color, or return instance picking color
|
|
1577
|
+
varyings.vColor = vec4(lightColor, attributes.instanceColors.a * layer.opacity);
|
|
1578
|
+
// DECKGL_FILTER_COLOR(vColor, geometry);
|
|
1579
|
+
varyings.pickingColor = geometry.pickingColor;
|
|
1580
|
+
|
|
1581
|
+
return varyings;
|
|
1582
|
+
}
|
|
1583
|
+
|
|
1584
|
+
@fragment
|
|
1585
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
1586
|
+
// var geometry: Geometry;
|
|
1587
|
+
// geometry.uv = unitPosition.xy;
|
|
1588
|
+
|
|
1589
|
+
let distToCenter = length(varyings.unitPosition);
|
|
1590
|
+
#ifdef ANTIALIASING
|
|
1591
|
+
let edgePixels = (1.0 - distToCenter) / max(fwidth(distToCenter), 1e-6);
|
|
1592
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
1593
|
+
#else
|
|
1594
|
+
if (distToCenter > 1.0) {
|
|
1595
|
+
#endif
|
|
1596
|
+
discard;
|
|
1597
|
+
}
|
|
1598
|
+
|
|
1599
|
+
var fragColor: vec4<f32>;
|
|
1600
|
+
|
|
1601
|
+
fragColor = varyings.vColor;
|
|
1602
|
+
|
|
1603
|
+
#ifdef ANTIALIASING
|
|
1604
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
1605
|
+
#endif
|
|
1606
|
+
|
|
1607
|
+
if (picking.isActive > 0.5) {
|
|
1608
|
+
if (!picking_isColorValid(varyings.pickingColor)) {
|
|
1609
|
+
discard;
|
|
1610
|
+
}
|
|
1611
|
+
return vec4<f32>(varyings.pickingColor, 1.0);
|
|
1612
|
+
}
|
|
1613
|
+
|
|
1614
|
+
if (picking.isHighlightActive > 0.5) {
|
|
1615
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
1616
|
+
if (picking_isColorZero(abs(varyings.pickingColor - highlightedObjectColor))) {
|
|
1617
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
1618
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
1619
|
+
if (blendedAlpha > 0.0) {
|
|
1620
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
1621
|
+
fragColor = vec4<f32>(
|
|
1622
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
1623
|
+
blendedAlpha
|
|
1624
|
+
);
|
|
1625
|
+
} else {
|
|
1626
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
1627
|
+
}
|
|
1628
|
+
}
|
|
1629
|
+
}
|
|
1630
|
+
|
|
1631
|
+
// Apply premultiplied alpha as required by transparent canvas
|
|
1632
|
+
fragColor = deckgl_premultiplied_alpha(fragColor);
|
|
1633
|
+
|
|
1634
|
+
return fragColor;
|
|
1635
|
+
}
|
|
1636
|
+
`;var Ai=[0,0,0,255];var Ei=[0,0,1];var Fn={sizeUnits:`pixels`,pointSize:{type:`number`,min:0,value:10},antialiasing:!1,getPosition:{type:`accessor`,value:i=>i.position},getNormal:{type:`accessor`,value:Ei},getColor:{type:`accessor`,value:Ai},material:!0,radiusPixels:{deprecatedFor:`pointSize`}};function Nn(i){let{header:e,attributes:t}=i;if(!(!e||!t)&&(i.length=e.vertexCount,t.POSITION&&(t.instancePositions=t.POSITION),t.NORMAL&&(t.instanceNormals=t.NORMAL),t.COLOR_0)){let{size:o,value:n}=t.COLOR_0;t.instanceColors={size:o,type:`unorm8`,value:n}}}var xe=class extends ao{getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:bi,fs:wi,source:Ii,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Zo$1,Ka,Li]})}initializeState(){this.getAttributeManager().addInstanced({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceNormals:{size:3,transition:!0,accessor:`getNormal`,defaultValue:Ei},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getColor`,defaultValue:Ai}})}updateState(e){let{changeFlags:t,props:o,oldProps:n}=e;super.updateState(e),(t.extensionsChanged||o.antialiasing!==n.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll()),t.dataChanged&&Nn(o.data)}draw({uniforms:e}){let{pointSize:t,sizeUnits:o}=this.props,n=this.state.model,s={sizeUnits:ee[o],radiusPixels:t};n.shaderInputs.setProps({pointCloud:s}),n.draw(this.context.renderPass)}_getModel(){let e=[];for(let t=0;t<3;t++){let o=t/3*Math.PI*2;e.push(Math.cos(o)*2,Math.sin(o)*2,0)}return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-list`,attributes:{positions:new Float32Array(e)}}),isInstanced:!0}))}};xe.layerName=`PointCloudLayer`;xe.defaultProps=Fn;var Gn=xe;var Ti=`layout(std140) uniform scatterplotUniforms {
|
|
1637
|
+
float radiusScale;
|
|
1638
|
+
float radiusMinPixels;
|
|
1639
|
+
float radiusMaxPixels;
|
|
1640
|
+
float lineWidthScale;
|
|
1641
|
+
float lineWidthMinPixels;
|
|
1642
|
+
float lineWidthMaxPixels;
|
|
1643
|
+
float stroked;
|
|
1644
|
+
float filled;
|
|
1645
|
+
bool antialiasing;
|
|
1646
|
+
bool billboard;
|
|
1647
|
+
highp int radiusUnits;
|
|
1648
|
+
highp int lineWidthUnits;
|
|
1649
|
+
} scatterplot;
|
|
1650
|
+
`;var Oi={name:`scatterplot`,vs:Ti,fs:Ti,source:``,uniformTypes:{radiusScale:`f32`,radiusMinPixels:`f32`,radiusMaxPixels:`f32`,lineWidthScale:`f32`,lineWidthMinPixels:`f32`,lineWidthMaxPixels:`f32`,stroked:`f32`,filled:`f32`,antialiasing:`f32`,billboard:`f32`,radiusUnits:`i32`,lineWidthUnits:`i32`}};var Ri=`#version 300 es
|
|
1651
|
+
#define SHADER_NAME scatterplot-layer-vertex-shader
|
|
1652
|
+
in vec3 positions;
|
|
1653
|
+
in vec3 instancePositions;
|
|
1654
|
+
in vec3 instancePositions64Low;
|
|
1655
|
+
in float instanceRadius;
|
|
1656
|
+
in float instanceLineWidths;
|
|
1657
|
+
in vec4 instanceFillColors;
|
|
1658
|
+
in vec4 instanceLineColors;
|
|
1659
|
+
#ifdef USE_ROW_INDEXES
|
|
1660
|
+
in float rowIndexes;
|
|
1661
|
+
#endif
|
|
1662
|
+
in vec2 instancePixelOffset;
|
|
1663
|
+
out vec4 vFillColor;
|
|
1664
|
+
out vec4 vLineColor;
|
|
1665
|
+
out vec2 unitPosition;
|
|
1666
|
+
out float innerUnitRadius;
|
|
1667
|
+
out float outerRadiusPixels;
|
|
1668
|
+
void main(void) {
|
|
1669
|
+
geometry.worldPosition = instancePositions;
|
|
1670
|
+
outerRadiusPixels = clamp(
|
|
1671
|
+
project_size_to_pixel(scatterplot.radiusScale * instanceRadius, scatterplot.radiusUnits),
|
|
1672
|
+
scatterplot.radiusMinPixels, scatterplot.radiusMaxPixels
|
|
1673
|
+
);
|
|
1674
|
+
float lineWidthPixels = clamp(
|
|
1675
|
+
project_size_to_pixel(scatterplot.lineWidthScale * instanceLineWidths, scatterplot.lineWidthUnits),
|
|
1676
|
+
scatterplot.lineWidthMinPixels, scatterplot.lineWidthMaxPixels
|
|
1677
|
+
);
|
|
1678
|
+
outerRadiusPixels += scatterplot.stroked * lineWidthPixels / 2.0;
|
|
1679
|
+
float edgePadding = scatterplot.antialiasing ? (outerRadiusPixels + SMOOTH_EDGE_RADIUS) / outerRadiusPixels : 1.0;
|
|
1680
|
+
unitPosition = edgePadding * positions.xy;
|
|
1681
|
+
geometry.uv = unitPosition;
|
|
1682
|
+
#ifdef USE_ROW_INDEXES
|
|
1683
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(rowIndexes);
|
|
1684
|
+
#else
|
|
1685
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
1686
|
+
#endif
|
|
1687
|
+
innerUnitRadius = 1.0 - scatterplot.stroked * lineWidthPixels / outerRadiusPixels;
|
|
1688
|
+
if (scatterplot.billboard) {
|
|
1689
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.0), geometry.position);
|
|
1690
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
1691
|
+
vec3 offset = edgePadding * positions * outerRadiusPixels;
|
|
1692
|
+
offset.xy += instancePixelOffset;
|
|
1693
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
1694
|
+
gl_Position.xy += project_pixel_size_to_clipspace(offset.xy);
|
|
1695
|
+
} else {
|
|
1696
|
+
vec3 offset = edgePadding * positions * project_pixel_size(outerRadiusPixels);
|
|
1697
|
+
offset.xy += project_pixel_size(instancePixelOffset);
|
|
1698
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
1699
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, offset, geometry.position);
|
|
1700
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
1701
|
+
}
|
|
1702
|
+
vFillColor = vec4(instanceFillColors.rgb, instanceFillColors.a * layer.opacity);
|
|
1703
|
+
DECKGL_FILTER_COLOR(vFillColor, geometry);
|
|
1704
|
+
vLineColor = vec4(instanceLineColors.rgb, instanceLineColors.a * layer.opacity);
|
|
1705
|
+
DECKGL_FILTER_COLOR(vLineColor, geometry);
|
|
1706
|
+
}
|
|
1707
|
+
`;var Mi=`#version 300 es
|
|
1708
|
+
#define SHADER_NAME scatterplot-layer-fragment-shader
|
|
1709
|
+
precision highp float;
|
|
1710
|
+
in vec4 vFillColor;
|
|
1711
|
+
in vec4 vLineColor;
|
|
1712
|
+
in vec2 unitPosition;
|
|
1713
|
+
in float innerUnitRadius;
|
|
1714
|
+
in float outerRadiusPixels;
|
|
1715
|
+
out vec4 fragColor;
|
|
1716
|
+
void main(void) {
|
|
1717
|
+
geometry.uv = unitPosition;
|
|
1718
|
+
float distToCenter = length(unitPosition) * outerRadiusPixels;
|
|
1719
|
+
float inCircle = scatterplot.antialiasing ?
|
|
1720
|
+
smoothedge(distToCenter, outerRadiusPixels) :
|
|
1721
|
+
step(distToCenter, outerRadiusPixels);
|
|
1722
|
+
if (inCircle == 0.0) {
|
|
1723
|
+
discard;
|
|
1724
|
+
}
|
|
1725
|
+
if (scatterplot.stroked > 0.5) {
|
|
1726
|
+
float isLine = scatterplot.antialiasing ?
|
|
1727
|
+
smoothedge(innerUnitRadius * outerRadiusPixels, distToCenter) :
|
|
1728
|
+
step(innerUnitRadius * outerRadiusPixels, distToCenter);
|
|
1729
|
+
if (scatterplot.filled > 0.5) {
|
|
1730
|
+
fragColor = mix(vFillColor, vLineColor, isLine);
|
|
1731
|
+
} else {
|
|
1732
|
+
if (isLine == 0.0) {
|
|
1733
|
+
discard;
|
|
1734
|
+
}
|
|
1735
|
+
fragColor = vec4(vLineColor.rgb, vLineColor.a * isLine);
|
|
1736
|
+
}
|
|
1737
|
+
} else if (scatterplot.filled < 0.5) {
|
|
1738
|
+
discard;
|
|
1739
|
+
} else {
|
|
1740
|
+
fragColor = vFillColor;
|
|
1741
|
+
}
|
|
1742
|
+
fragColor.a *= inCircle;
|
|
1743
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
1744
|
+
}
|
|
1745
|
+
`;var jn=`// Main shaders
|
|
1746
|
+
|
|
1747
|
+
struct ScatterplotUniforms {
|
|
1748
|
+
radiusScale: f32,
|
|
1749
|
+
radiusMinPixels: f32,
|
|
1750
|
+
radiusMaxPixels: f32,
|
|
1751
|
+
lineWidthScale: f32,
|
|
1752
|
+
lineWidthMinPixels: f32,
|
|
1753
|
+
lineWidthMaxPixels: f32,
|
|
1754
|
+
stroked: f32,
|
|
1755
|
+
filled: i32,
|
|
1756
|
+
antialiasing: i32,
|
|
1757
|
+
billboard: i32,
|
|
1758
|
+
radiusUnits: i32,
|
|
1759
|
+
lineWidthUnits: i32,
|
|
1760
|
+
};
|
|
1761
|
+
|
|
1762
|
+
@group(0) @binding(0) var<uniform> scatterplot: ScatterplotUniforms;
|
|
1763
|
+
|
|
1764
|
+
struct Attributes {
|
|
1765
|
+
@builtin(instance_index) instanceIndex : u32,
|
|
1766
|
+
@builtin(vertex_index) vertexIndex : u32,
|
|
1767
|
+
@location(0) positions: vec3<f32>,
|
|
1768
|
+
@location(1) instancePositions: vec3<f32>,
|
|
1769
|
+
@location(2) instancePositions64Low: vec3<f32>,
|
|
1770
|
+
@location(3) instanceRadius: f32,
|
|
1771
|
+
@location(4) instanceLineWidths: f32,
|
|
1772
|
+
@location(5) instanceFillColors: vec4<f32>,
|
|
1773
|
+
@location(6) instanceLineColors: vec4<f32>,
|
|
1774
|
+
@location(7) instancePixelOffset: vec2<f32>,
|
|
1775
|
+
PICKING_COLOR_ATTRIBUTE
|
|
1776
|
+
};
|
|
1777
|
+
|
|
1778
|
+
struct Varyings {
|
|
1779
|
+
@builtin(position) position: vec4<f32>,
|
|
1780
|
+
@location(0) vFillColor: vec4<f32>,
|
|
1781
|
+
@location(1) vLineColor: vec4<f32>,
|
|
1782
|
+
@location(2) unitPosition: vec2<f32>,
|
|
1783
|
+
@location(3) innerUnitRadius: f32,
|
|
1784
|
+
@location(4) outerRadiusPixels: f32,
|
|
1785
|
+
@location(5) pickingColor: vec3<f32>,
|
|
1786
|
+
@location(6) clipCoordinates: vec2<f32>,
|
|
1787
|
+
};
|
|
1788
|
+
|
|
1789
|
+
@vertex
|
|
1790
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
1791
|
+
var varyings: Varyings;
|
|
1792
|
+
|
|
1793
|
+
// Draw an inline geometry constant array clip space triangle to verify that rendering works.
|
|
1794
|
+
// var positions = array<vec2<f32>, 3>(vec2(0.0, 0.5), vec2(-0.5, -0.5), vec2(0.5, -0.5));
|
|
1795
|
+
// if (attributes.instanceIndex == 0) {
|
|
1796
|
+
// varyings.position = vec4<f32>(positions[attributes.vertexIndex], 0.0, 1.0);
|
|
1797
|
+
// return varyings;
|
|
1798
|
+
// }
|
|
1799
|
+
|
|
1800
|
+
geometry.worldPosition = attributes.instancePositions;
|
|
1801
|
+
|
|
1802
|
+
// Multiply out radius and clamp to limits
|
|
1803
|
+
varyings.outerRadiusPixels = clamp(
|
|
1804
|
+
project_unit_size_to_pixel(scatterplot.radiusScale * attributes.instanceRadius, scatterplot.radiusUnits),
|
|
1805
|
+
scatterplot.radiusMinPixels, scatterplot.radiusMaxPixels
|
|
1806
|
+
);
|
|
1807
|
+
|
|
1808
|
+
// Multiply out line width and clamp to limits
|
|
1809
|
+
let lineWidthPixels = clamp(
|
|
1810
|
+
project_unit_size_to_pixel(scatterplot.lineWidthScale * attributes.instanceLineWidths, scatterplot.lineWidthUnits),
|
|
1811
|
+
scatterplot.lineWidthMinPixels, scatterplot.lineWidthMaxPixels
|
|
1812
|
+
);
|
|
1813
|
+
|
|
1814
|
+
// outer radius needs to offset by half stroke width
|
|
1815
|
+
varyings.outerRadiusPixels += scatterplot.stroked * lineWidthPixels / 2.0;
|
|
1816
|
+
// Expand geometry to accommodate edge smoothing
|
|
1817
|
+
// WGSL selects the second value when the condition is true, so keep the antialiased path second.
|
|
1818
|
+
let edgePadding = select(
|
|
1819
|
+
1.0,
|
|
1820
|
+
(varyings.outerRadiusPixels + SMOOTH_EDGE_RADIUS) / varyings.outerRadiusPixels,
|
|
1821
|
+
scatterplot.antialiasing != 0
|
|
1822
|
+
);
|
|
1823
|
+
|
|
1824
|
+
// position on the containing square in [-1, 1] space
|
|
1825
|
+
varyings.unitPosition = edgePadding * attributes.positions.xy;
|
|
1826
|
+
geometry.uv = varyings.unitPosition;
|
|
1827
|
+
geometry.pickingColor = PICKING_COLOR_VALUE;
|
|
1828
|
+
|
|
1829
|
+
varyings.innerUnitRadius = 1.0 - scatterplot.stroked * lineWidthPixels / varyings.outerRadiusPixels;
|
|
1830
|
+
|
|
1831
|
+
if (scatterplot.billboard != 0) {
|
|
1832
|
+
let projectedPosition = project_position_to_clipspace_and_commonspace(
|
|
1833
|
+
attributes.instancePositions,
|
|
1834
|
+
attributes.instancePositions64Low,
|
|
1835
|
+
vec3<f32>(0.0)
|
|
1836
|
+
);
|
|
1837
|
+
geometry.position = projectedPosition.commonPosition;
|
|
1838
|
+
varyings.position = projectedPosition.clipPosition;
|
|
1839
|
+
// DECKGL_FILTER_GL_POSITION(varyings.position, geometry);
|
|
1840
|
+
var offset = edgePadding * attributes.positions * varyings.outerRadiusPixels;
|
|
1841
|
+
offset = vec3<f32>(offset.xy + attributes.instancePixelOffset, offset.z);
|
|
1842
|
+
// DECKGL_FILTER_SIZE(offset, geometry);
|
|
1843
|
+
let clipPixels = project_pixel_size_to_clipspace(offset.xy);
|
|
1844
|
+
varyings.position = vec4<f32>(varyings.position.x + clipPixels.x, varyings.position.y + clipPixels.y, varyings.position.z, varyings.position.w);
|
|
1845
|
+
geometry.position = vec4<f32>(
|
|
1846
|
+
geometry.position.xy + project_pixel_size_vec2(offset.xy),
|
|
1847
|
+
geometry.position.zw
|
|
1848
|
+
);
|
|
1849
|
+
} else {
|
|
1850
|
+
var offset = edgePadding * attributes.positions * project_pixel_size_float(varyings.outerRadiusPixels);
|
|
1851
|
+
offset = vec3<f32>(offset.xy + project_pixel_size_vec2(attributes.instancePixelOffset), offset.z);
|
|
1852
|
+
// DECKGL_FILTER_SIZE(offset, geometry);
|
|
1853
|
+
let projectedPosition = project_position_to_clipspace_and_commonspace(
|
|
1854
|
+
attributes.instancePositions,
|
|
1855
|
+
attributes.instancePositions64Low,
|
|
1856
|
+
offset
|
|
1857
|
+
);
|
|
1858
|
+
geometry.position = projectedPosition.commonPosition;
|
|
1859
|
+
varyings.position = projectedPosition.clipPosition;
|
|
1860
|
+
// DECKGL_FILTER_GL_POSITION(varyings.position, geometry);
|
|
1861
|
+
}
|
|
1862
|
+
|
|
1863
|
+
varyings.clipCoordinates = geometry.position.xy;
|
|
1864
|
+
clip_filterPosition(&varyings.position, geometry.worldPosition.xy);
|
|
1865
|
+
|
|
1866
|
+
// Apply opacity to instance color, or return instance picking color
|
|
1867
|
+
varyings.vFillColor = vec4<f32>(attributes.instanceFillColors.rgb, attributes.instanceFillColors.a * layer.opacity);
|
|
1868
|
+
// DECKGL_FILTER_COLOR(varyings.vFillColor, geometry);
|
|
1869
|
+
varyings.vLineColor = vec4<f32>(attributes.instanceLineColors.rgb, attributes.instanceLineColors.a * layer.opacity);
|
|
1870
|
+
// DECKGL_FILTER_COLOR(varyings.vLineColor, geometry);
|
|
1871
|
+
varyings.pickingColor = geometry.pickingColor;
|
|
1872
|
+
|
|
1873
|
+
return varyings;
|
|
1874
|
+
}
|
|
1875
|
+
|
|
1876
|
+
@fragment
|
|
1877
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
1878
|
+
// var geometry: Geometry;
|
|
1879
|
+
// geometry.uv = unitPosition;
|
|
1880
|
+
|
|
1881
|
+
let distToCenter = length(varyings.unitPosition) * varyings.outerRadiusPixels;
|
|
1882
|
+
let inCircle = select(
|
|
1883
|
+
step(distToCenter, varyings.outerRadiusPixels),
|
|
1884
|
+
smoothedge(distToCenter, varyings.outerRadiusPixels),
|
|
1885
|
+
scatterplot.antialiasing != 0
|
|
1886
|
+
);
|
|
1887
|
+
|
|
1888
|
+
if (inCircle == 0.0) {
|
|
1889
|
+
discard;
|
|
1890
|
+
}
|
|
1891
|
+
|
|
1892
|
+
var fragColor: vec4<f32>;
|
|
1893
|
+
|
|
1894
|
+
if (scatterplot.stroked != 0) {
|
|
1895
|
+
let isLine = select(
|
|
1896
|
+
step(varyings.innerUnitRadius * varyings.outerRadiusPixels, distToCenter),
|
|
1897
|
+
smoothedge(varyings.innerUnitRadius * varyings.outerRadiusPixels, distToCenter),
|
|
1898
|
+
scatterplot.antialiasing != 0
|
|
1899
|
+
);
|
|
1900
|
+
|
|
1901
|
+
if (scatterplot.filled != 0) {
|
|
1902
|
+
fragColor = mix(varyings.vFillColor, varyings.vLineColor, isLine);
|
|
1903
|
+
} else {
|
|
1904
|
+
if (isLine == 0.0) {
|
|
1905
|
+
discard;
|
|
1906
|
+
}
|
|
1907
|
+
fragColor = vec4<f32>(varyings.vLineColor.rgb, varyings.vLineColor.a * isLine);
|
|
1908
|
+
}
|
|
1909
|
+
} else if (scatterplot.filled == 0) {
|
|
1910
|
+
discard;
|
|
1911
|
+
} else {
|
|
1912
|
+
fragColor = varyings.vFillColor;
|
|
1913
|
+
}
|
|
1914
|
+
|
|
1915
|
+
fragColor.a *= inCircle;
|
|
1916
|
+
|
|
1917
|
+
clip_filterColor(varyings.clipCoordinates);
|
|
1918
|
+
|
|
1919
|
+
if (picking.isActive > 0.5) {
|
|
1920
|
+
if (!picking_isColorValid(varyings.pickingColor)) {
|
|
1921
|
+
discard;
|
|
1922
|
+
}
|
|
1923
|
+
return vec4<f32>(varyings.pickingColor, 1.0);
|
|
1924
|
+
}
|
|
1925
|
+
|
|
1926
|
+
if (picking.isHighlightActive > 0.5) {
|
|
1927
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
1928
|
+
if (picking_isColorZero(abs(varyings.pickingColor - highlightedObjectColor))) {
|
|
1929
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
1930
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
1931
|
+
if (blendedAlpha > 0.0) {
|
|
1932
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
1933
|
+
fragColor = vec4<f32>(
|
|
1934
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
1935
|
+
blendedAlpha
|
|
1936
|
+
);
|
|
1937
|
+
} else {
|
|
1938
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
1939
|
+
}
|
|
1940
|
+
}
|
|
1941
|
+
}
|
|
1942
|
+
|
|
1943
|
+
// Apply premultiplied alpha as required by transparent canvas
|
|
1944
|
+
fragColor = deckgl_premultiplied_alpha(fragColor);
|
|
1945
|
+
|
|
1946
|
+
return fragColor;
|
|
1947
|
+
// return vec4<f32>(0, 0, 1, 1);
|
|
1948
|
+
}
|
|
1949
|
+
`;function zi(i){return jn.replace(`PICKING_COLOR_ATTRIBUTE`,i?`@location(8) rowIndexes: u32,`:``).replace(`PICKING_COLOR_VALUE`,i?`picking_getPickingColorFromIndex(attributes.rowIndexes)`:`picking_getPickingColorFromIndex(attributes.instanceIndex)`)}var ie={name:`clip`,source:`struct ClipUniforms {
|
|
1950
|
+
enabled: i32,
|
|
1951
|
+
mode: i32,
|
|
1952
|
+
bounds: vec4<f32>,
|
|
1953
|
+
};
|
|
1954
|
+
|
|
1955
|
+
@group(2) @binding(auto) var<uniform> clipUniforms: ClipUniforms;
|
|
1956
|
+
|
|
1957
|
+
fn clip_isInBounds(coordinates: vec2<f32>) -> bool {
|
|
1958
|
+
return coordinates.x >= clipUniforms.bounds.x &&
|
|
1959
|
+
coordinates.y >= clipUniforms.bounds.y &&
|
|
1960
|
+
coordinates.x < clipUniforms.bounds.z &&
|
|
1961
|
+
coordinates.y < clipUniforms.bounds.w;
|
|
1962
|
+
}
|
|
1963
|
+
|
|
1964
|
+
fn clip_filterPosition(position: ptr<function, vec4<f32>>, instanceCoordinates: vec2<f32>) {
|
|
1965
|
+
if (
|
|
1966
|
+
clipUniforms.enabled != 0 &&
|
|
1967
|
+
clipUniforms.mode == 1 &&
|
|
1968
|
+
!clip_isInBounds(instanceCoordinates)
|
|
1969
|
+
) {
|
|
1970
|
+
*position = vec4<f32>(2.0, 2.0, 2.0, 1.0);
|
|
1971
|
+
}
|
|
1972
|
+
}
|
|
1973
|
+
|
|
1974
|
+
fn clip_filterColor(geometryCoordinates: vec2<f32>) {
|
|
1975
|
+
if (
|
|
1976
|
+
clipUniforms.enabled != 0 &&
|
|
1977
|
+
clipUniforms.mode == 0 &&
|
|
1978
|
+
!clip_isInBounds(geometryCoordinates)
|
|
1979
|
+
) {
|
|
1980
|
+
discard;
|
|
1981
|
+
}
|
|
1982
|
+
}
|
|
1983
|
+
`,props:{},uniforms:{},bindingLayout:[{name:`clip`,group:2}],uniformTypes:{enabled:`i32`,mode:`i32`,bounds:`vec4<f32>`},defaultUniforms:{enabled:0,mode:0,bounds:[0,0,1,1]},getUniforms(i={}){let e={};return i.enabled!==void 0&&(e.enabled=i.enabled?1:0),i.mode!==void 0&&(e.mode=i.mode===`instance`?1:0),i.bounds!==void 0&&(e.bounds=i.bounds),e}};var ki=[0,0,0,255];var Un={radiusUnits:`meters`,radiusScale:{type:`number`,min:0,value:1},radiusMinPixels:{type:`number`,min:0,value:0},radiusMaxPixels:{type:`number`,min:0,value:Number.MAX_SAFE_INTEGER},lineWidthUnits:`meters`,lineWidthScale:{type:`number`,min:0,value:1},lineWidthMinPixels:{type:`number`,min:0,value:0},lineWidthMaxPixels:{type:`number`,min:0,value:Number.MAX_SAFE_INTEGER},stroked:!1,filled:!0,billboard:!1,antialiasing:!0,getPosition:{type:`accessor`,value:i=>i.position},getRadius:{type:`accessor`,value:1},getFillColor:{type:`accessor`,value:ki},getLineColor:{type:`accessor`,value:ki},getLineWidth:{type:`accessor`,value:1},getPixelOffset:{type:`accessor`,value:[0,0]},strokeWidth:{deprecatedFor:`getLineWidth`},outline:{deprecatedFor:`stroked`},getColor:{deprecatedFor:[`getFillColor`,`getLineColor`]}};var ve=class extends ao{getShaders(){let e=!!this.props.data?.attributes?.rowIndexes;return super.getShaders({vs:Ri,fs:Mi,source:zi(e),defines:e?{USE_ROW_INDEXES:!0}:{},modules:[Wa,ma,Ka,Oi,...this.context.device.type===`webgpu`?[ie]:[]]})}initializeState(){let e=this.props.data?.attributes?.rowIndexes?{rowIndexes:{size:1,type:`uint32`,noAlloc:!0}}:{};this.getAttributeManager().addInstanced(r({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceRadius:{size:1,transition:!0,accessor:`getRadius`,defaultValue:1,bufferGroup:`scatterplot-instance-data`},instanceFillColors:{size:this.props.colorFormat.length,transition:!0,type:`unorm8`,accessor:`getFillColor`,defaultValue:[0,0,0,255],bufferGroup:`scatterplot-instance-data`},instanceLineColors:{size:this.props.colorFormat.length,transition:!0,type:`unorm8`,accessor:`getLineColor`,defaultValue:[0,0,0,255],bufferGroup:`scatterplot-instance-data`},instanceLineWidths:{size:1,transition:!0,accessor:`getLineWidth`,defaultValue:1,bufferGroup:`scatterplot-instance-data`},instancePixelOffset:{size:2,transition:!0,accessor:`getPixelOffset`,bufferGroup:`scatterplot-instance-data`}},e))}updateState(e){super.updateState(e),e.changeFlags.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{radiusUnits:t,radiusScale:o,radiusMinPixels:n,radiusMaxPixels:s,stroked:r,filled:a,billboard:l,antialiasing:c,lineWidthUnits:f,lineWidthScale:d,lineWidthMinPixels:p,lineWidthMaxPixels:u}=this.props,g={stroked:r,filled:a,billboard:l,antialiasing:c,radiusUnits:ee[t],radiusScale:o,radiusMinPixels:n,radiusMaxPixels:s,lineWidthUnits:ee[f],lineWidthScale:d,lineWidthMinPixels:p,lineWidthMaxPixels:u},h=this.state.model;h.shaderInputs.setProps({scatterplot:g}),h.draw(this.context.renderPass)}_getModel(){return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-strip`,attributes:{positions:{size:3,value:new Float32Array([-1,-1,0,1,-1,0,-1,1,0,1,1,0])}}}),isInstanced:!0}))}};ve.defaultProps=Un;ve.layerName=`ScatterplotLayer`;var wt=ve;var oe={CLOCKWISE:1,COUNTER_CLOCKWISE:-1};function Y(i,e,t={}){return Di(i,t)!==e?(Vn(i,t),!0):!1}function Di(i,e={}){return Math.sign(ye(i,e))}var me={x:0,y:1,z:2};function ye(i,e={}){let{start:t=0,end:o=i.length,plane:n=`xy`}=e,s=e.size||2,r=0,a=me[n[0]],l=me[n[1]];for(let c=t,f=o-s;c<o;c+=s)r+=(i[c+a]-i[f+a])*(i[c+l]+i[f+l]),f=c;return r/2}function Vn(i,e){let{start:t=0,end:o=i.length,size:n=2}=e,s=(o-t)/n,r=Math.floor(s/2);for(let a=0;a<r;++a){let l=t+a*n,c=t+(s-1-a)*n;for(let f=0;f<n;++f){let d=i[l+f];i[l+f]=i[c+f],i[c+f]=d}}}function Zn(i,e,t=2,o,n=`xy`){let s=e&&e.length,r=s?e[0]*t:i.length,a=Ni(i,0,r,t,!0,o&&o[0],n),l=[];if(!a||a.next===a.prev)return l;let c,f,d,p,u,g,h;if(s&&(a=Xn(i,e,a,t,o,n)),i.length>80*t){p=f=i[0],u=d=i[1];for(let v=t;v<r;v+=t)g=i[v],h=i[v+1],g<p&&(p=g),h<u&&(u=h),g>f&&(f=g),h>d&&(d=h);c=Math.max(f-p,d-u),c=c!==0?32767/c:0}return Pe(a,l,t,p,u,c,0),l}function Ni(i,e,t,o,n,s,r){let a,l;s===void 0&&(s=ye(i,{start:e,end:t,size:o,plane:r}));let c=me[r[0]],f=me[r[1]];if(n===s<0)for(a=e;a<t;a+=o)l=Fi(a,i[a+c],i[a+f],l);else for(a=t-o;a>=e;a-=o)l=Fi(a,i[a+c],i[a+f],l);return l&&nt(l,l.next)&&(Ce(l),l=l.next),l}function J(i,e){if(!i)return i;e||(e=i);let t=i,o;do if(o=!1,!t.steiner&&(nt(t,t.next)||b(t.prev,t,t.next)===0)){if(Ce(t),t=e=t.prev,t===t.next)break;o=!0}else t=t.next;while(o||t!==e);return e}function Pe(i,e,t,o,n,s,r){if(!i)return;!r&&s&&is(i,o,n,s);let a=i,l,c;for(;i.prev!==i.next;){if(l=i.prev,c=i.next,s?$n(i,o,n,s):Kn(i)){e.push(l.i/t|0),e.push(i.i/t|0),e.push(c.i/t|0),Ce(i),i=c.next,a=c.next;continue}if(i=c,i===a){r?r===1?(i=Yn(J(i),e,t),Pe(i,e,t,o,n,s,2)):r===2&&Jn(i,e,t,o,n,s):Pe(J(i),e,t,o,n,s,1);break}}}function Kn(i){let e=i.prev,t=i,o=i.next;if(b(e,t,o)>=0)return!1;let n=e.x,s=t.x,r=o.x,a=e.y,l=t.y,c=o.y,f=n<s?n<r?n:r:s<r?s:r,d=a<l?a<c?a:c:l<c?l:c,p=n>s?n>r?n:r:s>r?s:r,u=a>l?a>c?a:c:l>c?l:c,g=o.next;for(;g!==e;){if(g.x>=f&&g.x<=p&&g.y>=d&&g.y<=u&&ne(n,a,s,l,r,c,g.x,g.y)&&b(g.prev,g,g.next)>=0)return!1;g=g.next}return!0}function $n(i,e,t,o){let n=i.prev,s=i,r=i.next;if(b(n,s,r)>=0)return!1;let a=n.x,l=s.x,c=r.x,f=n.y,d=s.y,p=r.y,u=a<l?a<c?a:c:l<c?l:c,g=f<d?f<p?f:p:d<p?d:p,h=a>l?a>c?a:c:l>c?l:c,v=f>d?f>p?f:p:d>p?d:p,P=It(u,g,e,t,o),C=It(h,v,e,t,o),m=i.prevZ,x=i.nextZ;for(;m&&m.z>=P&&x&&x.z<=C;){if(m.x>=u&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&ne(a,f,l,d,c,p,m.x,m.y)&&b(m.prev,m,m.next)>=0||(m=m.prevZ,x.x>=u&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&ne(a,f,l,d,c,p,x.x,x.y)&&b(x.prev,x,x.next)>=0))return!1;x=x.nextZ}for(;m&&m.z>=P;){if(m.x>=u&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&ne(a,f,l,d,c,p,m.x,m.y)&&b(m.prev,m,m.next)>=0)return!1;m=m.prevZ}for(;x&&x.z<=C;){if(x.x>=u&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&ne(a,f,l,d,c,p,x.x,x.y)&&b(x.prev,x,x.next)>=0)return!1;x=x.nextZ}return!0}function Yn(i,e,t){let o=i;do{let n=o.prev,s=o.next.next;!nt(n,s)&&Gi(n,o,o.next,s)&&_e(n,s)&&_e(s,n)&&(e.push(n.i/t|0),e.push(o.i/t|0),e.push(s.i/t|0),Ce(o),Ce(o.next),o=i=s),o=o.next}while(o!==i);return J(o)}function Jn(i,e,t,o,n,s){let r=i;do{let a=r.next.next;for(;a!==r.prev;){if(r.i!==a.i&&ss(r,a)){let l=ji(r,a);r=J(r,r.next),l=J(l,l.next),Pe(r,e,t,o,n,s,0),Pe(l,e,t,o,n,s,0);return}a=a.next}r=r.next}while(r!==i)}function Xn(i,e,t,o,n,s){let r=[],a,l,c,f,d;for(a=0,l=e.length;a<l;a++)c=e[a]*o,f=a<l-1?e[a+1]*o:i.length,d=Ni(i,c,f,o,!1,n&&n[a+1],s),d===d.next&&(d.steiner=!0),r.push(ns(d));for(r.sort(qn),a=0;a<r.length;a++)t=Qn(r[a],t);return t}function qn(i,e){return i.x-e.x}function Qn(i,e){let t=es(i,e);if(!t)return e;let o=ji(t,i);return J(o,o.next),J(t,t.next)}function es(i,e){let t=e,o=i.x,n=i.y,s=-1/0,r;do{if(n<=t.y&&n>=t.next.y&&t.next.y!==t.y){let p=t.x+(n-t.y)*(t.next.x-t.x)/(t.next.y-t.y);if(p<=o&&p>s&&(s=p,r=t.x<t.next.x?t:t.next,p===o))return r}t=t.next}while(t!==e);if(!r)return null;let a=r,l=r.x,c=r.y,f=1/0,d;t=r;do o>=t.x&&t.x>=l&&o!==t.x&&ne(n<c?o:s,n,l,c,n<c?s:o,n,t.x,t.y)&&(d=Math.abs(n-t.y)/(o-t.x),_e(t,i)&&(d<f||d===f&&(t.x>r.x||t.x===r.x&&ts(r,t)))&&(r=t,f=d)),t=t.next;while(t!==a);return r}function ts(i,e){return b(i.prev,i,e.prev)<0&&b(e.next,i,i.next)<0}function is(i,e,t,o){let n=i;do n.z===0&&(n.z=It(n.x,n.y,e,t,o)),n.prevZ=n.prev,n.nextZ=n.next,n=n.next;while(n!==i);n.prevZ.nextZ=null,n.prevZ=null,os(n)}function os(i){let e,t,o=1,n,s,r,a,l,c;do{for(s=i,i=null,c=null,n=0;s;){for(n++,a=s,r=0,t=0;t<o&&(r++,a=a.nextZ,!!a);t++);for(l=o;r>0||l>0&&a;)r!==0&&(l===0||!a||s.z<=a.z)?(e=s,s=s.nextZ,r--):(e=a,a=a.nextZ,l--),c?c.nextZ=e:i=e,e.prevZ=c,c=e;s=a}c.nextZ=null,o*=2}while(n>1);return i}function It(i,e,t,o,n){return i=(i-t)*n|0,e=(e-o)*n|0,i=(i|i<<8)&16711935,i=(i|i<<4)&252645135,i=(i|i<<2)&858993459,i=(i|i<<1)&1431655765,e=(e|e<<8)&16711935,e=(e|e<<4)&252645135,e=(e|e<<2)&858993459,e=(e|e<<1)&1431655765,i|e<<1}function ns(i){let e=i,t=i;do(e.x<t.x||e.x===t.x&&e.y<t.y)&&(t=e),e=e.next;while(e!==i);return t}function ne(i,e,t,o,n,s,r,a){return(n-r)*(e-a)>=(i-r)*(s-a)&&(i-r)*(o-a)>=(t-r)*(e-a)&&(t-r)*(s-a)>=(n-r)*(o-a)}function ss(i,e){return i.next.i!==e.i&&i.prev.i!==e.i&&!rs(i,e)&&(_e(i,e)&&_e(e,i)&&as(i,e)&&(b(i.prev,i,e.prev)||b(i,e.prev,e))||nt(i,e)&&b(i.prev,i,i.next)>0&&b(e.prev,e,e.next)>0)}function b(i,e,t){return(e.y-i.y)*(t.x-e.x)-(e.x-i.x)*(t.y-e.y)}function nt(i,e){return i.x===e.x&&i.y===e.y}function Gi(i,e,t,o){let n=ot(b(i,e,t)),s=ot(b(i,e,o)),r=ot(b(t,o,i)),a=ot(b(t,o,e));return!!(n!==s&&r!==a||n===0&&it(i,t,e)||s===0&&it(i,o,e)||r===0&&it(t,i,o)||a===0&&it(t,e,o))}function it(i,e,t){return e.x<=Math.max(i.x,t.x)&&e.x>=Math.min(i.x,t.x)&&e.y<=Math.max(i.y,t.y)&&e.y>=Math.min(i.y,t.y)}function ot(i){return i>0?1:i<0?-1:0}function rs(i,e){let t=i;do{if(t.i!==i.i&&t.next.i!==i.i&&t.i!==e.i&&t.next.i!==e.i&&Gi(t,t.next,i,e))return!0;t=t.next}while(t!==i);return!1}function _e(i,e){return b(i.prev,i,i.next)<0?b(i,e,i.next)>=0&&b(i,i.prev,e)>=0:b(i,e,i.prev)<0||b(i,i.next,e)<0}function as(i,e){let t=i,o=!1,n=(i.x+e.x)/2,s=(i.y+e.y)/2;do t.y>s!=t.next.y>s&&t.next.y!==t.y&&n<(t.next.x-t.x)*(s-t.y)/(t.next.y-t.y)+t.x&&(o=!o),t=t.next;while(t!==i);return o}function ji(i,e){let t=new Se(i.i,i.x,i.y),o=new Se(e.i,e.x,e.y),n=i.next,s=e.prev;return i.next=e,e.prev=i,t.next=n,n.prev=t,o.next=t,t.prev=o,s.next=o,o.prev=s,o}function Fi(i,e,t,o){let n=new Se(i,e,t);return o?(n.next=o.next,n.prev=o,o.next.prev=n,o.next=n):(n.prev=n,n.next=n),n}function Ce(i){i.next.prev=i.prev,i.prev.next=i.next,i.prevZ&&(i.prevZ.nextZ=i.nextZ),i.nextZ&&(i.nextZ.prevZ=i.prevZ)}var Se=class{constructor(e,t,o){this.prev=null,this.next=null,this.z=0,this.prevZ=null,this.nextZ=null,this.steiner=!1,this.i=e,this.x=t,this.y=o}};function G(i,e){let t=e.length,o=i.length;if(o>0){let n=!0;for(let s=0;s<t;s++)if(i[o-t+s]!==e[s]){n=!1;break}if(n)return!1}for(let n=0;n<t;n++)i[o+n]=e[n];return!0}function Le(i,e){let t=e.length;for(let o=0;o<t;o++)i[o]=e[o]}function Z(i,e,t,o,n=[]){let s=o+e*t;for(let r=0;r<t;r++)n[r]=i[s+r];return n}function st(i,e,t,o,n=[]){let s,r;if(t&8)s=(o[3]-i[1])/(e[1]-i[1]),r=3;else if(t&4)s=(o[1]-i[1])/(e[1]-i[1]),r=1;else if(t&2)s=(o[2]-i[0])/(e[0]-i[0]),r=2;else if(t&1)s=(o[0]-i[0])/(e[0]-i[0]),r=0;else return null;for(let a=0;a<i.length;a++)n[a]=(r&1)===a?o[r]:s*(e[a]-i[a])+i[a];return n}function be(i,e){let t=0;return i[0]<e[0]?t|=1:i[0]>e[2]&&(t|=2),i[1]<e[1]?t|=4:i[1]>e[3]&&(t|=8),t}function we(i,e){let{size:t=2,broken:o=!1,gridResolution:n=10,gridOffset:s=[0,0],startIndex:r=0,endIndex:a=i.length}=e||{},l=(a-r)/t,c=[],f=[c],d=Z(i,0,t,r),p,u,g=Ui(d,n,s,[]),h=[];G(c,d);for(let v=1;v<l;v++){for(p=Z(i,v,t,r,p),u=be(p,g);u;){st(d,p,u,g,h);let P=be(h,g);P&&(st(d,h,P,g,h),u=P),G(c,h),Le(d,h),cs(g,n,u),o&&c.length>t&&(c=[],f.push(c),G(c,d)),u=be(p,g)}G(c,p),Le(d,p)}return o?f:f[0]}var Bi=0;var ls=1;function Ie(i,e=null,t){if(!i.length)return[];let{size:o=2,gridResolution:n=10,gridOffset:s=[0,0],edgeTypes:r=!1}=t||{},a=[],l=[{pos:i,types:r?new Array(i.length/o).fill(ls):null,holes:e||[]}],c=[[],[]],f=[];for(;l.length;){let{pos:d,types:p,holes:u}=l.shift();fs(d,o,u[0]||d.length,c),f=Ui(c[0],n,s,f);let g=be(c[1],f);if(g){let h=Wi(d,p,o,0,u[0]||d.length,f,g),v={pos:h[0].pos,types:h[0].types,holes:[]},P={pos:h[1].pos,types:h[1].types,holes:[]};l.push(v,P);for(let C=0;C<u.length;C++)h=Wi(d,p,o,u[C],u[C+1]||d.length,f,g),h[0]&&(v.holes.push(v.pos.length),v.pos=rt(v.pos,h[0].pos),r&&(v.types=rt(v.types,h[0].types))),h[1]&&(P.holes.push(P.pos.length),P.pos=rt(P.pos,h[1].pos),r&&(P.types=rt(P.types,h[1].types)))}else{let h={positions:d};r&&(h.edgeTypes=p),u.length&&(h.holeIndices=u),a.push(h)}}return a}function Wi(i,e,t,o,n,s,r){let a=(n-o)/t,l=[],c=[],f=[],d=[],p=[],u,g,h,v=Z(i,a-1,t,o),P=Math.sign(r&8?v[1]-s[3]:v[0]-s[2]),C=e&&e[a-1],m=0,x=0;for(let S=0;S<a;S++)u=Z(i,S,t,o,u),g=Math.sign(r&8?u[1]-s[3]:u[0]-s[2]),h=e&&e[o/t+S],g&&P&&P!==g&&(st(v,u,r,s,p),G(l,p)&&f.push(C),G(c,p)&&d.push(C)),g<=0?(G(l,u)&&f.push(h),m-=g):f.length&&(f[f.length-1]=Bi),g>=0?(G(c,u)&&d.push(h),x+=g):d.length&&(d[d.length-1]=Bi),Le(v,u),P=g,C=h;return[m?{pos:l,types:e&&f}:null,x?{pos:c,types:e&&d}:null]}function Ui(i,e,t,o){let n=Math.floor((i[0]-t[0])/e)*e+t[0],s=Math.floor((i[1]-t[1])/e)*e+t[1];return o[0]=n,o[1]=s,o[2]=n+e,o[3]=s+e,o}function cs(i,e,t){t&8?(i[1]+=e,i[3]+=e):t&4?(i[1]-=e,i[3]-=e):t&2?(i[0]+=e,i[2]+=e):t&1&&(i[0]-=e,i[2]-=e)}function fs(i,e,t,o){let n=1/0,s=-1/0,r=1/0,a=-1/0;for(let l=0;l<t;l+=e){let c=i[l],f=i[l+1];n=c<n?c:n,s=c>s?c:s,r=f<r?f:r,a=f>a?f:a}return o[0][0]=n,o[0][1]=r,o[1][0]=s,o[1][1]=a,o}function rt(i,e){for(let t=0;t<e.length;t++)i.push(e[t]);return i}var ds=85.051129;function At(i,e){let{size:t=2,startIndex:o=0,endIndex:n=i.length,normalize:s=!0}=e||{},r=i.slice(o,n);Vi(r,t,0,n-o);let a=we(r,{size:t,broken:!0,gridResolution:360,gridOffset:[-180,-180]});if(s)for(let l of a)Hi(l,t);return a}function Et(i,e=null,t){let{size:o=2,normalize:n=!0,edgeTypes:s=!1}=t||{};e=e||[];let r=[],a=[],l=0,c=0;for(let d=0;d<=e.length;d++){let p=e[d]||i.length,u=c,g=ps(i,o,l,p);for(let h=g;h<p;h++)r[c++]=i[h];for(let h=l;h<g;h++)r[c++]=i[h];Vi(r,o,u,c),us(r,o,u,c,t?.maxLatitude),l=p,a[d]=c}a.pop();let f=Ie(r,a,{size:o,gridResolution:360,gridOffset:[-180,-180],edgeTypes:s});if(n)for(let d of f)Hi(d.positions,o);return f}function ps(i,e,t,o){let n=-1,s=-1;for(let r=t+1;r<o;r+=e){let a=Math.abs(i[r]);a>n&&(n=a,s=r-1)}return s}function us(i,e,t,o,n=ds){let s=i[t],r=i[o-e];if(Math.abs(s-r)>180){let a=Z(i,0,e,t);a[0]+=Math.round((r-s)/360)*360,G(i,a),a[1]=Math.sign(a[1])*n,G(i,a),a[0]=s,G(i,a)}}function Vi(i,e,t,o){let n=i[0],s;for(let r=t;r<o;r+=e){s=i[r];let a=s-n;(a>180||a<-180)&&(s-=Math.round(a/360)*360),i[r]=n=s}}function Hi(i,e){let t,o=i.length/e;for(let s=0;s<o&&(t=i[s*e],(t+180)%360===0);s++);let n=-Math.round(t/360)*360;if(n!==0)for(let s=0;s<o;s++)i[s*e]+=n}var Ae=class extends re$1{constructor(e){let{indices:t,attributes:o}=hs(e);super(s(r({},e),{topology:`line-list`,indices:t,attributes:o}))}};function hs(i){let{radius:e,height:t=1,nradial:o=10}=i,{vertices:n}=i;n&&(S.assert(n.length>=o),n=n.flatMap(u=>[u[0],u[1]]),Y(n,oe.COUNTER_CLOCKWISE));let s=t>0,r=o+1,a=s?r*3+1:o,l=Math.PI*2/o,c=new Uint16Array(s?o*3*2:0),f=new Float32Array(a*3),d=new Float32Array(a*3),p=0;if(s){for(let u=0;u<r;u++){let g=u*l,h=u%o,v=Math.sin(g),P=Math.cos(g);for(let C=0;C<2;C++)f[p+0]=n?n[h*2]:P*e,f[p+1]=n?n[h*2+1]:v*e,f[p+2]=(1/2-C)*t,d[p+0]=n?n[h*2]:P,d[p+1]=n?n[h*2+1]:v,p+=3}f[p+0]=f[p-3],f[p+1]=f[p-2],f[p+2]=f[p-1],p+=3}for(let u=s?0:1;u<r;u++){let g=Math.floor(u/2)*Math.sign(.5-u%2),h=g*l,v=(g+o)%o,P=Math.sin(h),C=Math.cos(h);f[p+0]=n?n[v*2]:C*e,f[p+1]=n?n[v*2+1]:P*e,f[p+2]=t/2,d[p+2]=1,p+=3}if(s){let u=0;for(let g=0;g<o;g++)c[u++]=g*2+0,c[u++]=g*2+2,c[u++]=g*2+0,c[u++]=g*2+1,c[u++]=g*2+1,c[u++]=g*2+3}return{indices:c,attributes:{POSITION:{size:3,value:f},NORMAL:{size:3,value:d}}}}var xs=`struct ColumnUniforms {
|
|
1984
|
+
radius: f32,
|
|
1985
|
+
angle: f32,
|
|
1986
|
+
offset: vec2<f32>,
|
|
1987
|
+
extruded: f32,
|
|
1988
|
+
stroked: f32,
|
|
1989
|
+
isStroke: f32,
|
|
1990
|
+
coverage: f32,
|
|
1991
|
+
elevationScale: f32,
|
|
1992
|
+
edgeDistance: f32,
|
|
1993
|
+
widthScale: f32,
|
|
1994
|
+
widthMinPixels: f32,
|
|
1995
|
+
widthMaxPixels: f32,
|
|
1996
|
+
radiusUnits: i32,
|
|
1997
|
+
widthUnits: i32,
|
|
1998
|
+
};
|
|
1999
|
+
|
|
2000
|
+
@group(0) @binding(auto) var<uniform> column: ColumnUniforms;
|
|
2001
|
+
`;var Zi=`layout(std140) uniform columnUniforms {
|
|
2002
|
+
float radius;
|
|
2003
|
+
float angle;
|
|
2004
|
+
vec2 offset;
|
|
2005
|
+
bool extruded;
|
|
2006
|
+
bool stroked;
|
|
2007
|
+
bool isStroke;
|
|
2008
|
+
float coverage;
|
|
2009
|
+
float elevationScale;
|
|
2010
|
+
float edgeDistance;
|
|
2011
|
+
float widthScale;
|
|
2012
|
+
float widthMinPixels;
|
|
2013
|
+
float widthMaxPixels;
|
|
2014
|
+
highp int radiusUnits;
|
|
2015
|
+
highp int widthUnits;
|
|
2016
|
+
} column;
|
|
2017
|
+
`;var Ki={name:`column`,source:xs,vs:Zi,fs:Zi,uniformTypes:{radius:`f32`,angle:`f32`,offset:`vec2<f32>`,extruded:`f32`,stroked:`f32`,isStroke:`f32`,coverage:`f32`,elevationScale:`f32`,edgeDistance:`f32`,widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,radiusUnits:`i32`,widthUnits:`i32`}};var $i=`struct Attributes {
|
|
2018
|
+
@builtin(instance_index) instanceIndex: u32,
|
|
2019
|
+
@location(0) positions: vec3<f32>,
|
|
2020
|
+
@location(1) normals: vec3<f32>,
|
|
2021
|
+
@location(2) instancePositions: vec3<f32>,
|
|
2022
|
+
@location(3) instancePositions64Low: vec3<f32>,
|
|
2023
|
+
@location(4) instanceElevations: f32,
|
|
2024
|
+
@location(5) instanceFillColors: vec4<f32>,
|
|
2025
|
+
@location(6) instanceLineColors: vec4<f32>,
|
|
2026
|
+
@location(7) instanceStrokeWidths: f32
|
|
2027
|
+
};
|
|
2028
|
+
|
|
2029
|
+
fn getRotationMatrix(angle: f32) -> mat2x2<f32> {
|
|
2030
|
+
let s = sin(angle);
|
|
2031
|
+
let c = cos(angle);
|
|
2032
|
+
return mat2x2<f32>(
|
|
2033
|
+
vec2<f32>(c, s),
|
|
2034
|
+
vec2<f32>(-s, c)
|
|
2035
|
+
);
|
|
2036
|
+
}
|
|
2037
|
+
|
|
2038
|
+
fn getOffset(
|
|
2039
|
+
positions: vec3<f32>,
|
|
2040
|
+
strokeOffsetRatio: f32,
|
|
2041
|
+
dotRadius: f32,
|
|
2042
|
+
rotationMatrix: mat2x2<f32>
|
|
2043
|
+
) -> vec3<f32> {
|
|
2044
|
+
var offset = (rotationMatrix * positions.xy * strokeOffsetRatio + column.offset) * dotRadius;
|
|
2045
|
+
if (column.radiusUnits == UNIT_METERS) {
|
|
2046
|
+
offset = project_size_vec2(offset);
|
|
2047
|
+
} else if (column.radiusUnits == UNIT_PIXELS) {
|
|
2048
|
+
offset = project_pixel_size_vec2(offset);
|
|
2049
|
+
}
|
|
2050
|
+
return vec3<f32>(offset, 0.0);
|
|
2051
|
+
}
|
|
2052
|
+
`;var vs=`${$i}
|
|
2053
|
+
|
|
2054
|
+
struct Varyings {
|
|
2055
|
+
@builtin(position) position: vec4<f32>,
|
|
2056
|
+
@location(0) color: vec4<f32>
|
|
2057
|
+
};
|
|
2058
|
+
|
|
2059
|
+
@vertex
|
|
2060
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
2061
|
+
var varyings: Varyings;
|
|
2062
|
+
|
|
2063
|
+
geometry.worldPosition = attributes.instancePositions;
|
|
2064
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.instanceIndex);
|
|
2065
|
+
|
|
2066
|
+
let isStroke = column.isStroke > 0.5;
|
|
2067
|
+
let baseColor = select(attributes.instanceFillColors, attributes.instanceLineColors, isStroke);
|
|
2068
|
+
let rotationMatrix = getRotationMatrix(column.angle);
|
|
2069
|
+
|
|
2070
|
+
var elevation = 0.0;
|
|
2071
|
+
var strokeOffsetRatio = 1.0;
|
|
2072
|
+
|
|
2073
|
+
if (column.extruded > 0.5) {
|
|
2074
|
+
elevation =
|
|
2075
|
+
attributes.instanceElevations * (attributes.positions.z + 1.0) / 2.0 * column.elevationScale;
|
|
2076
|
+
} else if (column.stroked > 0.5) {
|
|
2077
|
+
let widthPixels = clamp(
|
|
2078
|
+
project_unit_size_to_pixel(attributes.instanceStrokeWidths * column.widthScale, column.widthUnits),
|
|
2079
|
+
column.widthMinPixels,
|
|
2080
|
+
column.widthMaxPixels
|
|
2081
|
+
) / 2.0;
|
|
2082
|
+
let halfOffset =
|
|
2083
|
+
project_pixel_size_float(widthPixels) /
|
|
2084
|
+
project_size_float(column.edgeDistance * column.coverage * column.radius);
|
|
2085
|
+
if (isStroke) {
|
|
2086
|
+
strokeOffsetRatio -= sign(attributes.positions.z) * halfOffset;
|
|
2087
|
+
} else {
|
|
2088
|
+
strokeOffsetRatio -= halfOffset;
|
|
2089
|
+
}
|
|
2090
|
+
}
|
|
2091
|
+
|
|
2092
|
+
let shouldRender = select(0.0, 1.0, baseColor.a > 0.0 && attributes.instanceElevations >= 0.0);
|
|
2093
|
+
let dotRadius = column.radius * column.coverage * shouldRender;
|
|
2094
|
+
let centroidPosition =
|
|
2095
|
+
vec3<f32>(
|
|
2096
|
+
attributes.instancePositions.xy,
|
|
2097
|
+
attributes.instancePositions.z + elevation
|
|
2098
|
+
);
|
|
2099
|
+
let offset = getOffset(attributes.positions, strokeOffsetRatio, dotRadius, rotationMatrix);
|
|
2100
|
+
let projected = project_position_to_clipspace_and_commonspace(
|
|
2101
|
+
centroidPosition,
|
|
2102
|
+
attributes.instancePositions64Low,
|
|
2103
|
+
offset
|
|
2104
|
+
);
|
|
2105
|
+
|
|
2106
|
+
geometry.position = projected.commonPosition;
|
|
2107
|
+
geometry.normal = project_normal(vec3<f32>(rotationMatrix * attributes.normals.xy, attributes.normals.z));
|
|
2108
|
+
|
|
2109
|
+
let lightColor = lighting_getLightColor2(
|
|
2110
|
+
baseColor.rgb,
|
|
2111
|
+
project.cameraPosition,
|
|
2112
|
+
geometry.position.xyz,
|
|
2113
|
+
geometry.normal
|
|
2114
|
+
);
|
|
2115
|
+
|
|
2116
|
+
varyings.position = projected.clipPosition;
|
|
2117
|
+
varyings.color = vec4<f32>(
|
|
2118
|
+
select(baseColor.rgb, lightColor, column.extruded > 0.5 && !isStroke),
|
|
2119
|
+
baseColor.a * layer.opacity
|
|
2120
|
+
);
|
|
2121
|
+
|
|
2122
|
+
return varyings;
|
|
2123
|
+
}
|
|
2124
|
+
|
|
2125
|
+
@fragment
|
|
2126
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
2127
|
+
geometry.uv = vec2<f32>(0.0);
|
|
2128
|
+
return deckgl_premultiplied_alpha(varyings.color);
|
|
2129
|
+
}
|
|
2130
|
+
`;var ms=`${$i}
|
|
2131
|
+
|
|
2132
|
+
struct Varyings {
|
|
2133
|
+
@builtin(position) position: vec4<f32>,
|
|
2134
|
+
@location(0) color: vec4<f32>,
|
|
2135
|
+
@location(1) cameraPosition: vec3<f32>,
|
|
2136
|
+
@location(2) positionCommonspace: vec4<f32>
|
|
2137
|
+
};
|
|
2138
|
+
|
|
2139
|
+
@vertex
|
|
2140
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
2141
|
+
var varyings: Varyings;
|
|
2142
|
+
|
|
2143
|
+
geometry.worldPosition = attributes.instancePositions;
|
|
2144
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.instanceIndex);
|
|
2145
|
+
|
|
2146
|
+
let isStroke = column.isStroke > 0.5;
|
|
2147
|
+
let baseColor = select(attributes.instanceFillColors, attributes.instanceLineColors, isStroke);
|
|
2148
|
+
let rotationMatrix = getRotationMatrix(column.angle);
|
|
2149
|
+
|
|
2150
|
+
var elevation = 0.0;
|
|
2151
|
+
var strokeOffsetRatio = 1.0;
|
|
2152
|
+
|
|
2153
|
+
if (column.extruded > 0.5) {
|
|
2154
|
+
elevation =
|
|
2155
|
+
attributes.instanceElevations * (attributes.positions.z + 1.0) / 2.0 * column.elevationScale;
|
|
2156
|
+
} else if (column.stroked > 0.5) {
|
|
2157
|
+
let widthPixels = clamp(
|
|
2158
|
+
project_unit_size_to_pixel(attributes.instanceStrokeWidths * column.widthScale, column.widthUnits),
|
|
2159
|
+
column.widthMinPixels,
|
|
2160
|
+
column.widthMaxPixels
|
|
2161
|
+
) / 2.0;
|
|
2162
|
+
let halfOffset =
|
|
2163
|
+
project_pixel_size_float(widthPixels) /
|
|
2164
|
+
project_size_float(column.edgeDistance * column.coverage * column.radius);
|
|
2165
|
+
if (isStroke) {
|
|
2166
|
+
strokeOffsetRatio -= sign(attributes.positions.z) * halfOffset;
|
|
2167
|
+
} else {
|
|
2168
|
+
strokeOffsetRatio -= halfOffset;
|
|
2169
|
+
}
|
|
2170
|
+
}
|
|
2171
|
+
|
|
2172
|
+
let shouldRender = select(0.0, 1.0, baseColor.a > 0.0 && attributes.instanceElevations >= 0.0);
|
|
2173
|
+
let dotRadius = column.radius * column.coverage * shouldRender;
|
|
2174
|
+
let centroidPosition =
|
|
2175
|
+
vec3<f32>(
|
|
2176
|
+
attributes.instancePositions.xy,
|
|
2177
|
+
attributes.instancePositions.z + elevation
|
|
2178
|
+
);
|
|
2179
|
+
let offset = getOffset(attributes.positions, strokeOffsetRatio, dotRadius, rotationMatrix);
|
|
2180
|
+
let projected = project_position_to_clipspace_and_commonspace(
|
|
2181
|
+
centroidPosition,
|
|
2182
|
+
attributes.instancePositions64Low,
|
|
2183
|
+
offset
|
|
2184
|
+
);
|
|
2185
|
+
|
|
2186
|
+
geometry.position = projected.commonPosition;
|
|
2187
|
+
geometry.normal = project_normal(vec3<f32>(rotationMatrix * attributes.normals.xy, attributes.normals.z));
|
|
2188
|
+
|
|
2189
|
+
varyings.position = projected.clipPosition;
|
|
2190
|
+
varyings.color = vec4<f32>(baseColor.rgb, baseColor.a * layer.opacity);
|
|
2191
|
+
varyings.cameraPosition = project.cameraPosition;
|
|
2192
|
+
varyings.positionCommonspace = projected.commonPosition;
|
|
2193
|
+
|
|
2194
|
+
return varyings;
|
|
2195
|
+
}
|
|
2196
|
+
|
|
2197
|
+
@fragment
|
|
2198
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
2199
|
+
geometry.uv = vec2<f32>(0.0);
|
|
2200
|
+
|
|
2201
|
+
var fragColor = varyings.color;
|
|
2202
|
+
if (column.extruded > 0.5 && column.isStroke < 0.5) {
|
|
2203
|
+
// WebGPU's screen-space Y axis reverses the derivative orientation used by GLSL flat shading.
|
|
2204
|
+
let normal = normalize(cross(dpdy(varyings.positionCommonspace.xyz), dpdx(varyings.positionCommonspace.xyz)));
|
|
2205
|
+
fragColor = vec4<f32>(
|
|
2206
|
+
lighting_getLightColor2(
|
|
2207
|
+
varyings.color.rgb,
|
|
2208
|
+
varyings.cameraPosition,
|
|
2209
|
+
varyings.positionCommonspace.xyz,
|
|
2210
|
+
normal
|
|
2211
|
+
),
|
|
2212
|
+
varyings.color.a
|
|
2213
|
+
);
|
|
2214
|
+
}
|
|
2215
|
+
|
|
2216
|
+
return deckgl_premultiplied_alpha(fragColor);
|
|
2217
|
+
}
|
|
2218
|
+
`;function Yi(i){return i?ms:vs}var Ji=`#version 300 es
|
|
2219
|
+
#define SHADER_NAME column-layer-vertex-shader
|
|
2220
|
+
in vec3 positions;
|
|
2221
|
+
in vec3 normals;
|
|
2222
|
+
in vec3 instancePositions;
|
|
2223
|
+
in float instanceElevations;
|
|
2224
|
+
in vec3 instancePositions64Low;
|
|
2225
|
+
in vec4 instanceFillColors;
|
|
2226
|
+
in vec4 instanceLineColors;
|
|
2227
|
+
in float instanceStrokeWidths;
|
|
2228
|
+
out vec4 vColor;
|
|
2229
|
+
#ifdef FLAT_SHADING
|
|
2230
|
+
out vec3 cameraPosition;
|
|
2231
|
+
out vec4 position_commonspace;
|
|
2232
|
+
#endif
|
|
2233
|
+
void main(void) {
|
|
2234
|
+
geometry.worldPosition = instancePositions;
|
|
2235
|
+
vec4 color = column.isStroke ? instanceLineColors : instanceFillColors;
|
|
2236
|
+
mat2 rotationMatrix = mat2(cos(column.angle), sin(column.angle), -sin(column.angle), cos(column.angle));
|
|
2237
|
+
float elevation = 0.0;
|
|
2238
|
+
float strokeOffsetRatio = 1.0;
|
|
2239
|
+
if (column.extruded) {
|
|
2240
|
+
elevation = instanceElevations * (positions.z + 1.0) / 2.0 * column.elevationScale;
|
|
2241
|
+
} else if (column.stroked) {
|
|
2242
|
+
float widthPixels = clamp(
|
|
2243
|
+
project_size_to_pixel(instanceStrokeWidths * column.widthScale, column.widthUnits),
|
|
2244
|
+
column.widthMinPixels, column.widthMaxPixels) / 2.0;
|
|
2245
|
+
float halfOffset = project_pixel_size(widthPixels) / project_size(column.edgeDistance * column.coverage * column.radius);
|
|
2246
|
+
if (column.isStroke) {
|
|
2247
|
+
strokeOffsetRatio -= sign(positions.z) * halfOffset;
|
|
2248
|
+
} else {
|
|
2249
|
+
strokeOffsetRatio -= halfOffset;
|
|
2250
|
+
}
|
|
2251
|
+
}
|
|
2252
|
+
float shouldRender = float(color.a > 0.0 && instanceElevations >= 0.0);
|
|
2253
|
+
float dotRadius = column.radius * column.coverage * shouldRender;
|
|
2254
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
2255
|
+
vec3 centroidPosition = vec3(instancePositions.xy, instancePositions.z + elevation);
|
|
2256
|
+
vec3 centroidPosition64Low = instancePositions64Low;
|
|
2257
|
+
vec2 offset = (rotationMatrix * positions.xy * strokeOffsetRatio + column.offset) * dotRadius;
|
|
2258
|
+
if (column.radiusUnits == UNIT_METERS) {
|
|
2259
|
+
offset = project_size(offset);
|
|
2260
|
+
} else if (column.radiusUnits == UNIT_PIXELS) {
|
|
2261
|
+
offset = project_pixel_size(offset);
|
|
2262
|
+
}
|
|
2263
|
+
vec3 pos = vec3(offset, 0.);
|
|
2264
|
+
DECKGL_FILTER_SIZE(pos, geometry);
|
|
2265
|
+
gl_Position = project_position_to_clipspace(centroidPosition, centroidPosition64Low, pos, geometry.position);
|
|
2266
|
+
geometry.normal = project_normal(vec3(rotationMatrix * normals.xy, normals.z));
|
|
2267
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
2268
|
+
if (column.extruded && !column.isStroke) {
|
|
2269
|
+
#ifdef FLAT_SHADING
|
|
2270
|
+
cameraPosition = project.cameraPosition;
|
|
2271
|
+
position_commonspace = geometry.position;
|
|
2272
|
+
vColor = vec4(color.rgb, color.a * layer.opacity);
|
|
2273
|
+
#else
|
|
2274
|
+
vec3 lightColor = lighting_getLightColor(color.rgb, project.cameraPosition, geometry.position.xyz, geometry.normal);
|
|
2275
|
+
vColor = vec4(lightColor, color.a * layer.opacity);
|
|
2276
|
+
#endif
|
|
2277
|
+
} else {
|
|
2278
|
+
vColor = vec4(color.rgb, color.a * layer.opacity);
|
|
2279
|
+
}
|
|
2280
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
2281
|
+
}
|
|
2282
|
+
`;var Xi=`#version 300 es
|
|
2283
|
+
#define SHADER_NAME column-layer-fragment-shader
|
|
2284
|
+
precision highp float;
|
|
2285
|
+
out vec4 fragColor;
|
|
2286
|
+
in vec4 vColor;
|
|
2287
|
+
#ifdef FLAT_SHADING
|
|
2288
|
+
in vec3 cameraPosition;
|
|
2289
|
+
in vec4 position_commonspace;
|
|
2290
|
+
#endif
|
|
2291
|
+
void main(void) {
|
|
2292
|
+
fragColor = vColor;
|
|
2293
|
+
geometry.uv = vec2(0.);
|
|
2294
|
+
#ifdef FLAT_SHADING
|
|
2295
|
+
if (column.extruded && !column.isStroke && !bool(picking.isActive)) {
|
|
2296
|
+
vec3 normal = normalize(cross(dFdx(position_commonspace.xyz), dFdy(position_commonspace.xyz)));
|
|
2297
|
+
fragColor.rgb = lighting_getLightColor(vColor.rgb, cameraPosition, position_commonspace.xyz, normal);
|
|
2298
|
+
}
|
|
2299
|
+
#endif
|
|
2300
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
2301
|
+
}
|
|
2302
|
+
`;var at=[0,0,0,255];var ys={name:`geometry`,stepMode:`vertex`,byteStride:24,attributes:[{attribute:`positions`,format:`float32x3`,byteOffset:0},{attribute:`normals`,format:`float32x3`,byteOffset:12}]};var Ps={diskResolution:{type:`number`,min:4,value:20},vertices:null,radius:{type:`number`,min:0,value:1e3},angle:{type:`number`,value:0},offset:{type:`array`,value:[0,0]},coverage:{type:`number`,min:0,max:1,value:1},elevationScale:{type:`number`,min:0,value:1},radiusUnits:`meters`,lineWidthUnits:`meters`,lineWidthScale:1,lineWidthMinPixels:0,lineWidthMaxPixels:Number.MAX_SAFE_INTEGER,extruded:!0,wireframe:!1,filled:!0,stroked:!1,flatShading:!1,getPosition:{type:`accessor`,value:i=>i.position},getFillColor:{type:`accessor`,value:at},getLineColor:{type:`accessor`,value:at},getLineWidth:{type:`accessor`,value:1},getElevation:{type:`accessor`,value:1e3},material:!0,getColor:{deprecatedFor:[`getFillColor`,`getLineColor`]}};var Ee=class extends ao{getShaders(){let e={},{flatShading:t}=this.props;return t&&(e.FLAT_SHADING=1),super.getShaders({vs:Ji,fs:Xi,source:Yi(t),defines:e,modules:[Wa,ma,t?Ko$1:Zo$1,Ka,Ki]})}initializeState(){this.getAttributeManager().addInstanced({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceElevations:{size:1,transition:!0,accessor:`getElevation`},instanceFillColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getFillColor`,defaultValue:at},instanceLineColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getLineColor`,defaultValue:at},instanceStrokeWidths:{size:1,accessor:`getLineWidth`,transition:!0}})}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e,s=n.extensionsChanged||t.flatShading!==o.flatShading;s&&(this.state.models?.forEach(a=>a.destroy()),this.setState(this._getModels()),this.getAttributeManager().invalidateAll());let r=this.getNumInstances();this.state.fillModel.setInstanceCount(r),this.state.strokeModel.setInstanceCount(r),this.state.wireframeModel.setInstanceCount(r),(s||t.diskResolution!==o.diskResolution||t.vertices!==o.vertices||t.extruded!==o.extruded||t.stroked!==o.stroked)&&this._updateGeometry(t)}getGeometry(e,t,o){let n=new Ae({radius:1,height:o?2:0,vertices:t,nradial:e}),s=0;if(t)for(let r=0;r<e;r++){let a=t[r],l=Math.sqrt(a[0]*a[0]+a[1]*a[1]);s+=l/e}else s=1;return this.setState({edgeDistance:Math.cos(Math.PI/e)*s}),n}_getModels(){let e=this.getShaders(),t=[...this.getAttributeManager().getBufferLayouts(),ys],o=new De(this.context.device,s(r({},e),{id:`${this.props.id}-fill`,bufferLayout:t,isInstanced:!0})),n=new De(this.context.device,s(r({},e),{id:`${this.props.id}-stroke`,bufferLayout:t,isInstanced:!0})),s$4=new De(this.context.device,s(r({},e),{id:`${this.props.id}-wireframe`,bufferLayout:t,isInstanced:!0}));return{fillModel:o,strokeModel:n,wireframeModel:s$4,models:[s$4,o,n]}}_updateGeometry({diskResolution:e,vertices:t,extruded:o,stroked:n}){let s=this.getGeometry(e,t,o||n),r=s.attributes.POSITION,a=s.attributes.NORMAL;if(this._setFillGeometry(new re$1({topology:`triangle-strip`,attributes:{POSITION:r,NORMAL:a}})),!o&&n){let l=r.value.length/3;this._setStrokeGeometry(new re$1({topology:`triangle-strip`,vertexCount:l-e-1,attributes:{POSITION:r,NORMAL:a}}))}o&&this._setWireframeGeometry(s)}_setFillGeometry(e){let t=pt$1(e,{attributes:[`POSITION`,`NORMAL`]});this.state.fillModel.setGeometry(t)}_setStrokeGeometry(e){let t=pt$1(e,{attributes:[`POSITION`,`NORMAL`]});this.state.strokeModel.setGeometry(t)}_setWireframeGeometry(e){let t=pt$1(e,{attributes:[`POSITION`,`NORMAL`]}),o=this.state.wireframeModel;o.setGeometry(t),o.setTopology(`line-list`)}draw({uniforms:e}){let{lineWidthUnits:t,lineWidthScale:o,lineWidthMinPixels:n,lineWidthMaxPixels:s$5,radiusUnits:r$5,elevationScale:a,extruded:l,filled:c,stroked:f,wireframe:d,offset:p,coverage:u,radius:g,angle:h}=this.props,v=this.state.fillModel,P=this.state.strokeModel,C=this.state.wireframeModel,{edgeDistance:m}=this.state,x={radius:g,angle:h/180*Math.PI,offset:p,extruded:l,stroked:f,coverage:u,elevationScale:a,edgeDistance:m,radiusUnits:ee[r$5],widthUnits:ee[t],widthScale:o,widthMinPixels:n,widthMaxPixels:s$5};l&&d&&(C.shaderInputs.setProps({column:s(r({},x),{isStroke:!0})}),C.draw(this.context.renderPass)),c&&(v.shaderInputs.setProps({column:s(r({},x),{isStroke:!1})}),v.draw(this.context.renderPass)),!l&&f&&(P.shaderInputs.setProps({column:s(r({},x),{isStroke:!0})}),P.draw(this.context.renderPass))}};Ee.layerName=`ColumnLayer`;Ee.defaultProps=Ps;var Tt=Ee;var _s={cellSize:{type:`number`,min:0,value:1e3},offset:{type:`array`,value:[1,1]}};var Te=class extends Tt{_updateGeometry(){let e=new qr;this._setFillGeometry(e)}draw({uniforms:e}){let{elevationScale:t,extruded:o,offset:n,coverage:s,cellSize:r,angle:a,radiusUnits:l}=this.props,c=this.state.fillModel,f={radius:r/2,radiusUnits:ee[l],angle:a,offset:n,extruded:o,stroked:!1,coverage:s,elevationScale:t,edgeDistance:1,isStroke:!1,widthUnits:0,widthScale:0,widthMinPixels:0,widthMaxPixels:0};c.shaderInputs.setProps({column:f}),c.draw(this.context.renderPass)}};Te.layerName=`GridCellLayer`;Te.defaultProps=_s;var Cs=Te;function qi(i,e,t,o){let n;if(Array.isArray(i[0])){let s=i.length*e;n=new Array(s);for(let r=0;r<i.length;r++)for(let a=0;a<e;a++)n[r*e+a]=i[r][a]||0}else n=i;return t?we(n,{size:e,gridResolution:t}):o?At(n,{size:e}):n}var Ss=1;var Ls=2;var Oe=4;var Re=class extends xs$1{constructor(e){super(s(r({},e),{attributes:{positions:{size:3,padding:18,initialize:!0,type:e.fp64?Float64Array:Float32Array},segmentTypes:{size:1,type:e.isWebGPU?Float32Array:Uint8ClampedArray}}}))}get(e){return this.attributes[e]}getPathSegmentIndices(e){let t=this.attributes.segmentTypes,o=this.vertexStarts[e],n=Math.min(this.vertexStarts[e+1]??this.instanceCount,this.instanceCount),s=[];for(let r=o;r<n-1;r++)(t[r]&Oe)===0&&s.push(r);return s.length&&(t[o]&Oe)!==0&&s.unshift(s.pop()),s}getGeometryFromBuffer(e){return this.normalize||this.opts.isWebGPU?super.getGeometryFromBuffer(e):null}normalizeGeometry(e){return this.normalize?qi(e,this.positionSize,this.opts.resolution,this.opts.wrapLongitude):e}getGeometrySize(e){if(Qi(e)){let o=0;for(let n of e)o+=this.getGeometrySize(n);return o}let t=this.getPathLength(e);return t<2?0:this.isClosed(e)?t<3?0:t+2:t}updateGeometryAttributes(e,t){if(t.geometrySize!==0)if(e&&Qi(e))for(let o of e){let n=this.getGeometrySize(o);t.geometrySize=n,this.updateGeometryAttributes(o,t),t.vertexStart+=n}else this._updateSegmentTypes(e,t),this._updatePositions(e,t)}_updateSegmentTypes(e,t){let o=this.attributes.segmentTypes,n=e?this.isClosed(e):!1,{vertexStart:s,geometrySize:r}=t;o.fill(0,s,s+r),n?(o[s]=Oe,o[s+r-2]=Oe):(o[s]+=Ss,o[s+r-2]+=Ls),o[s+r-1]=Oe}_updatePositions(e,t){let{positions:o}=this.attributes;if(!o||!e)return;let{vertexStart:n,geometrySize:s}=t,r=new Array(3);for(let a=n,l=0;l<s;a++,l++)this.getPointOnPath(e,l,r),o[a*3]=r[0],o[a*3+1]=r[1],o[a*3+2]=r[2]}getPathLength(e){return e.length/this.positionSize}getPointOnPath(e,t,o=[]){let{positionSize:n}=this;t*n>=e.length&&(t+=1-e.length/n);let s=t*n;return o[0]=e[s],o[1]=e[s+1],o[2]=n===3&&e[s+2]||0,o}isClosed(e){if(!this.normalize)return!!this.opts.loop;let{positionSize:t}=this,o=e.length-t;return e[0]===e[o]&&e[1]===e[o+1]&&(t===2||e[2]===e[o+2])}};function Qi(i){return Array.isArray(i[0])}var bs=`struct PathUniforms {
|
|
2303
|
+
widthScale: f32,
|
|
2304
|
+
widthMinPixels: f32,
|
|
2305
|
+
widthMaxPixels: f32,
|
|
2306
|
+
jointType: f32,
|
|
2307
|
+
capType: f32,
|
|
2308
|
+
miterLimit: f32,
|
|
2309
|
+
billboard: f32,
|
|
2310
|
+
widthUnits: i32,
|
|
2311
|
+
};
|
|
2312
|
+
|
|
2313
|
+
@group(0) @binding(auto)
|
|
2314
|
+
var<uniform> path: PathUniforms;
|
|
2315
|
+
`;var eo=`layout(std140) uniform pathUniforms {
|
|
2316
|
+
float widthScale;
|
|
2317
|
+
float widthMinPixels;
|
|
2318
|
+
float widthMaxPixels;
|
|
2319
|
+
float jointType;
|
|
2320
|
+
float capType;
|
|
2321
|
+
float miterLimit;
|
|
2322
|
+
bool billboard;
|
|
2323
|
+
highp int widthUnits;
|
|
2324
|
+
} path;
|
|
2325
|
+
`;var to={name:`path`,source:bs,vs:eo,fs:eo,uniformTypes:{widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,jointType:`f32`,capType:`f32`,miterLimit:`f32`,billboard:`f32`,widthUnits:`i32`}};var io=`const EPSILON: f32 = 0.001;
|
|
2326
|
+
const ZERO_OFFSET: vec3<f32> = vec3<f32>(0.0, 0.0, 0.0);
|
|
2327
|
+
|
|
2328
|
+
struct JoinResult {
|
|
2329
|
+
offset: vec3<f32>,
|
|
2330
|
+
cornerOffset: vec2<f32>,
|
|
2331
|
+
miterLength: f32,
|
|
2332
|
+
pathPosition: vec2<f32>,
|
|
2333
|
+
pathLength: f32,
|
|
2334
|
+
jointType: f32,
|
|
2335
|
+
};
|
|
2336
|
+
|
|
2337
|
+
struct Attributes {
|
|
2338
|
+
@location(0) positions: vec2<f32>,
|
|
2339
|
+
@location(1) instanceTypes: f32,
|
|
2340
|
+
@location(2) instanceLeftPositions: vec3<f32>,
|
|
2341
|
+
@location(3) instanceStartPositions: vec3<f32>,
|
|
2342
|
+
@location(4) instanceEndPositions: vec3<f32>,
|
|
2343
|
+
@location(5) instanceRightPositions: vec3<f32>,
|
|
2344
|
+
@location(6) instanceLeftPositions64Low: vec3<f32>,
|
|
2345
|
+
@location(7) instanceStartPositions64Low: vec3<f32>,
|
|
2346
|
+
@location(8) instanceEndPositions64Low: vec3<f32>,
|
|
2347
|
+
@location(9) instanceRightPositions64Low: vec3<f32>,
|
|
2348
|
+
@location(10) instanceStrokeWidths: f32,
|
|
2349
|
+
@location(11) instanceColors: vec4<f32>,
|
|
2350
|
+
@location(12) rowIndexes: u32,
|
|
2351
|
+
};
|
|
2352
|
+
|
|
2353
|
+
struct Varyings {
|
|
2354
|
+
@builtin(position) position: vec4<f32>,
|
|
2355
|
+
@location(0) vColor: vec4<f32>,
|
|
2356
|
+
@location(1) vCornerOffset: vec2<f32>,
|
|
2357
|
+
@location(2) vMiterLength: f32,
|
|
2358
|
+
@location(3) vPathPosition: vec2<f32>,
|
|
2359
|
+
@location(4) vPathLength: f32,
|
|
2360
|
+
@location(5) vJointType: f32,
|
|
2361
|
+
// Location 6 is reserved for TripsLayer's injected vTime varying.
|
|
2362
|
+
@location(7) clipCoordinates: vec2<f32>,
|
|
2363
|
+
#ifdef DASH_ENABLED
|
|
2364
|
+
@location(8) vPathBounds: vec2<f32>,
|
|
2365
|
+
#endif
|
|
2366
|
+
};
|
|
2367
|
+
|
|
2368
|
+
fn flipIfTrue(flag: bool) -> f32 {
|
|
2369
|
+
return select(1.0, -1.0, flag);
|
|
2370
|
+
}
|
|
2371
|
+
|
|
2372
|
+
fn clipLine(position: vec4<f32>, refPosition: vec4<f32>) -> vec4<f32> {
|
|
2373
|
+
if (position.w < EPSILON) {
|
|
2374
|
+
let r = (EPSILON - refPosition.w) / (position.w - refPosition.w);
|
|
2375
|
+
return refPosition + (position - refPosition) * r;
|
|
2376
|
+
}
|
|
2377
|
+
return position;
|
|
2378
|
+
}
|
|
2379
|
+
|
|
2380
|
+
#ifdef DASH_ENABLED
|
|
2381
|
+
// Return the visible interval of the original segment before clipLine moves either endpoint.
|
|
2382
|
+
fn getClippedPathRange(startW: f32, endW: f32) -> vec2<f32> {
|
|
2383
|
+
let startClipped = startW < EPSILON;
|
|
2384
|
+
let endClipped = endW < EPSILON;
|
|
2385
|
+
if (startClipped && endClipped) {
|
|
2386
|
+
return vec2<f32>(0.0, 0.0);
|
|
2387
|
+
}
|
|
2388
|
+
if (startClipped || endClipped) {
|
|
2389
|
+
let intersection = clamp((EPSILON - startW) / (endW - startW), 0.0, 1.0);
|
|
2390
|
+
if (startClipped) {
|
|
2391
|
+
return vec2<f32>(intersection, 1.0);
|
|
2392
|
+
}
|
|
2393
|
+
return vec2<f32>(0.0, intersection);
|
|
2394
|
+
}
|
|
2395
|
+
return vec2<f32>(0.0, 1.0);
|
|
2396
|
+
}
|
|
2397
|
+
#endif
|
|
2398
|
+
|
|
2399
|
+
fn getLineJoinOffset(
|
|
2400
|
+
prevPoint: vec3<f32>,
|
|
2401
|
+
currPoint: vec3<f32>,
|
|
2402
|
+
nextPoint: vec3<f32>,
|
|
2403
|
+
width: vec2<f32>,
|
|
2404
|
+
#ifdef DASH_ENABLED
|
|
2405
|
+
sourcePathLength: f32,
|
|
2406
|
+
sourcePathRange: vec2<f32>,
|
|
2407
|
+
#endif
|
|
2408
|
+
#ifdef ANTIALIASING
|
|
2409
|
+
coverageScale: f32,
|
|
2410
|
+
#endif
|
|
2411
|
+
positions: vec2<f32>,
|
|
2412
|
+
instanceTypes: f32
|
|
2413
|
+
) -> JoinResult {
|
|
2414
|
+
let isEnd = positions.x > 0.0;
|
|
2415
|
+
let sideOfPath = positions.y;
|
|
2416
|
+
let isJoint = select(0.0, 1.0, sideOfPath == 0.0);
|
|
2417
|
+
|
|
2418
|
+
var deltaA3 = currPoint - prevPoint;
|
|
2419
|
+
var deltaB3 = nextPoint - currPoint;
|
|
2420
|
+
|
|
2421
|
+
let rotationResult = project_needs_rotation(currPoint);
|
|
2422
|
+
if (path.billboard == 0.0 && rotationResult.needsRotation) {
|
|
2423
|
+
deltaA3 = rotationResult.transform * deltaA3;
|
|
2424
|
+
deltaB3 = rotationResult.transform * deltaB3;
|
|
2425
|
+
}
|
|
2426
|
+
|
|
2427
|
+
let deltaA = deltaA3.xy / width;
|
|
2428
|
+
let deltaB = deltaB3.xy / width;
|
|
2429
|
+
|
|
2430
|
+
let lenA = length(deltaA);
|
|
2431
|
+
let lenB = length(deltaB);
|
|
2432
|
+
|
|
2433
|
+
let dirA = select(vec2<f32>(0.0, 0.0), normalize(deltaA), lenA > 0.0);
|
|
2434
|
+
let dirB = select(vec2<f32>(0.0, 0.0), normalize(deltaB), lenB > 0.0);
|
|
2435
|
+
|
|
2436
|
+
let perpA = vec2<f32>(-dirA.y, dirA.x);
|
|
2437
|
+
let perpB = vec2<f32>(-dirB.y, dirB.x);
|
|
2438
|
+
|
|
2439
|
+
var tangent = dirA + dirB;
|
|
2440
|
+
tangent = select(perpA, normalize(tangent), length(tangent) > 0.0);
|
|
2441
|
+
let miterVec = vec2<f32>(-tangent.y, tangent.x);
|
|
2442
|
+
let dir = select(dirB, dirA, isEnd);
|
|
2443
|
+
let perp = select(perpB, perpA, isEnd);
|
|
2444
|
+
#ifdef DASH_ENABLED
|
|
2445
|
+
let segmentLength2D = select(lenB, lenA, isEnd);
|
|
2446
|
+
|
|
2447
|
+
// Extrusion happens in the XY plane, so segmentLength2D is a 2D length and pathPosition.y
|
|
2448
|
+
// below measures 2D distance along the segment. For a path that also moves in Z the true
|
|
2449
|
+
// arc length is longer by this ratio. Scaling pathLength and pathPosition.y by it makes
|
|
2450
|
+
// the coordinate measure real 3D distance while leaving the joint tests unchanged, since
|
|
2451
|
+
// they compare the two against each other and both are scaled alike. Billboard mode
|
|
2452
|
+
// extrudes in clip space, where the perspective divide has already reduced the segment to
|
|
2453
|
+
// its screen projection, so its complete common-space length is supplied by the caller.
|
|
2454
|
+
// Mirrors path-layer-vertex.glsl.ts.
|
|
2455
|
+
let currDelta3 = select(deltaB3, deltaA3, isEnd);
|
|
2456
|
+
let currLength2D = length(currDelta3.xy);
|
|
2457
|
+
// Do not clamp a valid denominator to EPSILON: high-zoom Web Mercator deltas are often
|
|
2458
|
+
// smaller than that in common space, and changing their scale corrupts even flat paths.
|
|
2459
|
+
let safeLength2D = select(1.0, currLength2D, currLength2D > 0.0);
|
|
2460
|
+
var arcLengthRatio = 1.0;
|
|
2461
|
+
var pathPositionOffset = 0.0;
|
|
2462
|
+
var pathLength = segmentLength2D;
|
|
2463
|
+
if (path.billboard != 0.0) {
|
|
2464
|
+
// clipLine may shorten the visible screen-space segment. Preserve the corresponding interval
|
|
2465
|
+
// of the complete common-space arclength instead of compressing the full dash period into the
|
|
2466
|
+
// visible span. Keep pathLength complete so justification is stable as the camera clips it.
|
|
2467
|
+
let visiblePathLength = sourcePathLength * (sourcePathRange.y - sourcePathRange.x);
|
|
2468
|
+
arcLengthRatio = 0.0;
|
|
2469
|
+
if (segmentLength2D > 0.0) {
|
|
2470
|
+
arcLengthRatio = visiblePathLength / segmentLength2D;
|
|
2471
|
+
}
|
|
2472
|
+
pathPositionOffset = sourcePathLength * sourcePathRange.x;
|
|
2473
|
+
pathLength = sourcePathLength;
|
|
2474
|
+
} else if (currLength2D > 0.0) {
|
|
2475
|
+
arcLengthRatio = length(currDelta3) / safeLength2D;
|
|
2476
|
+
pathLength = segmentLength2D * arcLengthRatio;
|
|
2477
|
+
}
|
|
2478
|
+
#else
|
|
2479
|
+
let pathLength = select(lenB, lenA, isEnd);
|
|
2480
|
+
#endif
|
|
2481
|
+
|
|
2482
|
+
let sinHalfA = abs(dot(miterVec, perp));
|
|
2483
|
+
let cosHalfA = abs(dot(dirA, miterVec));
|
|
2484
|
+
let turnDirection = flipIfTrue(dirA.x * dirB.y >= dirA.y * dirB.x);
|
|
2485
|
+
let cornerPosition = sideOfPath * turnDirection;
|
|
2486
|
+
|
|
2487
|
+
var miterSize = 1.0 / max(sinHalfA, EPSILON);
|
|
2488
|
+
miterSize = mix(
|
|
2489
|
+
min(miterSize, max(lenA, lenB) / max(cosHalfA, EPSILON)),
|
|
2490
|
+
miterSize,
|
|
2491
|
+
step(0.0, cornerPosition)
|
|
2492
|
+
);
|
|
2493
|
+
|
|
2494
|
+
var offsetVec =
|
|
2495
|
+
mix(miterVec * miterSize, perp, step(0.5, cornerPosition)) *
|
|
2496
|
+
(sideOfPath + isJoint * turnDirection);
|
|
2497
|
+
|
|
2498
|
+
let isStartCap = lenA == 0.0 || (!isEnd && (instanceTypes == 1.0 || instanceTypes == 3.0));
|
|
2499
|
+
let isEndCap = lenB == 0.0 || (isEnd && (instanceTypes == 2.0 || instanceTypes == 3.0));
|
|
2500
|
+
let isCap = isStartCap || isEndCap;
|
|
2501
|
+
|
|
2502
|
+
var jointType = path.jointType;
|
|
2503
|
+
if (isCap) {
|
|
2504
|
+
offsetVec = mix(
|
|
2505
|
+
perp * sideOfPath,
|
|
2506
|
+
dir * path.capType * 4.0 * flipIfTrue(isStartCap),
|
|
2507
|
+
isJoint
|
|
2508
|
+
);
|
|
2509
|
+
jointType = path.capType;
|
|
2510
|
+
}
|
|
2511
|
+
|
|
2512
|
+
#ifdef ANTIALIASING
|
|
2513
|
+
let coverageOffsetVec = offsetVec * coverageScale;
|
|
2514
|
+
var miterLength = dot(coverageOffsetVec, miterVec * turnDirection);
|
|
2515
|
+
#else
|
|
2516
|
+
var miterLength = dot(offsetVec, miterVec * turnDirection);
|
|
2517
|
+
#endif
|
|
2518
|
+
miterLength = select(miterLength, isJoint, isCap);
|
|
2519
|
+
|
|
2520
|
+
#ifdef ANTIALIASING
|
|
2521
|
+
let offsetFromStartOfPath = coverageOffsetVec + deltaA * select(0.0, 1.0, isEnd);
|
|
2522
|
+
#else
|
|
2523
|
+
let offsetFromStartOfPath = offsetVec + deltaA * select(0.0, 1.0, isEnd);
|
|
2524
|
+
#endif
|
|
2525
|
+
let pathPosition = vec2<f32>(
|
|
2526
|
+
dot(offsetFromStartOfPath, perp),
|
|
2527
|
+
#ifdef DASH_ENABLED
|
|
2528
|
+
pathPositionOffset + dot(offsetFromStartOfPath, dir) * arcLengthRatio
|
|
2529
|
+
#else
|
|
2530
|
+
dot(offsetFromStartOfPath, dir)
|
|
2531
|
+
#endif
|
|
2532
|
+
);
|
|
2533
|
+
let isValid = step(f32(instanceTypes), 3.5);
|
|
2534
|
+
#ifdef ANTIALIASING
|
|
2535
|
+
var offset = vec3<f32>(coverageOffsetVec * width * isValid, 0.0);
|
|
2536
|
+
#else
|
|
2537
|
+
var offset = vec3<f32>(offsetVec * width * isValid, 0.0);
|
|
2538
|
+
#endif
|
|
2539
|
+
|
|
2540
|
+
if (path.billboard == 0.0 && rotationResult.needsRotation) {
|
|
2541
|
+
offset = rotationResult.transform * offset;
|
|
2542
|
+
}
|
|
2543
|
+
|
|
2544
|
+
#ifdef ANTIALIASING
|
|
2545
|
+
return JoinResult(
|
|
2546
|
+
offset, coverageOffsetVec, miterLength, pathPosition, pathLength, jointType
|
|
2547
|
+
);
|
|
2548
|
+
#else
|
|
2549
|
+
return JoinResult(offset, offsetVec, miterLength, pathPosition, pathLength, jointType);
|
|
2550
|
+
#endif
|
|
2551
|
+
}
|
|
2552
|
+
|
|
2553
|
+
@vertex
|
|
2554
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
2555
|
+
var varyings: Varyings;
|
|
2556
|
+
|
|
2557
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.rowIndexes);
|
|
2558
|
+
|
|
2559
|
+
let isEnd = attributes.positions.x;
|
|
2560
|
+
|
|
2561
|
+
let prevPosition = mix(attributes.instanceLeftPositions, attributes.instanceStartPositions, isEnd);
|
|
2562
|
+
let prevPosition64Low = mix(
|
|
2563
|
+
attributes.instanceLeftPositions64Low,
|
|
2564
|
+
attributes.instanceStartPositions64Low,
|
|
2565
|
+
isEnd
|
|
2566
|
+
);
|
|
2567
|
+
let currPosition = mix(attributes.instanceStartPositions, attributes.instanceEndPositions, isEnd);
|
|
2568
|
+
let currPosition64Low = mix(
|
|
2569
|
+
attributes.instanceStartPositions64Low,
|
|
2570
|
+
attributes.instanceEndPositions64Low,
|
|
2571
|
+
isEnd
|
|
2572
|
+
);
|
|
2573
|
+
let nextPosition = mix(attributes.instanceEndPositions, attributes.instanceRightPositions, isEnd);
|
|
2574
|
+
let nextPosition64Low = mix(
|
|
2575
|
+
attributes.instanceEndPositions64Low,
|
|
2576
|
+
attributes.instanceRightPositions64Low,
|
|
2577
|
+
isEnd
|
|
2578
|
+
);
|
|
2579
|
+
|
|
2580
|
+
geometry.worldPosition = currPosition;
|
|
2581
|
+
|
|
2582
|
+
let widthPixels =
|
|
2583
|
+
clamp(
|
|
2584
|
+
project_unit_size_to_pixel(attributes.instanceStrokeWidths * path.widthScale, path.widthUnits),
|
|
2585
|
+
path.widthMinPixels,
|
|
2586
|
+
path.widthMaxPixels
|
|
2587
|
+
) / 2.0;
|
|
2588
|
+
|
|
2589
|
+
if (path.billboard != 0.0) {
|
|
2590
|
+
#ifdef DASH_ENABLED
|
|
2591
|
+
let prevProjection = project_position_to_clipspace_and_commonspace(
|
|
2592
|
+
prevPosition, prevPosition64Low, ZERO_OFFSET
|
|
2593
|
+
);
|
|
2594
|
+
let nextProjection = project_position_to_clipspace_and_commonspace(
|
|
2595
|
+
nextPosition, nextPosition64Low, ZERO_OFFSET
|
|
2596
|
+
);
|
|
2597
|
+
let prevPositionCommon = prevProjection.commonPosition.xyz;
|
|
2598
|
+
let nextPositionCommon = nextProjection.commonPosition.xyz;
|
|
2599
|
+
var prevPositionScreen = prevProjection.clipPosition;
|
|
2600
|
+
var nextPositionScreen = nextProjection.clipPosition;
|
|
2601
|
+
#else
|
|
2602
|
+
var prevPositionScreen = project_position_to_clipspace(
|
|
2603
|
+
prevPosition, prevPosition64Low, ZERO_OFFSET
|
|
2604
|
+
);
|
|
2605
|
+
var nextPositionScreen = project_position_to_clipspace(
|
|
2606
|
+
nextPosition, nextPosition64Low, ZERO_OFFSET
|
|
2607
|
+
);
|
|
2608
|
+
#endif
|
|
2609
|
+
let currProjection = project_position_to_clipspace_and_commonspace(
|
|
2610
|
+
currPosition, currPosition64Low, ZERO_OFFSET
|
|
2611
|
+
);
|
|
2612
|
+
geometry.position = currProjection.commonPosition;
|
|
2613
|
+
var currPositionScreen = currProjection.clipPosition;
|
|
2614
|
+
#ifdef DASH_ENABLED
|
|
2615
|
+
let currPositionCommon = currProjection.commonPosition.xyz;
|
|
2616
|
+
let sourcePathStartScreen = mix(currPositionScreen, prevPositionScreen, isEnd);
|
|
2617
|
+
let sourcePathEndScreen = mix(nextPositionScreen, currPositionScreen, isEnd);
|
|
2618
|
+
let billboardPathRange = getClippedPathRange(
|
|
2619
|
+
sourcePathStartScreen.w, sourcePathEndScreen.w
|
|
2620
|
+
);
|
|
2621
|
+
#endif
|
|
2622
|
+
|
|
2623
|
+
prevPositionScreen = clipLine(prevPositionScreen, currPositionScreen);
|
|
2624
|
+
nextPositionScreen = clipLine(nextPositionScreen, currPositionScreen);
|
|
2625
|
+
currPositionScreen = clipLine(currPositionScreen, mix(nextPositionScreen, prevPositionScreen, isEnd));
|
|
2626
|
+
|
|
2627
|
+
#ifdef ANTIALIASING
|
|
2628
|
+
let coverageScale = select(
|
|
2629
|
+
1.0,
|
|
2630
|
+
(widthPixels + 0.5 / project.devicePixelRatio) / max(widthPixels, 1e-6),
|
|
2631
|
+
widthPixels > 0.0
|
|
2632
|
+
);
|
|
2633
|
+
#endif
|
|
2634
|
+
#ifdef DASH_ENABLED
|
|
2635
|
+
let currentDeltaCommon = select(
|
|
2636
|
+
nextPositionCommon - currPositionCommon,
|
|
2637
|
+
currPositionCommon - prevPositionCommon,
|
|
2638
|
+
isEnd > 0.0
|
|
2639
|
+
);
|
|
2640
|
+
let billboardPathLength = select(
|
|
2641
|
+
0.0,
|
|
2642
|
+
length(currentDeltaCommon) * project.scale / (widthPixels * project.focalDistance),
|
|
2643
|
+
widthPixels > 0.0
|
|
2644
|
+
);
|
|
2645
|
+
#endif
|
|
2646
|
+
let join = getLineJoinOffset(
|
|
2647
|
+
prevPositionScreen.xyz / prevPositionScreen.w,
|
|
2648
|
+
currPositionScreen.xyz / currPositionScreen.w,
|
|
2649
|
+
nextPositionScreen.xyz / nextPositionScreen.w,
|
|
2650
|
+
project_pixel_size_to_clipspace(vec2<f32>(widthPixels, widthPixels)),
|
|
2651
|
+
#ifdef DASH_ENABLED
|
|
2652
|
+
billboardPathLength,
|
|
2653
|
+
billboardPathRange,
|
|
2654
|
+
#endif
|
|
2655
|
+
#ifdef ANTIALIASING
|
|
2656
|
+
coverageScale,
|
|
2657
|
+
#endif
|
|
2658
|
+
attributes.positions,
|
|
2659
|
+
attributes.instanceTypes
|
|
2660
|
+
);
|
|
2661
|
+
#ifdef DASH_ENABLED
|
|
2662
|
+
// Phase and justification use the complete source segment, while cap and joint coverage
|
|
2663
|
+
// must still recognize the endpoints moved by clipLine.
|
|
2664
|
+
varyings.vPathBounds = billboardPathLength * billboardPathRange;
|
|
2665
|
+
#endif
|
|
2666
|
+
|
|
2667
|
+
geometry.uv = join.pathPosition;
|
|
2668
|
+
varyings.position = vec4<f32>(
|
|
2669
|
+
currPositionScreen.xyz + join.offset * currPositionScreen.w,
|
|
2670
|
+
currPositionScreen.w
|
|
2671
|
+
);
|
|
2672
|
+
varyings.vCornerOffset = join.cornerOffset;
|
|
2673
|
+
varyings.vMiterLength = join.miterLength;
|
|
2674
|
+
varyings.vPathPosition = join.pathPosition;
|
|
2675
|
+
varyings.vPathLength = join.pathLength;
|
|
2676
|
+
varyings.vJointType = join.jointType;
|
|
2677
|
+
} else {
|
|
2678
|
+
let prevPositionCommon = project_position_vec3_f64(prevPosition, prevPosition64Low);
|
|
2679
|
+
let currPositionCommon = project_position_vec3_f64(currPosition, currPosition64Low);
|
|
2680
|
+
let nextPositionCommon = project_position_vec3_f64(nextPosition, nextPosition64Low);
|
|
2681
|
+
|
|
2682
|
+
let width = vec2<f32>(
|
|
2683
|
+
project_pixel_size_float(widthPixels),
|
|
2684
|
+
project_pixel_size_float(widthPixels)
|
|
2685
|
+
);
|
|
2686
|
+
#ifdef ANTIALIASING
|
|
2687
|
+
let coverageScale = select(
|
|
2688
|
+
1.0,
|
|
2689
|
+
(widthPixels + 0.5 / project.devicePixelRatio) / max(widthPixels, 1e-6),
|
|
2690
|
+
widthPixels > 0.0
|
|
2691
|
+
);
|
|
2692
|
+
#endif
|
|
2693
|
+
let join = getLineJoinOffset(
|
|
2694
|
+
prevPositionCommon,
|
|
2695
|
+
currPositionCommon,
|
|
2696
|
+
nextPositionCommon,
|
|
2697
|
+
width,
|
|
2698
|
+
#ifdef DASH_ENABLED
|
|
2699
|
+
1.0,
|
|
2700
|
+
vec2<f32>(0.0, 1.0),
|
|
2701
|
+
#endif
|
|
2702
|
+
#ifdef ANTIALIASING
|
|
2703
|
+
coverageScale,
|
|
2704
|
+
#endif
|
|
2705
|
+
attributes.positions,
|
|
2706
|
+
attributes.instanceTypes
|
|
2707
|
+
);
|
|
2708
|
+
#ifdef DASH_ENABLED
|
|
2709
|
+
varyings.vPathBounds = vec2<f32>(0.0, join.pathLength);
|
|
2710
|
+
#endif
|
|
2711
|
+
|
|
2712
|
+
geometry.position = vec4<f32>(currPositionCommon + join.offset, 1.0);
|
|
2713
|
+
geometry.uv = join.pathPosition;
|
|
2714
|
+
varyings.position = project_common_position_to_clipspace(geometry.position);
|
|
2715
|
+
varyings.vCornerOffset = join.cornerOffset;
|
|
2716
|
+
varyings.vMiterLength = join.miterLength;
|
|
2717
|
+
varyings.vPathPosition = join.pathPosition;
|
|
2718
|
+
varyings.vPathLength = join.pathLength;
|
|
2719
|
+
varyings.vJointType = join.jointType;
|
|
2720
|
+
}
|
|
2721
|
+
|
|
2722
|
+
varyings.clipCoordinates = geometry.position.xy;
|
|
2723
|
+
clip_filterPosition(&varyings.position, geometry.worldPosition.xy);
|
|
2724
|
+
|
|
2725
|
+
varyings.vColor = vec4<f32>(
|
|
2726
|
+
attributes.instanceColors.rgb,
|
|
2727
|
+
attributes.instanceColors.a * layer.opacity
|
|
2728
|
+
);
|
|
2729
|
+
return varyings;
|
|
2730
|
+
}
|
|
2731
|
+
|
|
2732
|
+
@fragment
|
|
2733
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
2734
|
+
geometry.uv = varyings.vPathPosition;
|
|
2735
|
+
|
|
2736
|
+
#ifdef ANTIALIASING
|
|
2737
|
+
// Coordinates of the outer silhouette, in units of half-width: rounded joints and caps are
|
|
2738
|
+
// bounded by the corner offset, everywhere else by the edge of the stroke. Dividing by the
|
|
2739
|
+
// screen-space derivative converts the distance to the boundary into device pixels, which stays
|
|
2740
|
+
// correct under perspective foreshortening and under extensions that rescale the stroke.
|
|
2741
|
+
#ifdef DASH_ENABLED
|
|
2742
|
+
let isCorner =
|
|
2743
|
+
varyings.vPathPosition.y < varyings.vPathBounds.x ||
|
|
2744
|
+
varyings.vPathPosition.y > varyings.vPathBounds.y;
|
|
2745
|
+
#else
|
|
2746
|
+
let isCorner = varyings.vPathPosition.y < 0.0 || varyings.vPathPosition.y > varyings.vPathLength;
|
|
2747
|
+
#endif
|
|
2748
|
+
let isRound = varyings.vJointType > 0.5;
|
|
2749
|
+
|
|
2750
|
+
// Distance to the silhouette in device pixels, from the derivative of the coordinate that
|
|
2751
|
+
// bounds it. Computed before the discards below: derivatives need uniform control flow and are
|
|
2752
|
+
// undefined after a discard in the quad. See dev-docs/RFCs/v9.4/analytic-antialiasing-rfc.md
|
|
2753
|
+
let bodyCoord = abs(varyings.vPathPosition.x);
|
|
2754
|
+
let cornerCoord = length(varyings.vCornerOffset);
|
|
2755
|
+
// Both evaluated so each derivative stays on one field across the corner/body boundary
|
|
2756
|
+
let bodyPixels = (1.0 - bodyCoord) / max(fwidth(bodyCoord), 1e-6);
|
|
2757
|
+
let cornerPixels = (1.0 - cornerCoord) / max(fwidth(cornerCoord), 1e-6);
|
|
2758
|
+
#ifdef PATH_STYLE_OFFSET
|
|
2759
|
+
// Rounded corners still intersect the stroke-width envelope. Extensions may remap
|
|
2760
|
+
// vPathPosition.x independently of vCornerOffset, as PathStyleExtension does for offsets.
|
|
2761
|
+
let edgePixels = select(bodyPixels, min(cornerPixels, bodyPixels), isRound && isCorner);
|
|
2762
|
+
#else
|
|
2763
|
+
let edgePixels = select(bodyPixels, cornerPixels, isRound && isCorner);
|
|
2764
|
+
#endif
|
|
2765
|
+
|
|
2766
|
+
// Fragments outside the coverage ramp must not write depth or picking colors.
|
|
2767
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
2768
|
+
discard;
|
|
2769
|
+
}
|
|
2770
|
+
|
|
2771
|
+
if (isCorner) {
|
|
2772
|
+
if (!isRound && varyings.vMiterLength > path.miterLimit + 1.0) {
|
|
2773
|
+
discard;
|
|
2774
|
+
}
|
|
2775
|
+
}
|
|
2776
|
+
|
|
2777
|
+
var color = varyings.vColor;
|
|
2778
|
+
|
|
2779
|
+
// Feather one device pixel across the width only, before premultiplication. edgePixels is a
|
|
2780
|
+
// signed device-pixel distance and SMOOTH_EDGE_RADIUS is 0.5, so this ramps across one pixel.
|
|
2781
|
+
color.a *= smoothedge(0.0, edgePixels);
|
|
2782
|
+
#else
|
|
2783
|
+
#ifdef DASH_ENABLED
|
|
2784
|
+
if (
|
|
2785
|
+
varyings.vPathPosition.y < varyings.vPathBounds.x ||
|
|
2786
|
+
varyings.vPathPosition.y > varyings.vPathBounds.y
|
|
2787
|
+
) {
|
|
2788
|
+
#else
|
|
2789
|
+
if (
|
|
2790
|
+
varyings.vPathPosition.y < 0.0 ||
|
|
2791
|
+
varyings.vPathPosition.y > varyings.vPathLength
|
|
2792
|
+
) {
|
|
2793
|
+
#endif
|
|
2794
|
+
if (varyings.vJointType > 0.5 && length(varyings.vCornerOffset) > 1.0) {
|
|
2795
|
+
discard;
|
|
2796
|
+
}
|
|
2797
|
+
if (
|
|
2798
|
+
varyings.vJointType < 0.5 &&
|
|
2799
|
+
varyings.vMiterLength > path.miterLimit + 1.0
|
|
2800
|
+
) {
|
|
2801
|
+
discard;
|
|
2802
|
+
}
|
|
2803
|
+
}
|
|
2804
|
+
#endif
|
|
2805
|
+
|
|
2806
|
+
// Fragment-layer injections that discard pixels must run after analytic coverage derivatives.
|
|
2807
|
+
// See TripsLayer, which rejects fragments outside of the active time window at this anchor.
|
|
2808
|
+
// DECKGL_FILTER_COLOR
|
|
2809
|
+
clip_filterColor(varyings.clipCoordinates);
|
|
2810
|
+
#ifdef ANTIALIASING
|
|
2811
|
+
return deckgl_premultiplied_alpha(color);
|
|
2812
|
+
#else
|
|
2813
|
+
return deckgl_premultiplied_alpha(varyings.vColor);
|
|
2814
|
+
#endif
|
|
2815
|
+
}
|
|
2816
|
+
`;var oo=`#version 300 es
|
|
2817
|
+
#define SHADER_NAME path-layer-vertex-shader
|
|
2818
|
+
in vec2 positions;
|
|
2819
|
+
in float instanceTypes;
|
|
2820
|
+
in vec3 instanceStartPositions;
|
|
2821
|
+
in vec3 instanceEndPositions;
|
|
2822
|
+
in vec3 instanceLeftPositions;
|
|
2823
|
+
in vec3 instanceRightPositions;
|
|
2824
|
+
in vec3 instanceLeftPositions64Low;
|
|
2825
|
+
in vec3 instanceStartPositions64Low;
|
|
2826
|
+
in vec3 instanceEndPositions64Low;
|
|
2827
|
+
in vec3 instanceRightPositions64Low;
|
|
2828
|
+
in float instanceStrokeWidths;
|
|
2829
|
+
in vec4 instanceColors;
|
|
2830
|
+
in float rowIndexes;
|
|
2831
|
+
uniform float opacity;
|
|
2832
|
+
out vec4 vColor;
|
|
2833
|
+
out vec2 vCornerOffset;
|
|
2834
|
+
out float vMiterLength;
|
|
2835
|
+
out vec2 vPathPosition;
|
|
2836
|
+
out float vPathLength;
|
|
2837
|
+
out float vJointType;
|
|
2838
|
+
#ifdef DASH_ENABLED
|
|
2839
|
+
out vec2 vPathBounds;
|
|
2840
|
+
#endif
|
|
2841
|
+
const float EPSILON = 0.001;
|
|
2842
|
+
const vec3 ZERO_OFFSET = vec3(0.0);
|
|
2843
|
+
float flipIfTrue(bool flag) {
|
|
2844
|
+
return -(float(flag) * 2. - 1.);
|
|
2845
|
+
}
|
|
2846
|
+
vec3 getLineJoinOffset(
|
|
2847
|
+
vec3 prevPoint, vec3 currPoint, vec3 nextPoint,
|
|
2848
|
+
vec2 width
|
|
2849
|
+
#ifdef DASH_ENABLED
|
|
2850
|
+
, float sourcePathLength, vec2 sourcePathRange
|
|
2851
|
+
#endif
|
|
2852
|
+
#ifdef ANTIALIASING
|
|
2853
|
+
, float coverageScale
|
|
2854
|
+
#endif
|
|
2855
|
+
) {
|
|
2856
|
+
bool isEnd = positions.x > 0.0;
|
|
2857
|
+
float sideOfPath = positions.y;
|
|
2858
|
+
float isJoint = float(sideOfPath == 0.0);
|
|
2859
|
+
vec3 deltaA3 = (currPoint - prevPoint);
|
|
2860
|
+
vec3 deltaB3 = (nextPoint - currPoint);
|
|
2861
|
+
mat3 rotationMatrix;
|
|
2862
|
+
bool needsRotation = !path.billboard && project_needs_rotation(currPoint, rotationMatrix);
|
|
2863
|
+
if (needsRotation) {
|
|
2864
|
+
deltaA3 = deltaA3 * rotationMatrix;
|
|
2865
|
+
deltaB3 = deltaB3 * rotationMatrix;
|
|
2866
|
+
}
|
|
2867
|
+
vec2 deltaA = deltaA3.xy / width;
|
|
2868
|
+
vec2 deltaB = deltaB3.xy / width;
|
|
2869
|
+
float lenA = length(deltaA);
|
|
2870
|
+
float lenB = length(deltaB);
|
|
2871
|
+
vec2 dirA = lenA > 0. ? normalize(deltaA) : vec2(0.0, 0.0);
|
|
2872
|
+
vec2 dirB = lenB > 0. ? normalize(deltaB) : vec2(0.0, 0.0);
|
|
2873
|
+
vec2 perpA = vec2(-dirA.y, dirA.x);
|
|
2874
|
+
vec2 perpB = vec2(-dirB.y, dirB.x);
|
|
2875
|
+
vec2 tangent = dirA + dirB;
|
|
2876
|
+
tangent = length(tangent) > 0. ? normalize(tangent) : perpA;
|
|
2877
|
+
vec2 miterVec = vec2(-tangent.y, tangent.x);
|
|
2878
|
+
vec2 dir = isEnd ? dirA : dirB;
|
|
2879
|
+
vec2 perp = isEnd ? perpA : perpB;
|
|
2880
|
+
float L = isEnd ? lenA : lenB;
|
|
2881
|
+
#ifdef DASH_ENABLED
|
|
2882
|
+
vec3 currDelta3 = isEnd ? deltaA3 : deltaB3;
|
|
2883
|
+
float currLength2D = length(currDelta3.xy);
|
|
2884
|
+
float arcLengthRatio = 1.0;
|
|
2885
|
+
float pathPositionOffset = 0.0;
|
|
2886
|
+
float pathLength = L;
|
|
2887
|
+
if (path.billboard) {
|
|
2888
|
+
float visiblePathLength = sourcePathLength * (sourcePathRange.y - sourcePathRange.x);
|
|
2889
|
+
arcLengthRatio = L > 0.0 ? visiblePathLength / L : 0.0;
|
|
2890
|
+
pathPositionOffset = sourcePathLength * sourcePathRange.x;
|
|
2891
|
+
pathLength = sourcePathLength;
|
|
2892
|
+
} else if (currLength2D > 0.0) {
|
|
2893
|
+
arcLengthRatio = length(currDelta3) / currLength2D;
|
|
2894
|
+
pathLength = L * arcLengthRatio;
|
|
2895
|
+
}
|
|
2896
|
+
#endif
|
|
2897
|
+
float sinHalfA = abs(dot(miterVec, perp));
|
|
2898
|
+
float cosHalfA = abs(dot(dirA, miterVec));
|
|
2899
|
+
float turnDirection = flipIfTrue(dirA.x * dirB.y >= dirA.y * dirB.x);
|
|
2900
|
+
float cornerPosition = sideOfPath * turnDirection;
|
|
2901
|
+
float miterSize = 1.0 / max(sinHalfA, EPSILON);
|
|
2902
|
+
miterSize = mix(
|
|
2903
|
+
min(miterSize, max(lenA, lenB) / max(cosHalfA, EPSILON)),
|
|
2904
|
+
miterSize,
|
|
2905
|
+
step(0.0, cornerPosition)
|
|
2906
|
+
);
|
|
2907
|
+
vec2 offsetVec = mix(miterVec * miterSize, perp, step(0.5, cornerPosition))
|
|
2908
|
+
* (sideOfPath + isJoint * turnDirection);
|
|
2909
|
+
bool isStartCap = lenA == 0.0 || (!isEnd && (instanceTypes == 1.0 || instanceTypes == 3.0));
|
|
2910
|
+
bool isEndCap = lenB == 0.0 || (isEnd && (instanceTypes == 2.0 || instanceTypes == 3.0));
|
|
2911
|
+
bool isCap = isStartCap || isEndCap;
|
|
2912
|
+
if (isCap) {
|
|
2913
|
+
offsetVec = mix(perp * sideOfPath, dir * path.capType * 4.0 * flipIfTrue(isStartCap), isJoint);
|
|
2914
|
+
vJointType = path.capType;
|
|
2915
|
+
} else {
|
|
2916
|
+
vJointType = path.jointType;
|
|
2917
|
+
}
|
|
2918
|
+
#ifdef ANTIALIASING
|
|
2919
|
+
vec2 coverageOffsetVec = offsetVec * coverageScale;
|
|
2920
|
+
#ifdef DASH_ENABLED
|
|
2921
|
+
vPathLength = pathLength;
|
|
2922
|
+
#else
|
|
2923
|
+
vPathLength = L;
|
|
2924
|
+
#endif
|
|
2925
|
+
vCornerOffset = coverageOffsetVec;
|
|
2926
|
+
vMiterLength = dot(vCornerOffset, miterVec * turnDirection);
|
|
2927
|
+
vMiterLength = isCap ? isJoint : vMiterLength;
|
|
2928
|
+
vec2 offsetFromStartOfPath = coverageOffsetVec + deltaA * float(isEnd);
|
|
2929
|
+
vPathPosition = vec2(
|
|
2930
|
+
dot(offsetFromStartOfPath, perp),
|
|
2931
|
+
#ifdef DASH_ENABLED
|
|
2932
|
+
pathPositionOffset + dot(offsetFromStartOfPath, dir) * arcLengthRatio
|
|
2933
|
+
#else
|
|
2934
|
+
dot(offsetFromStartOfPath, dir)
|
|
2935
|
+
#endif
|
|
2936
|
+
);
|
|
2937
|
+
geometry.uv = vPathPosition;
|
|
2938
|
+
float isValid = step(instanceTypes, 3.5);
|
|
2939
|
+
vec3 offset = vec3(coverageOffsetVec * width * isValid, 0.0);
|
|
2940
|
+
#else
|
|
2941
|
+
#ifdef DASH_ENABLED
|
|
2942
|
+
vPathLength = pathLength;
|
|
2943
|
+
#else
|
|
2944
|
+
vPathLength = L;
|
|
2945
|
+
#endif
|
|
2946
|
+
vCornerOffset = offsetVec;
|
|
2947
|
+
vMiterLength = dot(vCornerOffset, miterVec * turnDirection);
|
|
2948
|
+
vMiterLength = isCap ? isJoint : vMiterLength;
|
|
2949
|
+
vec2 offsetFromStartOfPath = vCornerOffset + deltaA * float(isEnd);
|
|
2950
|
+
vPathPosition = vec2(
|
|
2951
|
+
dot(offsetFromStartOfPath, perp),
|
|
2952
|
+
#ifdef DASH_ENABLED
|
|
2953
|
+
pathPositionOffset + dot(offsetFromStartOfPath, dir) * arcLengthRatio
|
|
2954
|
+
#else
|
|
2955
|
+
dot(offsetFromStartOfPath, dir)
|
|
2956
|
+
#endif
|
|
2957
|
+
);
|
|
2958
|
+
geometry.uv = vPathPosition;
|
|
2959
|
+
float isValid = step(instanceTypes, 3.5);
|
|
2960
|
+
vec3 offset = vec3(offsetVec * width * isValid, 0.0);
|
|
2961
|
+
#endif
|
|
2962
|
+
if (needsRotation) {
|
|
2963
|
+
offset = rotationMatrix * offset;
|
|
2964
|
+
}
|
|
2965
|
+
return offset;
|
|
2966
|
+
}
|
|
2967
|
+
void clipLine(inout vec4 position, vec4 refPosition) {
|
|
2968
|
+
if (position.w < EPSILON) {
|
|
2969
|
+
float r = (EPSILON - refPosition.w) / (position.w - refPosition.w);
|
|
2970
|
+
position = refPosition + (position - refPosition) * r;
|
|
2971
|
+
}
|
|
2972
|
+
}
|
|
2973
|
+
#ifdef DASH_ENABLED
|
|
2974
|
+
vec2 getClippedPathRange(float startW, float endW) {
|
|
2975
|
+
bool startClipped = startW < EPSILON;
|
|
2976
|
+
bool endClipped = endW < EPSILON;
|
|
2977
|
+
if (startClipped && endClipped) {
|
|
2978
|
+
return vec2(0.0);
|
|
2979
|
+
}
|
|
2980
|
+
if (startClipped || endClipped) {
|
|
2981
|
+
float intersection = clamp((EPSILON - startW) / (endW - startW), 0.0, 1.0);
|
|
2982
|
+
return startClipped ? vec2(intersection, 1.0) : vec2(0.0, intersection);
|
|
2983
|
+
}
|
|
2984
|
+
return vec2(0.0, 1.0);
|
|
2985
|
+
}
|
|
2986
|
+
#endif
|
|
2987
|
+
void main() {
|
|
2988
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(rowIndexes);
|
|
2989
|
+
vColor = vec4(instanceColors.rgb, instanceColors.a * layer.opacity);
|
|
2990
|
+
float isEnd = positions.x;
|
|
2991
|
+
vec3 prevPosition = mix(instanceLeftPositions, instanceStartPositions, isEnd);
|
|
2992
|
+
vec3 prevPosition64Low = mix(instanceLeftPositions64Low, instanceStartPositions64Low, isEnd);
|
|
2993
|
+
vec3 currPosition = mix(instanceStartPositions, instanceEndPositions, isEnd);
|
|
2994
|
+
vec3 currPosition64Low = mix(instanceStartPositions64Low, instanceEndPositions64Low, isEnd);
|
|
2995
|
+
vec3 nextPosition = mix(instanceEndPositions, instanceRightPositions, isEnd);
|
|
2996
|
+
vec3 nextPosition64Low = mix(instanceEndPositions64Low, instanceRightPositions64Low, isEnd);
|
|
2997
|
+
geometry.worldPosition = currPosition;
|
|
2998
|
+
vec2 widthPixels = vec2(clamp(
|
|
2999
|
+
project_size_to_pixel(instanceStrokeWidths * path.widthScale, path.widthUnits),
|
|
3000
|
+
path.widthMinPixels, path.widthMaxPixels) / 2.0);
|
|
3001
|
+
vec3 width;
|
|
3002
|
+
if (path.billboard) {
|
|
3003
|
+
#ifdef DASH_ENABLED
|
|
3004
|
+
vec4 prevPositionCommon;
|
|
3005
|
+
vec4 nextPositionCommon;
|
|
3006
|
+
vec4 prevPositionScreen = project_position_to_clipspace(
|
|
3007
|
+
prevPosition, prevPosition64Low, ZERO_OFFSET, prevPositionCommon
|
|
3008
|
+
);
|
|
3009
|
+
#else
|
|
3010
|
+
vec4 prevPositionScreen = project_position_to_clipspace(
|
|
3011
|
+
prevPosition, prevPosition64Low, ZERO_OFFSET
|
|
3012
|
+
);
|
|
3013
|
+
#endif
|
|
3014
|
+
vec4 currPositionScreen = project_position_to_clipspace(currPosition, currPosition64Low, ZERO_OFFSET, geometry.position);
|
|
3015
|
+
#ifdef DASH_ENABLED
|
|
3016
|
+
vec4 nextPositionScreen = project_position_to_clipspace(
|
|
3017
|
+
nextPosition, nextPosition64Low, ZERO_OFFSET, nextPositionCommon
|
|
3018
|
+
);
|
|
3019
|
+
#else
|
|
3020
|
+
vec4 nextPositionScreen = project_position_to_clipspace(
|
|
3021
|
+
nextPosition, nextPosition64Low, ZERO_OFFSET
|
|
3022
|
+
);
|
|
3023
|
+
#endif
|
|
3024
|
+
#ifdef DASH_ENABLED
|
|
3025
|
+
vec4 sourcePathStartScreen = mix(currPositionScreen, prevPositionScreen, isEnd);
|
|
3026
|
+
vec4 sourcePathEndScreen = mix(nextPositionScreen, currPositionScreen, isEnd);
|
|
3027
|
+
vec2 billboardPathRange = getClippedPathRange(
|
|
3028
|
+
sourcePathStartScreen.w, sourcePathEndScreen.w
|
|
3029
|
+
);
|
|
3030
|
+
#endif
|
|
3031
|
+
clipLine(prevPositionScreen, currPositionScreen);
|
|
3032
|
+
clipLine(nextPositionScreen, currPositionScreen);
|
|
3033
|
+
clipLine(currPositionScreen, mix(nextPositionScreen, prevPositionScreen, isEnd));
|
|
3034
|
+
width = vec3(widthPixels, 0.0);
|
|
3035
|
+
DECKGL_FILTER_SIZE(width, geometry);
|
|
3036
|
+
#ifdef ANTIALIASING
|
|
3037
|
+
vec2 coveragePadding = vec2(0.5 / project.devicePixelRatio);
|
|
3038
|
+
float coverageScale = length(width.xy) > 0.0
|
|
3039
|
+
? length(width.xy + coveragePadding) / length(width.xy)
|
|
3040
|
+
: 1.0;
|
|
3041
|
+
#endif
|
|
3042
|
+
#ifdef DASH_ENABLED
|
|
3043
|
+
vec3 currentDeltaCommon = isEnd > 0.0
|
|
3044
|
+
? geometry.position.xyz - prevPositionCommon.xyz
|
|
3045
|
+
: nextPositionCommon.xyz - geometry.position.xyz;
|
|
3046
|
+
float billboardPathLength = width.x > 0.0
|
|
3047
|
+
? length(currentDeltaCommon) * project.scale / (width.x * project.focalDistance)
|
|
3048
|
+
: 0.0;
|
|
3049
|
+
#endif
|
|
3050
|
+
vec3 offset = getLineJoinOffset(
|
|
3051
|
+
prevPositionScreen.xyz / prevPositionScreen.w,
|
|
3052
|
+
currPositionScreen.xyz / currPositionScreen.w,
|
|
3053
|
+
nextPositionScreen.xyz / nextPositionScreen.w,
|
|
3054
|
+
project_pixel_size_to_clipspace(width.xy)
|
|
3055
|
+
#ifdef DASH_ENABLED
|
|
3056
|
+
,
|
|
3057
|
+
billboardPathLength, billboardPathRange
|
|
3058
|
+
#endif
|
|
3059
|
+
#ifdef ANTIALIASING
|
|
3060
|
+
,
|
|
3061
|
+
coverageScale
|
|
3062
|
+
#endif
|
|
3063
|
+
);
|
|
3064
|
+
#ifdef DASH_ENABLED
|
|
3065
|
+
vPathBounds = billboardPathLength * billboardPathRange;
|
|
3066
|
+
#endif
|
|
3067
|
+
DECKGL_FILTER_GL_POSITION(currPositionScreen, geometry);
|
|
3068
|
+
gl_Position = vec4(currPositionScreen.xyz + offset * currPositionScreen.w, currPositionScreen.w);
|
|
3069
|
+
} else {
|
|
3070
|
+
prevPosition = project_position(prevPosition, prevPosition64Low);
|
|
3071
|
+
currPosition = project_position(currPosition, currPosition64Low);
|
|
3072
|
+
nextPosition = project_position(nextPosition, nextPosition64Low);
|
|
3073
|
+
width = vec3(project_pixel_size(widthPixels), 0.0);
|
|
3074
|
+
DECKGL_FILTER_SIZE(width, geometry);
|
|
3075
|
+
#ifdef ANTIALIASING
|
|
3076
|
+
vec2 coveragePadding = project_pixel_size(vec2(0.5 / project.devicePixelRatio));
|
|
3077
|
+
float coverageScale = length(width.xy) > 0.0
|
|
3078
|
+
? length(width.xy + coveragePadding) / length(width.xy)
|
|
3079
|
+
: 1.0;
|
|
3080
|
+
#endif
|
|
3081
|
+
vec3 offset = getLineJoinOffset(
|
|
3082
|
+
prevPosition, currPosition, nextPosition, width.xy
|
|
3083
|
+
#ifdef DASH_ENABLED
|
|
3084
|
+
, 1.0, vec2(0.0, 1.0)
|
|
3085
|
+
#endif
|
|
3086
|
+
#ifdef ANTIALIASING
|
|
3087
|
+
, coverageScale
|
|
3088
|
+
#endif
|
|
3089
|
+
);
|
|
3090
|
+
#ifdef DASH_ENABLED
|
|
3091
|
+
vPathBounds = vec2(0.0, vPathLength);
|
|
3092
|
+
#endif
|
|
3093
|
+
geometry.position = vec4(currPosition + offset, 1.0);
|
|
3094
|
+
gl_Position = project_common_position_to_clipspace(geometry.position);
|
|
3095
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
3096
|
+
}
|
|
3097
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
3098
|
+
}
|
|
3099
|
+
`;var no=`#version 300 es
|
|
3100
|
+
#define SHADER_NAME path-layer-fragment-shader
|
|
3101
|
+
precision highp float;
|
|
3102
|
+
in vec4 vColor;
|
|
3103
|
+
in vec2 vCornerOffset;
|
|
3104
|
+
in float vMiterLength;
|
|
3105
|
+
in vec2 vPathPosition;
|
|
3106
|
+
in float vPathLength;
|
|
3107
|
+
in float vJointType;
|
|
3108
|
+
#ifdef DASH_ENABLED
|
|
3109
|
+
in vec2 vPathBounds;
|
|
3110
|
+
#endif
|
|
3111
|
+
out vec4 fragColor;
|
|
3112
|
+
void main(void) {
|
|
3113
|
+
geometry.uv = vPathPosition;
|
|
3114
|
+
#ifdef ANTIALIASING
|
|
3115
|
+
#ifdef DASH_ENABLED
|
|
3116
|
+
bool isCorner = vPathPosition.y < vPathBounds.x || vPathPosition.y > vPathBounds.y;
|
|
3117
|
+
#else
|
|
3118
|
+
bool isCorner = vPathPosition.y < 0.0 || vPathPosition.y > vPathLength;
|
|
3119
|
+
#endif
|
|
3120
|
+
bool isRound = vJointType > 0.5;
|
|
3121
|
+
float bodyCoord = abs(vPathPosition.x);
|
|
3122
|
+
float cornerCoord = length(vCornerOffset);
|
|
3123
|
+
float bodyPixels = (1.0 - bodyCoord) / max(fwidth(bodyCoord), 1e-6);
|
|
3124
|
+
float cornerPixels = (1.0 - cornerCoord) / max(fwidth(cornerCoord), 1e-6);
|
|
3125
|
+
#ifdef PATH_STYLE_OFFSET
|
|
3126
|
+
float edgePixels = isRound && isCorner ? min(cornerPixels, bodyPixels) : bodyPixels;
|
|
3127
|
+
#else
|
|
3128
|
+
float edgePixels = isRound && isCorner ? cornerPixels : bodyPixels;
|
|
3129
|
+
#endif
|
|
3130
|
+
if (edgePixels <= -SMOOTH_EDGE_RADIUS) {
|
|
3131
|
+
discard;
|
|
3132
|
+
}
|
|
3133
|
+
if (isCorner) {
|
|
3134
|
+
if (!isRound && vMiterLength > path.miterLimit + 1.0) {
|
|
3135
|
+
discard;
|
|
3136
|
+
}
|
|
3137
|
+
}
|
|
3138
|
+
fragColor = vColor;
|
|
3139
|
+
fragColor.a *= smoothedge(0.0, edgePixels);
|
|
3140
|
+
#else
|
|
3141
|
+
#ifdef DASH_ENABLED
|
|
3142
|
+
if (vPathPosition.y < vPathBounds.x || vPathPosition.y > vPathBounds.y) {
|
|
3143
|
+
#else
|
|
3144
|
+
if (vPathPosition.y < 0.0 || vPathPosition.y > vPathLength) {
|
|
3145
|
+
#endif
|
|
3146
|
+
if (vJointType > 0.5 && length(vCornerOffset) > 1.0) {
|
|
3147
|
+
discard;
|
|
3148
|
+
}
|
|
3149
|
+
if (vJointType < 0.5 && vMiterLength > path.miterLimit + 1.0) {
|
|
3150
|
+
discard;
|
|
3151
|
+
}
|
|
3152
|
+
}
|
|
3153
|
+
fragColor = vColor;
|
|
3154
|
+
#endif
|
|
3155
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
3156
|
+
}
|
|
3157
|
+
`;var ro=[0,0,0,255];var ws={widthUnits:`meters`,widthScale:{type:`number`,min:0,value:1},widthMinPixels:{type:`number`,min:0,value:0},widthMaxPixels:{type:`number`,min:0,value:Number.MAX_SAFE_INTEGER},jointRounded:!1,capRounded:!1,miterLimit:{type:`number`,min:0,value:4},antialiasing:!1,billboard:!1,_pathType:null,getPath:{type:`accessor`,value:i=>i.path},getColor:{type:`accessor`,value:ro},getWidth:{type:`accessor`,value:1},rounded:{deprecatedFor:[`jointRounded`,`capRounded`]}};var Ot={enter:(i,e)=>e.length?e.subarray(e.length-i.length):i};function Is(i){if(i.isGeospatial)return null;let{unitsPerMeter:e}=i.distanceScales;return[e[0],e[1],e[2]]}function so(i,e){return i===e||!!(i&&e&&i.length===e.length&&i.every((t,o)=>t===e[o]))}var Me=class extends ao{getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:oo,fs:no,source:io,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,to,...this.context.device.type===`webgpu`?[ie]:[]]})}get wrapLongitude(){return!1}getBounds(){return this.context.device.type===`webgpu`?null:this.getAttributeManager()?.getBounds([`vertexPositions`])}getPathProjectionScale(e){let t=this.props.coordinateSystem;if(!!!this.getAttributeManager()?.getAttributes().instanceDashOffsets)return null;if(e instanceof ne$1&&e.zoom>=12&&(t==="default"||t===`lnglat`||t===`cartesian`)){let r=ie$1.getUniforms({viewport:e,coordinateSystem:t,coordinateOrigin:this.props.coordinateOrigin,autoWrapLongitude:this.wrapLongitude});return[e.projectionMode,r.coordinateOrigin[1],r.commonOrigin[1],...r.commonUnitsPerWorldUnit,...r.commonUnitsPerWorldUnit2,r.commonUnitsPerMeter[2]]}let s=Is(e);return s?[e.projectionMode,...s]:[e.projectionMode]}shouldUpdateState(e){let{viewport:t}=this.context;return super.shouldUpdateState(e)||this.state?.tessellationResolution!==t.resolution||!so(this.state?.pathProjectionScale,this.getPathProjectionScale(t))}initializeState(){let t=this.context.device.type===`webgpu`;this.getAttributeManager().addInstanced(s(r({},t?{pathPositions:{size:24,type:`float32`,transition:!1,accessor:`getPath`,update:this.calculateWebGPUPositions,shaderAttributes:{instanceLeftPositions:{size:3,elementOffset:0},instanceStartPositions:{size:3,elementOffset:3},instanceEndPositions:{size:3,elementOffset:6},instanceRightPositions:{size:3,elementOffset:9},instanceLeftPositions64Low:{size:3,elementOffset:12},instanceStartPositions64Low:{size:3,elementOffset:15},instanceEndPositions64Low:{size:3,elementOffset:18},instanceRightPositions64Low:{size:3,elementOffset:21}},noAlloc:!0}}:{vertexPositions:{size:3,vertexOffset:1,type:`float64`,fp64:this.use64bitPositions(),transition:Ot,accessor:`getPath`,update:this.calculatePositions,noAlloc:!0,shaderAttributes:{instanceLeftPositions:{vertexOffset:0},instanceStartPositions:{vertexOffset:1},instanceEndPositions:{vertexOffset:2},instanceRightPositions:{vertexOffset:3}}}}),{instanceTypes:{size:1,type:t?`float32`:`uint8`,update:this.calculateSegmentTypes,noAlloc:!0},instanceStrokeWidths:{size:1,accessor:`getWidth`,transition:t?!1:Ot,defaultValue:1,bufferGroup:`path-instance-data`},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,accessor:`getColor`,transition:t?!1:Ot,defaultValue:ro,bufferGroup:`path-instance-data`},rowIndexes:{size:1,type:`uint32`,accessor:(n,{index:s})=>n&&n.__source?n.__source.index:s,bufferGroup:`path-instance-data`}})),this.setState({pathTesselator:new Re({fp64:this.use64bitPositions(),isWebGPU:t}),tessellationResolution:this.context.viewport.resolution,pathProjectionScale:this.getPathProjectionScale(this.context.viewport)})}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e,s=this.getAttributeManager(),{viewport:r}=this.context,a=this.state.tessellationResolution!==r.resolution,l=this.getPathProjectionScale(r),c=!so(this.state.pathProjectionScale,l),d=n.updateTriggersChanged&&(n.updateTriggersChanged.all||n.updateTriggersChanged.getPath)||t._pathType!==o._pathType||t.positionFormat!==o.positionFormat||t.wrapLongitude!==o.wrapLongitude||a;if(n.dataChanged||d){let{pathTesselator:u}=this.state,g=t.data.attributes||{};u.updateGeometry({data:t.data,geometryBuffer:g.getPath,buffers:g,normalize:!t._pathType,loop:t._pathType===`loop`,getGeometry:t.getPath,positionFormat:t.positionFormat,wrapLongitude:t.wrapLongitude,resolution:r.resolution,dataChanged:d?void 0:n.dataChanged}),this.setState({numInstances:u.instanceCount,startIndices:u.vertexStarts,tessellationResolution:r.resolution,pathProjectionScale:l}),!n.dataChanged||d?s.invalidateAll():c&&s.invalidate(`instanceDashOffsets`)}else c&&(this.setState({pathProjectionScale:l}),s.invalidate(`instanceDashOffsets`));(n.extensionsChanged||t.antialiasing!==o.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),s.invalidateAll())}getPickingInfo(e){let t=super.getPickingInfo(e),{index:o}=t,n=this.props.data;return n[0]&&n[0].__source&&(t.object=n.find(s=>s.__source.index===o)),t}disablePickingIndex(e){let t=this.props.data;if(t[0]&&t[0].__source)for(let o=0;o<t.length;o++)t[o].__source.index===e&&this._disablePickingIndex(o);else super.disablePickingIndex(e)}draw({uniforms:e}){let{jointRounded:t,capRounded:o,billboard:n,miterLimit:s,widthUnits:r,widthScale:a,widthMinPixels:l,widthMaxPixels:c}=this.props,f=this.state.model,d={jointType:Number(t),capType:Number(o),billboard:n,widthUnits:ee[r],widthScale:a,miterLimit:s,widthMinPixels:l,widthMaxPixels:c};f.shaderInputs.setProps({path:d}),f.draw(this.context.renderPass)}_getModel(){return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-list`,attributes:{indices:new Uint16Array([0,1,2,1,4,2,1,3,4,3,5,4]),positions:{value:new Float32Array([0,0,0,-1,0,1,1,-1,1,1,1,0]),size:2}}}),isInstanced:!0}))}calculatePositions(e){let{pathTesselator:t}=this.state;e.startIndices=t.vertexStarts,e.value=t.get(`positions`)}calculateSegmentTypes(e){let{pathTesselator:t}=this.state;e.startIndices=t.vertexStarts,e.value=t.get(`segmentTypes`)}calculateWebGPUPositions(e){let{pathTesselator:t}=this.state,o=t.get(`positions`);if(!o){e.value=null;return}let n=t.instanceCount,s=new Float32Array(n*24),r=[-1,0,1,2];for(let a=0;a<n;a++){let l=a*24;for(let c=0;c<4;c++){let f=a+r[c],d=l+c*3;for(let p=0;p<3;p++){let u=f>=0&&f<n?o[f*3+p]:0,g=Math.fround(u);s[d+p]=g,s[d+p+12]=u-g}}}e.startIndices=t.vertexStarts,e.value=s}};Me.defaultProps=ws;Me.layerName=`PathLayer`;var ze=Me;var vo=x(po(),1);var pt=oe.CLOCKWISE;var uo=oe.COUNTER_CLOCKWISE;var K={isClosed:!0};function Us(i){if(i=i&&i.positions||i,!Array.isArray(i)&&!ArrayBuffer.isView(i))throw new Error(`invalid polygon`)}function re(i){return`positions`in i?i.positions:i}function Ne(i){return`holeIndices`in i?i.holeIndices:null}function Vs(i){return Array.isArray(i[0])}function Hs(i){return i.length>=1&&i[0].length>=2&&Number.isFinite(i[0][0])}function Zs(i){let e=i[0],t=i[i.length-1];return e[0]===t[0]&&e[1]===t[1]&&e[2]===t[2]}function Ks(i,e,t,o){for(let n=0;n<e;n++)if(i[t+n]!==i[o-e+n])return!1;return!0}function go(i,e,t,o,n){let s=e,r=t.length;for(let a=0;a<r;a++)for(let l=0;l<o;l++)i[s++]=t[a][l]||0;if(!Zs(t))for(let a=0;a<o;a++)i[s++]=t[0][a]||0;return K.start=e,K.end=s,K.size=o,Y(i,n,K),s}function ho(i,e,t,o,n=0,s,r){s=s||t.length;let a=s-n;if(a<=0)return e;let l=e;for(let c=0;c<a;c++)i[l++]=t[n+c];if(!Ks(t,o,n,s))for(let c=0;c<o;c++)i[l++]=t[n+c];return K.start=e,K.end=l,K.size=o,Y(i,r,K),l}function ut(i,e){Us(i);let t=[],o=[];if(`positions`in i){let{positions:n,holeIndices:s}=i;if(s){let r=0;for(let a=0;a<=s.length;a++)r=ho(t,r,n,e,s[a-1],s[a],a===0?pt:uo),o.push(r);return o.pop(),{positions:t,holeIndices:o}}i=n}if(!Vs(i))return ho(t,0,i,e,0,t.length,pt),t;if(!Hs(i)){let n=0;for(let[s,r]of i.entries())n=go(t,n,r,e,s===0?pt:uo),o.push(n);return o.pop(),{positions:t,holeIndices:o}}return go(t,0,i,e,pt),t}function Dt(i,e,t){let o=i.length/3,n=0;for(let s=0;s<o;s++){let r=(s+1)%o;n+=i[s*3+e]*i[r*3+t],n-=i[r*3+e]*i[s*3+t]}return Math.abs(n/2)}function xo(i,e,t,o){let n=i.length/3;for(let s=0;s<n;s++){let r=s*3,a=i[r+0],l=i[r+1],c=i[r+2];i[r+e]=a,i[r+t]=l,i[r+o]=c}}function mo(i,e,t,o){let n=Ne(i);n&&(n=n.map(a=>a/e));let s=re(i),r=o&&e===3;if(t){let a=s.length;s=s.slice();let l=[];for(let c=0;c<a;c+=e){l[0]=s[c],l[1]=s[c+1],r&&(l[2]=s[c+2]);let f=t(l);s[c]=f[0],s[c+1]=f[1],r&&(s[c+2]=f[2])}}if(r){let a=Dt(s,0,1),l=Dt(s,0,2),c=Dt(s,1,2);if(!a&&!l&&!c)return[];a>l&&a>c||(l>c?(t||(s=s.slice()),xo(s,0,2,1)):(t||(s=s.slice()),xo(s,2,0,1)))}return(0,vo.default)(s,n,e)}var Ge=class extends xs$1{constructor(e){let{fp64:t,IndexType:o=Uint32Array}=e;super(s(r({},e),{attributes:{positions:{size:3,type:t?Float64Array:Float32Array},vertexValid:{type:Uint16Array,size:1},indices:{type:o,size:1}}}))}get(e){let{attributes:t}=this;return e===`indices`?t.indices&&t.indices.subarray(0,this.vertexCount):t[e]}updateGeometry(e){super.updateGeometry(e);let t=this.buffers.indices;if(t)this.vertexCount=(t.value||t).length;else if(this.data&&!this.getGeometry)throw new Error(`missing indices buffer`)}normalizeGeometry(e){if(this.normalize){let t=ut(e,this.positionSize);return this.opts.resolution?Ie(re(t),Ne(t),{size:this.positionSize,gridResolution:this.opts.resolution,edgeTypes:!0}):this.opts.wrapLongitude?Et(re(t),Ne(t),{size:this.positionSize,maxLatitude:86,edgeTypes:!0}):t}return e}getGeometrySize(e){if(Po(e)){let t=0;for(let o of e)t+=this.getGeometrySize(o);return t}return re(e).length/this.positionSize}getGeometryFromBuffer(e){return this.normalize||!this.buffers.indices?super.getGeometryFromBuffer(e):null}updateGeometryAttributes(e,t){if(e&&Po(e))for(let o of e){let n=this.getGeometrySize(o);t.geometrySize=n,this.updateGeometryAttributes(o,t),t.vertexStart+=n,t.indexStart=this.indexStarts[t.geometryIndex+1]}else{let o=e;this._updateIndices(o,t),this._updatePositions(o,t),this._updateVertexValid(o,t)}}_updateIndices(e,{geometryIndex:t,vertexStart:o,indexStart:n}){let{attributes:s,indexStarts:r,typedArrayManager:a}=this,l=s.indices;if(!l||!e)return;let c=n,f=mo(e,this.positionSize,this.opts.preproject,this.opts.full3d);l=a.allocate(l,n+f.length,{copy:!0});for(let d=0;d<f.length;d++)l[c++]=f[d]+o;r[t+1]=n+f.length,s.indices=l}_updatePositions(e,{vertexStart:t,geometrySize:o}){let{attributes:{positions:n},positionSize:s}=this;if(!n||!e)return;let r=re(e);for(let a=t,l=0;l<o;a++,l++){let c=r[l*s],f=r[l*s+1],d=s>2?r[l*s+2]:0;n[a*3]=c,n[a*3+1]=f,n[a*3+2]=d}}_updateVertexValid(e,{vertexStart:t,geometrySize:o}){let{positionSize:n}=this,s=this.attributes.vertexValid,r=e&&Ne(e);if(e&&e.edgeTypes?s.set(e.edgeTypes,t):s.fill(1,t,t+o),r)for(let a=0;a<r.length;a++)s[t+r[a]/n-1]=0;s[t+o-1]=0}};function Po(i){return Array.isArray(i)&&i.length>0&&!Number.isFinite(i[0])}var $s=`struct SolidPolygonUniforms {
|
|
3158
|
+
extruded: f32,
|
|
3159
|
+
isWireframe: f32,
|
|
3160
|
+
elevationScale: f32,
|
|
3161
|
+
};
|
|
3162
|
+
|
|
3163
|
+
@group(0) @binding(auto) var<uniform> solidPolygon: SolidPolygonUniforms;
|
|
3164
|
+
`;var _o=`layout(std140) uniform solidPolygonUniforms {
|
|
3165
|
+
bool extruded;
|
|
3166
|
+
bool isWireframe;
|
|
3167
|
+
float elevationScale;
|
|
3168
|
+
} solidPolygon;
|
|
3169
|
+
`;var Co={name:`solidPolygon`,source:$s,vs:_o,fs:_o,uniformTypes:{extruded:`f32`,isWireframe:`f32`,elevationScale:`f32`}};var gt=`in vec4 fillColors;
|
|
3170
|
+
in vec4 lineColors;
|
|
3171
|
+
in float rowIndexes;
|
|
3172
|
+
out vec4 vColor;
|
|
3173
|
+
struct PolygonProps {
|
|
3174
|
+
vec3 positions;
|
|
3175
|
+
vec3 positions64Low;
|
|
3176
|
+
vec3 normal;
|
|
3177
|
+
float elevations;
|
|
3178
|
+
};
|
|
3179
|
+
vec3 project_offset_normal(vec3 vector) {
|
|
3180
|
+
if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT ||
|
|
3181
|
+
project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSETS) {
|
|
3182
|
+
return normalize(vector * project.commonUnitsPerWorldUnit);
|
|
3183
|
+
}
|
|
3184
|
+
return project_normal(vector);
|
|
3185
|
+
}
|
|
3186
|
+
void calculatePosition(PolygonProps props) {
|
|
3187
|
+
vec3 pos = props.positions;
|
|
3188
|
+
vec3 pos64Low = props.positions64Low;
|
|
3189
|
+
vec3 normal = props.normal;
|
|
3190
|
+
vec4 colors = solidPolygon.isWireframe ? lineColors : fillColors;
|
|
3191
|
+
geometry.worldPosition = props.positions;
|
|
3192
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(rowIndexes);
|
|
3193
|
+
if (solidPolygon.extruded) {
|
|
3194
|
+
pos.z += props.elevations * solidPolygon.elevationScale;
|
|
3195
|
+
}
|
|
3196
|
+
gl_Position = project_position_to_clipspace(pos, pos64Low, vec3(0.), geometry.position);
|
|
3197
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
3198
|
+
if (solidPolygon.extruded) {
|
|
3199
|
+
#ifdef IS_SIDE_VERTEX
|
|
3200
|
+
normal = project_offset_normal(normal);
|
|
3201
|
+
#else
|
|
3202
|
+
normal = project_normal(normal);
|
|
3203
|
+
#endif
|
|
3204
|
+
geometry.normal = normal;
|
|
3205
|
+
vec3 lightColor = lighting_getLightColor(colors.rgb, project.cameraPosition, geometry.position.xyz, geometry.normal);
|
|
3206
|
+
vColor = vec4(lightColor, colors.a * layer.opacity);
|
|
3207
|
+
} else {
|
|
3208
|
+
vColor = vec4(colors.rgb, colors.a * layer.opacity);
|
|
3209
|
+
}
|
|
3210
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
3211
|
+
}
|
|
3212
|
+
`;var So=`#version 300 es
|
|
3213
|
+
#define SHADER_NAME solid-polygon-layer-vertex-shader
|
|
3214
|
+
in vec3 vertexPositions;
|
|
3215
|
+
in vec3 vertexPositions64Low;
|
|
3216
|
+
in float elevations;
|
|
3217
|
+
${gt}
|
|
3218
|
+
void main(void) {
|
|
3219
|
+
PolygonProps props;
|
|
3220
|
+
props.positions = vertexPositions;
|
|
3221
|
+
props.positions64Low = vertexPositions64Low;
|
|
3222
|
+
props.elevations = elevations;
|
|
3223
|
+
props.normal = vec3(0.0, 0.0, 1.0);
|
|
3224
|
+
calculatePosition(props);
|
|
3225
|
+
}
|
|
3226
|
+
`;var Lo=`#version 300 es
|
|
3227
|
+
#define SHADER_NAME solid-polygon-layer-vertex-shader-side
|
|
3228
|
+
#define IS_SIDE_VERTEX
|
|
3229
|
+
in vec2 positions;
|
|
3230
|
+
in vec3 vertexPositions;
|
|
3231
|
+
in vec3 nextVertexPositions;
|
|
3232
|
+
in vec3 vertexPositions64Low;
|
|
3233
|
+
in vec3 nextVertexPositions64Low;
|
|
3234
|
+
in float elevations;
|
|
3235
|
+
in float instanceVertexValid;
|
|
3236
|
+
${gt}
|
|
3237
|
+
void main(void) {
|
|
3238
|
+
if(instanceVertexValid < 0.5){
|
|
3239
|
+
gl_Position = vec4(0.);
|
|
3240
|
+
return;
|
|
3241
|
+
}
|
|
3242
|
+
PolygonProps props;
|
|
3243
|
+
vec3 pos;
|
|
3244
|
+
vec3 pos64Low;
|
|
3245
|
+
vec3 nextPos;
|
|
3246
|
+
vec3 nextPos64Low;
|
|
3247
|
+
#if RING_WINDING_ORDER_CW == 1
|
|
3248
|
+
pos = vertexPositions;
|
|
3249
|
+
pos64Low = vertexPositions64Low;
|
|
3250
|
+
nextPos = nextVertexPositions;
|
|
3251
|
+
nextPos64Low = nextVertexPositions64Low;
|
|
3252
|
+
#else
|
|
3253
|
+
pos = nextVertexPositions;
|
|
3254
|
+
pos64Low = nextVertexPositions64Low;
|
|
3255
|
+
nextPos = vertexPositions;
|
|
3256
|
+
nextPos64Low = vertexPositions64Low;
|
|
3257
|
+
#endif
|
|
3258
|
+
props.positions = mix(pos, nextPos, positions.x);
|
|
3259
|
+
props.positions64Low = mix(pos64Low, nextPos64Low, positions.x);
|
|
3260
|
+
props.normal = vec3(
|
|
3261
|
+
pos.y - nextPos.y + (pos64Low.y - nextPos64Low.y),
|
|
3262
|
+
nextPos.x - pos.x + (nextPos64Low.x - pos64Low.x),
|
|
3263
|
+
0.0);
|
|
3264
|
+
props.elevations = elevations * positions.y;
|
|
3265
|
+
calculatePosition(props);
|
|
3266
|
+
}
|
|
3267
|
+
`;var bo=`#version 300 es
|
|
3268
|
+
#define SHADER_NAME solid-polygon-layer-fragment-shader
|
|
3269
|
+
precision highp float;
|
|
3270
|
+
in vec4 vColor;
|
|
3271
|
+
out vec4 fragColor;
|
|
3272
|
+
void main(void) {
|
|
3273
|
+
fragColor = vColor;
|
|
3274
|
+
geometry.uv = vec2(0.);
|
|
3275
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
3276
|
+
}
|
|
3277
|
+
`;function wo(){return`fn project_offset_normal(vector: vec3<f32>) -> vec3<f32> {
|
|
3278
|
+
if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT ||
|
|
3279
|
+
project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSETS) {
|
|
3280
|
+
return normalize(vector * project.commonUnitsPerWorldUnit);
|
|
3281
|
+
}
|
|
3282
|
+
return project_normal(vector);
|
|
3283
|
+
}
|
|
3284
|
+
|
|
3285
|
+
fn apply_polygon_color(
|
|
3286
|
+
colors: vec4<f32>,
|
|
3287
|
+
normal: vec3<f32>,
|
|
3288
|
+
position: vec4<f32>
|
|
3289
|
+
) -> vec4<f32> {
|
|
3290
|
+
if (solidPolygon.extruded > 0.5) {
|
|
3291
|
+
let lightColor = lighting_getLightColor2(
|
|
3292
|
+
colors.rgb,
|
|
3293
|
+
project.cameraPosition,
|
|
3294
|
+
position.xyz,
|
|
3295
|
+
normal
|
|
3296
|
+
);
|
|
3297
|
+
return vec4<f32>(lightColor, colors.a * layer.opacity);
|
|
3298
|
+
}
|
|
3299
|
+
return vec4<f32>(colors.rgb, colors.a * layer.opacity);
|
|
3300
|
+
}
|
|
3301
|
+
`}function Io(){return`@fragment
|
|
3302
|
+
fn fragmentMain(inp: Varyings) -> @location(0) vec4<f32> {
|
|
3303
|
+
geometry.uv = vec2<f32>(0.0, 0.0);
|
|
3304
|
+
|
|
3305
|
+
clip_filterColor(inp.clipCoordinates);
|
|
3306
|
+
|
|
3307
|
+
if (picking.isActive > 0.5) {
|
|
3308
|
+
if (!picking_isColorValid(inp.pickingColor)) {
|
|
3309
|
+
discard;
|
|
3310
|
+
}
|
|
3311
|
+
return vec4<f32>(inp.pickingColor, 1.0);
|
|
3312
|
+
}
|
|
3313
|
+
|
|
3314
|
+
var fragColor = inp.vColor;
|
|
3315
|
+
|
|
3316
|
+
if (picking.isHighlightActive > 0.5) {
|
|
3317
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
3318
|
+
if (picking_isColorZero(abs(inp.pickingColor - highlightedObjectColor))) {
|
|
3319
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
3320
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
3321
|
+
if (blendedAlpha > 0.0) {
|
|
3322
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
3323
|
+
fragColor = vec4<f32>(
|
|
3324
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
3325
|
+
blendedAlpha
|
|
3326
|
+
);
|
|
3327
|
+
} else {
|
|
3328
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
3329
|
+
}
|
|
3330
|
+
}
|
|
3331
|
+
}
|
|
3332
|
+
|
|
3333
|
+
return deckgl_premultiplied_alpha(fragColor);
|
|
3334
|
+
}
|
|
3335
|
+
`}function Ys(){return`${wo()}
|
|
3336
|
+
|
|
3337
|
+
struct Attributes {
|
|
3338
|
+
@location(0) vertexPositions: vec3<f32>,
|
|
3339
|
+
@location(1) vertexPositions64Low: vec3<f32>,
|
|
3340
|
+
@location(2) elevations: f32,
|
|
3341
|
+
@location(3) fillColors: vec4<f32>,
|
|
3342
|
+
@location(4) lineColors: vec4<f32>,
|
|
3343
|
+
@location(5) rowIndexes: u32,
|
|
3344
|
+
};
|
|
3345
|
+
|
|
3346
|
+
struct Varyings {
|
|
3347
|
+
@builtin(position) position: vec4<f32>,
|
|
3348
|
+
@location(0) vColor: vec4<f32>,
|
|
3349
|
+
@location(1) pickingColor: vec3<f32>,
|
|
3350
|
+
@location(2) clipCoordinates: vec2<f32>,
|
|
3351
|
+
};
|
|
3352
|
+
|
|
3353
|
+
@vertex
|
|
3354
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
3355
|
+
var outp: Varyings;
|
|
3356
|
+
|
|
3357
|
+
var pos = attributes.vertexPositions;
|
|
3358
|
+
if (solidPolygon.extruded > 0.5) {
|
|
3359
|
+
pos.z += attributes.elevations * solidPolygon.elevationScale;
|
|
3360
|
+
}
|
|
3361
|
+
|
|
3362
|
+
geometry.worldPosition = attributes.vertexPositions;
|
|
3363
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.rowIndexes);
|
|
3364
|
+
|
|
3365
|
+
let projectedPosition = project_position_to_clipspace_and_commonspace(
|
|
3366
|
+
pos,
|
|
3367
|
+
attributes.vertexPositions64Low,
|
|
3368
|
+
vec3<f32>(0.0)
|
|
3369
|
+
);
|
|
3370
|
+
geometry.position = projectedPosition.commonPosition;
|
|
3371
|
+
outp.position = projectedPosition.clipPosition;
|
|
3372
|
+
|
|
3373
|
+
let normal = project_normal(vec3<f32>(0.0, 0.0, 1.0));
|
|
3374
|
+
geometry.normal = normal;
|
|
3375
|
+
|
|
3376
|
+
let colors = select(
|
|
3377
|
+
attributes.fillColors,
|
|
3378
|
+
attributes.lineColors,
|
|
3379
|
+
solidPolygon.isWireframe > 0.5
|
|
3380
|
+
);
|
|
3381
|
+
outp.vColor = apply_polygon_color(colors, normal, geometry.position);
|
|
3382
|
+
outp.pickingColor = geometry.pickingColor;
|
|
3383
|
+
|
|
3384
|
+
outp.clipCoordinates = geometry.position.xy;
|
|
3385
|
+
clip_filterPosition(&outp.position, geometry.worldPosition.xy);
|
|
3386
|
+
|
|
3387
|
+
return outp;
|
|
3388
|
+
}
|
|
3389
|
+
|
|
3390
|
+
${Io()}
|
|
3391
|
+
`}function Js(i){return`const RING_WINDING_ORDER_CW: bool = ${i?`true`:`false`};
|
|
3392
|
+
|
|
3393
|
+
${wo()}
|
|
3394
|
+
|
|
3395
|
+
struct Attributes {
|
|
3396
|
+
@location(0) positions: vec2<f32>,
|
|
3397
|
+
@location(1) vertexPositions: vec3<f32>,
|
|
3398
|
+
@location(2) vertexPositions64Low: vec3<f32>,
|
|
3399
|
+
@location(3) nextVertexPositions: vec3<f32>,
|
|
3400
|
+
@location(4) nextVertexPositions64Low: vec3<f32>,
|
|
3401
|
+
@location(5) vertexValid: f32,
|
|
3402
|
+
@location(6) elevations: f32,
|
|
3403
|
+
@location(7) fillColors: vec4<f32>,
|
|
3404
|
+
@location(8) lineColors: vec4<f32>,
|
|
3405
|
+
@location(9) rowIndexes: u32,
|
|
3406
|
+
};
|
|
3407
|
+
|
|
3408
|
+
struct Varyings {
|
|
3409
|
+
@builtin(position) position: vec4<f32>,
|
|
3410
|
+
@location(0) vColor: vec4<f32>,
|
|
3411
|
+
@location(1) pickingColor: vec3<f32>,
|
|
3412
|
+
@location(2) clipCoordinates: vec2<f32>,
|
|
3413
|
+
};
|
|
3414
|
+
|
|
3415
|
+
@vertex
|
|
3416
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
3417
|
+
var outp: Varyings;
|
|
3418
|
+
outp.position = vec4<f32>(0.0);
|
|
3419
|
+
outp.vColor = vec4<f32>(0.0);
|
|
3420
|
+
outp.pickingColor = picking_getPickingColorFromIndex(attributes.rowIndexes);
|
|
3421
|
+
outp.clipCoordinates = vec2<f32>(0.0);
|
|
3422
|
+
|
|
3423
|
+
if (attributes.vertexValid < 0.5) {
|
|
3424
|
+
return outp;
|
|
3425
|
+
}
|
|
3426
|
+
|
|
3427
|
+
let pos = select(attributes.nextVertexPositions, attributes.vertexPositions, RING_WINDING_ORDER_CW);
|
|
3428
|
+
let pos64Low = select(
|
|
3429
|
+
attributes.nextVertexPositions64Low,
|
|
3430
|
+
attributes.vertexPositions64Low,
|
|
3431
|
+
RING_WINDING_ORDER_CW
|
|
3432
|
+
);
|
|
3433
|
+
let nextPos = select(attributes.vertexPositions, attributes.nextVertexPositions, RING_WINDING_ORDER_CW);
|
|
3434
|
+
let nextPos64Low = select(
|
|
3435
|
+
attributes.vertexPositions64Low,
|
|
3436
|
+
attributes.nextVertexPositions64Low,
|
|
3437
|
+
RING_WINDING_ORDER_CW
|
|
3438
|
+
);
|
|
3439
|
+
|
|
3440
|
+
let position = mix(pos, nextPos, attributes.positions.x);
|
|
3441
|
+
let position64Low = mix(pos64Low, nextPos64Low, attributes.positions.x);
|
|
3442
|
+
|
|
3443
|
+
var worldPosition = position;
|
|
3444
|
+
if (solidPolygon.extruded > 0.5) {
|
|
3445
|
+
worldPosition.z += attributes.elevations * attributes.positions.y * solidPolygon.elevationScale;
|
|
3446
|
+
}
|
|
3447
|
+
|
|
3448
|
+
geometry.worldPosition = position;
|
|
3449
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.rowIndexes);
|
|
3450
|
+
|
|
3451
|
+
let projectedPosition = project_position_to_clipspace_and_commonspace(
|
|
3452
|
+
worldPosition,
|
|
3453
|
+
position64Low,
|
|
3454
|
+
vec3<f32>(0.0)
|
|
3455
|
+
);
|
|
3456
|
+
geometry.position = projectedPosition.commonPosition;
|
|
3457
|
+
outp.position = projectedPosition.clipPosition;
|
|
3458
|
+
|
|
3459
|
+
let normal = project_offset_normal(vec3<f32>(
|
|
3460
|
+
pos.y - nextPos.y + (pos64Low.y - nextPos64Low.y),
|
|
3461
|
+
nextPos.x - pos.x + (nextPos64Low.x - pos64Low.x),
|
|
3462
|
+
0.0
|
|
3463
|
+
));
|
|
3464
|
+
geometry.normal = normal;
|
|
3465
|
+
|
|
3466
|
+
let colors = select(
|
|
3467
|
+
attributes.fillColors,
|
|
3468
|
+
attributes.lineColors,
|
|
3469
|
+
solidPolygon.isWireframe > 0.5
|
|
3470
|
+
);
|
|
3471
|
+
outp.vColor = apply_polygon_color(colors, normal, geometry.position);
|
|
3472
|
+
outp.pickingColor = geometry.pickingColor;
|
|
3473
|
+
|
|
3474
|
+
outp.clipCoordinates = geometry.position.xy;
|
|
3475
|
+
clip_filterPosition(&outp.position, geometry.worldPosition.xy);
|
|
3476
|
+
|
|
3477
|
+
return outp;
|
|
3478
|
+
}
|
|
3479
|
+
|
|
3480
|
+
${Io()}
|
|
3481
|
+
`}function Ao(i,e){return i===`top`?Ys():Js(e)}var xt=[0,0,0,255];var Xs={filled:!0,extruded:!1,wireframe:!1,_normalize:!0,_windingOrder:`CW`,_full3d:!1,elevationScale:{type:`number`,min:0,value:1},getPolygon:{type:`accessor`,value:i=>i.polygon},getElevation:{type:`accessor`,value:1e3},getFillColor:{type:`accessor`,value:xt},getLineColor:{type:`accessor`,value:xt},material:!0};var ht={enter:(i,e)=>e.length?e.subarray(e.length-i.length):i};var je=class extends ao{getShaders(e){let t=!this.props._normalize&&this.props._windingOrder===`CCW`?0:1;return super.getShaders({vs:e===`top`?So:Lo,fs:bo,source:Ao(e,!!t),defines:{RING_WINDING_ORDER_CW:t},modules:[Wa,ma,Zo$1,Ka,Co,...this.context.device.type===`webgpu`?[ie]:[]]})}get wrapLongitude(){return!1}getBounds(){return this.getAttributeManager()?.getBounds([`vertexPositions`])}initializeState(){let{viewport:e}=this.context,{coordinateSystem:t}=this.props,{_full3d:o}=this.props;e.isGeospatial&&t==="default"&&(t=`lnglat`);let n;t===`lnglat`&&(o?n=e.projectPosition.bind(e):n=e.projectFlat.bind(e)),this.setState({numInstances:0,polygonTesselator:new Ge({preproject:n,fp64:this.use64bitPositions(),IndexType:Uint32Array})});let s$6=this.getAttributeManager(),r$6=!0,a=this.context.device.type===`webgpu`;s$6.add(s(r({indices:{size:1,isIndexed:!0,update:this.calculateIndices,noAlloc:r$6},vertexPositions:r({size:3,type:`float64`,stepMode:`dynamic`,fp64:this.use64bitPositions(),transition:ht,accessor:`getPolygon`,update:this.calculatePositions,noAlloc:r$6},a?{}:{shaderAttributes:{nextVertexPositions:{vertexOffset:1}}})},a?{nextVertexPositions:{size:3,type:`float64`,stepMode:`dynamic`,fp64:this.use64bitPositions(),transition:!1,update:this.calculateNextPositions,noAlloc:r$6}}:{}),{[a?`vertexValid`:`instanceVertexValid`]:{size:1,type:a?`float32`:`uint16`,stepMode:`instance`,update:this.calculateVertexValid,noAlloc:r$6},elevations:{size:1,stepMode:`dynamic`,transition:ht,accessor:`getElevation`,bufferGroup:`solid-polygon-instance-data`},fillColors:{size:this.props.colorFormat.length,type:`unorm8`,stepMode:`dynamic`,transition:ht,accessor:`getFillColor`,defaultValue:xt,bufferGroup:`solid-polygon-instance-data`},lineColors:{size:this.props.colorFormat.length,type:`unorm8`,stepMode:`dynamic`,transition:ht,accessor:`getLineColor`,defaultValue:xt,bufferGroup:`solid-polygon-instance-data`},rowIndexes:{size:1,type:`uint32`,stepMode:`dynamic`,accessor:(l,{index:c})=>l&&l.__source?l.__source.index:c,bufferGroup:`solid-polygon-instance-data`}}))}getPickingInfo(e){let t=super.getPickingInfo(e),{index:o}=t,n=this.props.data;return n[0]&&n[0].__source&&(t.object=n.find(s=>s.__source.index===o)),t}disablePickingIndex(e){let t=this.props.data;if(t[0]&&t[0].__source)for(let o=0;o<t.length;o++)t[o].__source.index===e&&this._disablePickingIndex(o);else super.disablePickingIndex(e)}draw({uniforms:e}){let{extruded:t,filled:o,wireframe:n,elevationScale:s$7}=this.props,{topModel:r$7,sideModel:a,wireframeModel:l,polygonTesselator:c}=this.state,f={extruded:!!t,elevationScale:s$7,isWireframe:!1};l&&n&&(l.setInstanceCount(c.instanceCount-1),l.shaderInputs.setProps({solidPolygon:s(r({},f),{isWireframe:!0})}),l.draw(this.context.renderPass)),a&&o&&(a.setInstanceCount(c.instanceCount-1),a.shaderInputs.setProps({solidPolygon:f}),a.draw(this.context.renderPass)),r$7&&o&&(r$7.setVertexCount(c.vertexCount),r$7.shaderInputs.setProps({solidPolygon:f}),r$7.draw(this.context.renderPass))}updateState(e){super.updateState(e),this.updateGeometry(e);let{props:t,oldProps:o,changeFlags:n}=e,s=this.getAttributeManager();(n.extensionsChanged||t.filled!==o.filled||t.extruded!==o.extruded)&&(this.state.models?.forEach(a=>a.destroy()),this.setState(this._getModels()),s.invalidateAll())}updateGeometry({props:e,oldProps:t,changeFlags:o}){if(o.dataChanged||o.updateTriggersChanged&&(o.updateTriggersChanged.all||o.updateTriggersChanged.getPolygon)){let{polygonTesselator:s}=this.state,r$8=e.data.attributes||{};s.updateGeometry({data:e.data,normalize:e._normalize,geometryBuffer:r$8.getPolygon,buffers:this.context.device.type===`webgpu`?r({},r$8):r$8,getGeometry:e.getPolygon,positionFormat:e.positionFormat,wrapLongitude:e.wrapLongitude,resolution:this.context.viewport.resolution,fp64:this.use64bitPositions(),dataChanged:o.dataChanged,full3d:e._full3d}),this.setState({numInstances:s.instanceCount,startIndices:s.vertexStarts}),o.dataChanged||this.getAttributeManager().invalidateAll()}}_getModels(){let{id:e,filled:t,extruded:o}=this.props,n,s$8,r$9;if(t){let a=this.getShaders(`top`);a.defines=s(r({},a.defines),{NON_INSTANCED_MODEL:1});let l=this.getAttributeManager().getBufferLayouts({isInstanced:!1});this.context.device.type===`webgpu`&&(l=l.filter(c=>c.name!==`indices`&&c.name!==`vertexValid`&&c.name!==`instanceVertexValid`&&c.name!==`nextVertexPositions`)),n=new De(this.context.device,s(r({},a),{id:`${e}-top`,topology:`triangle-list`,bufferLayout:l,isIndexed:!0,userData:{excludeAttributes:{vertexValid:!0,instanceVertexValid:!0,nextVertexPositions:!0}}}))}if(o){let a=this.getAttributeManager().getBufferLayouts({isInstanced:!0});this.context.device.type===`webgpu`&&(a=a.filter(l=>l.name!==`indices`)),s$8=new De(this.context.device,s(r({},this.getShaders(`side`)),{id:`${e}-side`,bufferLayout:a,geometry:new re$1({topology:`triangle-strip`,attributes:{positions:{size:2,value:new Float32Array([1,0,0,0,1,1,0,1])}}}),isInstanced:!0,userData:{excludeAttributes:{indices:!0}}})),r$9=new De(this.context.device,s(r({},this.getShaders(`side`)),{id:`${e}-wireframe`,bufferLayout:a,geometry:new re$1({topology:`line-strip`,attributes:{positions:{size:2,value:new Float32Array([1,0,0,0,0,1,1,1])}}}),isInstanced:!0,userData:{excludeAttributes:{indices:!0}}}))}return{models:[s$8,r$9,n].filter(Boolean),topModel:n,sideModel:s$8,wireframeModel:r$9}}calculateIndices(e){let{polygonTesselator:t}=this.state;e.startIndices=t.indexStarts,e.value=t.get(`indices`)}calculatePositions(e){let{polygonTesselator:t}=this.state;e.startIndices=t.vertexStarts;let o=this.props.data.attributes?.getPolygon;if(this.context.device.type===`webgpu`&&ArrayBuffer.isView(o?.value)){let{value:n,size:s=3,offset:r=0,stride:a}=o,l=r/n.BYTES_PER_ELEMENT,c=a?a/n.BYTES_PER_ELEMENT:s,f=new Float64Array(t.instanceCount*3);for(let d=0;d<t.instanceCount;d++){let p=l+d*c,u=d*3;f[u]=n[p],f[u+1]=n[p+1],f[u+2]=s>2?n[p+2]:0}e.value=f;return}e.value=t.get(`positions`)}calculateVertexValid(e){let t=this.props.data.attributes?.instanceVertexValid?.value,o=this.context.device.type===`webgpu`&&t?t:this.state.polygonTesselator.get(`vertexValid`);e.value=this.context.device.type===`webgpu`&&o?Float32Array.from(o):o}calculateNextPositions(e){let{polygonTesselator:t}=this.state,o=this.getAttributeManager().getAttributes(),n=o.vertexPositions.value,s=this.props.data.attributes?.instanceVertexValid?.value||o.vertexValid?.value||t.get(`vertexValid`);if(e.startIndices=t.vertexStarts,!n){e.value=n;return}let r=n.length/3,a=new n.constructor(n.length);for(let l=0;l<r;l++){let c=l*3,f=s?.[l]&&l+1<r?c+3:c;for(let d=0;d<3;d++)a[c+d]=n[f+d]}e.value=a}};je.defaultProps=Xs;je.layerName=`SolidPolygonLayer`;var Be=je;function vt({data:i,getIndex:e,dataRange:t,replace:o}){let{startRow:n=0,endRow:s=1/0}=t,r=i.length,a=r,l=r;for(let p=0;p<r;p++){let u=e(i[p]);if(a>p&&u>=n&&(a=p),u>=s){l=p;break}}let c=a,d=l-a!==o.length?i.slice(l):void 0;for(let p=0;p<o.length;p++)i[c++]=o[p];if(d){for(let p=0;p<d.length;p++)i[c++]=d[p];i.length=c}return{startRow:a,endRow:a+o.length}}var Eo=[0,0,0,255];var Qs={stroked:!0,filled:!0,extruded:!1,elevationScale:1,wireframe:!1,_normalize:!0,_windingOrder:`CW`,lineWidthUnits:`meters`,lineWidthScale:1,lineWidthMinPixels:0,lineWidthMaxPixels:Number.MAX_SAFE_INTEGER,lineJointRounded:!1,lineMiterLimit:4,lineAntialiasing:!1,getPolygon:{type:`accessor`,value:i=>i.polygon},getFillColor:{type:`accessor`,value:[0,0,0,255]},getLineColor:{type:`accessor`,value:Eo},getLineWidth:{type:`accessor`,value:1},getElevation:{type:`accessor`,value:1e3},material:!0};var We=class extends _m{initializeState(){this.state={paths:[],pathsDiff:null},this.props.getLineDashArray&&S.removed(`getLineDashArray`,`PathStyleExtension`)()}updateState({changeFlags:e}){let t=e.dataChanged||e.updateTriggersChanged&&(e.updateTriggersChanged.all||e.updateTriggersChanged.getPolygon);if(t&&Array.isArray(e.dataChanged)){let o=this.state.paths.slice(),n=e.dataChanged.map(s=>vt({data:o,getIndex:r=>r.__source.index,dataRange:s,replace:this._getPaths(s)}));this.setState({paths:o,pathsDiff:n})}else t&&this.setState({paths:this._getPaths(),pathsDiff:null})}_getPaths(e={}){let{data:t,getPolygon:o,positionFormat:n,_normalize:s}=this.props,r=[],a=n===`XY`?2:3,{startRow:l,endRow:c}=e,{iterable:f,objectInfo:d}=Yr(t,l,c);for(let p of f){d.index++;let u=o(p,d);s&&(u=ut(u,a));let{holeIndices:g}=u,h=u.positions||u;if(g)for(let v=0;v<=g.length;v++){let P=h.slice(g[v-1]||0,g[v]||h.length);r.push(this.getSubLayerRow({path:P},p,d.index))}else r.push(this.getSubLayerRow({path:h},p,d.index))}return r}renderLayers(){let{data:e,_dataDiff:t,stroked:o,filled:n,extruded:s,wireframe:r,_normalize:a,_windingOrder:l,elevationScale:c,transitions:f,positionFormat:d}=this.props,{lineWidthUnits:p,lineWidthScale:u,lineWidthMinPixels:g,lineWidthMaxPixels:h,lineJointRounded:v,lineMiterLimit:P,lineAntialiasing:C,lineDashJustified:m}=this.props,{getFillColor:x,getLineColor:S,getLineWidth:N,getLineDashArray:W,getElevation:j,getPolygon:F,updateTriggers:A,material:V}=this.props,{paths:B,pathsDiff:U}=this.state,$=this.getSubLayerClass(`fill`,Be),Q=this.getSubLayerClass(`stroke`,ze),D=this.shouldRenderSubLayer(`fill`,B)&&new $({_dataDiff:t,extruded:s,elevationScale:c,filled:n,wireframe:r,_normalize:a,_windingOrder:l,getElevation:j,getFillColor:x,getLineColor:s&&r?S:Eo,material:V,transitions:f},this.getSubLayerProps({id:`fill`,updateTriggers:A&&{getPolygon:A.getPolygon,getElevation:A.getElevation,getFillColor:A.getFillColor,lineColors:s&&r,getLineColor:A.getLineColor}}),{data:e,positionFormat:d,getPolygon:F}),I=!s&&o&&this.shouldRenderSubLayer(`stroke`,B)&&new Q({_dataDiff:U&&(()=>U),widthUnits:p,widthScale:u,widthMinPixels:g,widthMaxPixels:h,jointRounded:v,miterLimit:P,antialiasing:C,dashJustified:m,_pathType:`loop`,transitions:f&&{getWidth:f.getLineWidth,getColor:f.getLineColor,getPath:f.getPolygon},getColor:this.getSubLayerAccessor(S),getWidth:this.getSubLayerAccessor(N),getDashArray:this.getSubLayerAccessor(W)},this.getSubLayerProps({id:`stroke`,updateTriggers:A&&{getWidth:A.getLineWidth,getColor:A.getLineColor,getDashArray:A.getLineDashArray}}),{data:B,positionFormat:d,getPath:St=>St.path});return[!s&&D,I,s&&D]}};We.layerName=`PolygonLayer`;We.defaultProps=Qs;var er=We;function To(i,e){if(!i)return null;let t=`startIndices`in i?i.startIndices[e]:e,o=i.featureIds.value[t];return t!==-1?tr(i,o,t):null}function tr(i,e,t){let o={properties:r({},i.properties[e])};for(let n in i.numericProps)o.properties[n]=i.numericProps[n].value[t];return o}function Oo(i){let e={points:null,lines:null,polygons:null};for(let t in e){let o=i[t].globalFeatureIds.value;e[t]=new Uint32Array(o)}return e}var Ro=`layout(std140) uniform sdfUniforms {
|
|
3482
|
+
float gamma;
|
|
3483
|
+
bool enabled;
|
|
3484
|
+
float buffer;
|
|
3485
|
+
float outlineBuffer;
|
|
3486
|
+
vec4 outlineColor;
|
|
3487
|
+
} sdf;
|
|
3488
|
+
`;var Mo={name:`sdf`,vs:Ro,fs:Ro,uniformTypes:{gamma:`f32`,enabled:`f32`,buffer:`f32`,outlineBuffer:`f32`,outlineColor:`vec4<f32>`}};var Ue={none:0,start:1,center:2,end:3};var mt={name:`text`,vs:`layout(std140) uniform textUniforms {
|
|
3489
|
+
highp vec2 cutoffPixels;
|
|
3490
|
+
highp ivec2 align;
|
|
3491
|
+
highp float fontSize;
|
|
3492
|
+
bool flipY;
|
|
3493
|
+
} text;
|
|
3494
|
+
|
|
3495
|
+
#define ALIGN_MODE_START ${Ue.start}
|
|
3496
|
+
#define ALIGN_MODE_CENTER ${Ue.center}
|
|
3497
|
+
#define ALIGN_MODE_END ${Ue.end}
|
|
3498
|
+
`,getUniforms:({contentCutoffPixels:i=[0,0],contentAlignHorizontal:e=`none`,contentAlignVertical:t=`none`,fontSize:o,viewport:n})=>({cutoffPixels:i,align:[Ue[e],Ue[t]],fontSize:o,flipY:n?.flipY??!1}),uniformTypes:{cutoffPixels:`vec2<f32>`,align:`vec2<i32>`,fontSize:`f32`,flipY:`f32`}};var zo=`#version 300 es
|
|
3499
|
+
#define SHADER_NAME multi-icon-layer-vertex-shader
|
|
3500
|
+
in vec2 positions;
|
|
3501
|
+
in vec3 instancePositions;
|
|
3502
|
+
in vec3 instancePositions64Low;
|
|
3503
|
+
in float instanceSizes;
|
|
3504
|
+
in float instanceAngles;
|
|
3505
|
+
in vec4 instanceColors;
|
|
3506
|
+
in float rowIndexes;
|
|
3507
|
+
in vec4 instanceIconFrames;
|
|
3508
|
+
in float instanceColorModes;
|
|
3509
|
+
in vec2 instanceOffsets;
|
|
3510
|
+
in vec2 instancePixelOffset;
|
|
3511
|
+
in vec4 instanceClipRect;
|
|
3512
|
+
out float vColorMode;
|
|
3513
|
+
out vec4 vColor;
|
|
3514
|
+
out vec2 vTextureCoords;
|
|
3515
|
+
out vec2 uv;
|
|
3516
|
+
vec2 rotate_by_angle(vec2 vertex, float angle) {
|
|
3517
|
+
float angle_radian = angle * PI / 180.0;
|
|
3518
|
+
float cos_angle = cos(angle_radian);
|
|
3519
|
+
float sin_angle = sin(angle_radian);
|
|
3520
|
+
mat2 rotationMatrix = mat2(cos_angle, -sin_angle, sin_angle, cos_angle);
|
|
3521
|
+
return rotationMatrix * vertex;
|
|
3522
|
+
}
|
|
3523
|
+
float getPixelOffsetFromAlignment(float anchor, float extent, float clipStart, float clipEnd, int mode) {
|
|
3524
|
+
if (clipEnd < clipStart) return 0.0;
|
|
3525
|
+
if (mode == ALIGN_MODE_START) {
|
|
3526
|
+
return max(- (anchor + clipStart), 0.0);
|
|
3527
|
+
}
|
|
3528
|
+
if (mode == ALIGN_MODE_CENTER) {
|
|
3529
|
+
float _min = max(0., anchor + clipStart);
|
|
3530
|
+
float _max = min(extent, anchor + clipEnd);
|
|
3531
|
+
return _min < _max ? (_min + _max) / 2.0 - anchor : 0.0;
|
|
3532
|
+
}
|
|
3533
|
+
if (mode == ALIGN_MODE_END) {
|
|
3534
|
+
return min(extent - (anchor + clipEnd), 0.);
|
|
3535
|
+
}
|
|
3536
|
+
return 0.0;
|
|
3537
|
+
}
|
|
3538
|
+
void main(void) {
|
|
3539
|
+
geometry.worldPosition = instancePositions;
|
|
3540
|
+
geometry.uv = positions;
|
|
3541
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(rowIndexes);
|
|
3542
|
+
uv = positions;
|
|
3543
|
+
vec2 iconSize = instanceIconFrames.zw;
|
|
3544
|
+
float sizePixels = clamp(
|
|
3545
|
+
project_size_to_pixel(instanceSizes * icon.sizeScale, icon.sizeUnits),
|
|
3546
|
+
icon.sizeMinPixels, icon.sizeMaxPixels
|
|
3547
|
+
);
|
|
3548
|
+
float instanceScale = sizePixels / text.fontSize;
|
|
3549
|
+
vec2 pixelOffset = positions / 2.0 * iconSize + instanceOffsets;
|
|
3550
|
+
pixelOffset = rotate_by_angle(pixelOffset, instanceAngles) * instanceScale;
|
|
3551
|
+
pixelOffset += instancePixelOffset;
|
|
3552
|
+
pixelOffset.y *= -1.0;
|
|
3553
|
+
vec2 anchorPosScreen;
|
|
3554
|
+
if (icon.billboard) {
|
|
3555
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.0), geometry.position);
|
|
3556
|
+
anchorPosScreen = gl_Position.xy / gl_Position.w;
|
|
3557
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
3558
|
+
vec3 offset = vec3(pixelOffset, 0.0);
|
|
3559
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
3560
|
+
gl_Position.xy += project_pixel_size_to_clipspace(offset.xy);
|
|
3561
|
+
} else {
|
|
3562
|
+
vec3 offset_common = vec3(project_pixel_size(pixelOffset), 0.0);
|
|
3563
|
+
if (text.flipY) {
|
|
3564
|
+
offset_common.y *= -1.;
|
|
3565
|
+
}
|
|
3566
|
+
DECKGL_FILTER_SIZE(offset_common, geometry);
|
|
3567
|
+
vec4 anchorPos = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.0));
|
|
3568
|
+
anchorPosScreen = anchorPos.xy / anchorPos.w;
|
|
3569
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, offset_common, geometry.position);
|
|
3570
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
3571
|
+
}
|
|
3572
|
+
anchorPosScreen = vec2(anchorPosScreen.x + 1.0, 1.0 - anchorPosScreen.y) / 2.0 * project.viewportSize / project.devicePixelRatio;
|
|
3573
|
+
vec2 xy = project_size_to_pixel(instanceClipRect.xy);
|
|
3574
|
+
vec2 wh = project_size_to_pixel(instanceClipRect.zw);
|
|
3575
|
+
if (text.flipY) {
|
|
3576
|
+
xy.y = -xy.y - wh.y;
|
|
3577
|
+
}
|
|
3578
|
+
if (text.align.x > 0 || text.align.y > 0) {
|
|
3579
|
+
vec2 viewportPixels = project.viewportSize / project.devicePixelRatio;
|
|
3580
|
+
vec2 scrollPixels = vec2(
|
|
3581
|
+
getPixelOffsetFromAlignment(anchorPosScreen.x, viewportPixels.x, xy.x, xy.x + wh.x, text.align.x),
|
|
3582
|
+
-getPixelOffsetFromAlignment(anchorPosScreen.y, viewportPixels.y, -xy.y - wh.y, -xy.y, text.align.y)
|
|
3583
|
+
);
|
|
3584
|
+
pixelOffset += scrollPixels;
|
|
3585
|
+
gl_Position.xy += project_pixel_size_to_clipspace(scrollPixels);
|
|
3586
|
+
}
|
|
3587
|
+
if (instanceClipRect.z >= 0.) {
|
|
3588
|
+
if (pixelOffset.x < xy.x || pixelOffset.x > xy.x + wh.x) {
|
|
3589
|
+
gl_Position = vec4(0.0);
|
|
3590
|
+
}
|
|
3591
|
+
else if (text.cutoffPixels.x > 0.) {
|
|
3592
|
+
float vpWidth = project.viewportSize.x / project.devicePixelRatio;
|
|
3593
|
+
float l = max(anchorPosScreen.x + xy.x, 0.0);
|
|
3594
|
+
float r = min(anchorPosScreen.x + xy.x + wh.x, vpWidth);
|
|
3595
|
+
if (r - l < text.cutoffPixels.x) {
|
|
3596
|
+
gl_Position = vec4(0.0);
|
|
3597
|
+
}
|
|
3598
|
+
}
|
|
3599
|
+
}
|
|
3600
|
+
if (instanceClipRect.w >= 0.) {
|
|
3601
|
+
if (pixelOffset.y < xy.y || pixelOffset.y > xy.y + wh.y) {
|
|
3602
|
+
gl_Position = vec4(0.0);
|
|
3603
|
+
}
|
|
3604
|
+
else if (text.cutoffPixels.y > 0.) {
|
|
3605
|
+
float vpHeight = project.viewportSize.y / project.devicePixelRatio;
|
|
3606
|
+
float t = max(anchorPosScreen.y - xy.y - wh.y, 0.0);
|
|
3607
|
+
float b = min(anchorPosScreen.y - xy.y, vpHeight);
|
|
3608
|
+
if (b - t < text.cutoffPixels.y) {
|
|
3609
|
+
gl_Position = vec4(0.0);
|
|
3610
|
+
}
|
|
3611
|
+
}
|
|
3612
|
+
}
|
|
3613
|
+
vTextureCoords = mix(
|
|
3614
|
+
instanceIconFrames.xy,
|
|
3615
|
+
instanceIconFrames.xy + iconSize,
|
|
3616
|
+
(positions.xy + 1.0) / 2.0
|
|
3617
|
+
) / icon.iconsTextureDim;
|
|
3618
|
+
vColor = instanceColors;
|
|
3619
|
+
DECKGL_FILTER_COLOR(vColor, geometry);
|
|
3620
|
+
vColorMode = instanceColorModes;
|
|
3621
|
+
}
|
|
3622
|
+
`;var ko=`#version 300 es
|
|
3623
|
+
#define SHADER_NAME multi-icon-layer-fragment-shader
|
|
3624
|
+
precision highp float;
|
|
3625
|
+
uniform sampler2D iconsTexture;
|
|
3626
|
+
in vec4 vColor;
|
|
3627
|
+
in vec2 vTextureCoords;
|
|
3628
|
+
in vec2 uv;
|
|
3629
|
+
out vec4 fragColor;
|
|
3630
|
+
void main(void) {
|
|
3631
|
+
geometry.uv = uv;
|
|
3632
|
+
if (!bool(picking.isActive)) {
|
|
3633
|
+
float alpha = texture(iconsTexture, vTextureCoords).a;
|
|
3634
|
+
vec4 color = vColor;
|
|
3635
|
+
if (sdf.enabled) {
|
|
3636
|
+
float distance = alpha;
|
|
3637
|
+
alpha = smoothstep(sdf.buffer - sdf.gamma, sdf.buffer + sdf.gamma, distance);
|
|
3638
|
+
if (sdf.outlineBuffer > 0.0) {
|
|
3639
|
+
float inFill = alpha;
|
|
3640
|
+
float inBorder = smoothstep(sdf.outlineBuffer - sdf.gamma, sdf.outlineBuffer + sdf.gamma, distance);
|
|
3641
|
+
color = mix(sdf.outlineColor, vColor, inFill);
|
|
3642
|
+
alpha = inBorder;
|
|
3643
|
+
}
|
|
3644
|
+
}
|
|
3645
|
+
float a = alpha * color.a;
|
|
3646
|
+
if (a < icon.alphaCutoff) {
|
|
3647
|
+
discard;
|
|
3648
|
+
}
|
|
3649
|
+
fragColor = vec4(color.rgb, a * layer.opacity);
|
|
3650
|
+
}
|
|
3651
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
3652
|
+
}
|
|
3653
|
+
`;function or({collision:i=!1}={}){return`struct IconUniforms {
|
|
3654
|
+
sizeScale: f32,
|
|
3655
|
+
iconsTextureDim: vec2<f32>,
|
|
3656
|
+
sizeBasis: f32,
|
|
3657
|
+
sizeMinPixels: f32,
|
|
3658
|
+
sizeMaxPixels: f32,
|
|
3659
|
+
billboard: i32,
|
|
3660
|
+
sizeUnits: i32,
|
|
3661
|
+
alphaCutoff: f32
|
|
3662
|
+
};
|
|
3663
|
+
|
|
3664
|
+
struct TextUniforms {
|
|
3665
|
+
cutoffPixels: vec2<f32>,
|
|
3666
|
+
align: vec2<i32>,
|
|
3667
|
+
fontSize: f32,
|
|
3668
|
+
flipY: f32
|
|
3669
|
+
};
|
|
3670
|
+
|
|
3671
|
+
struct SdfUniforms {
|
|
3672
|
+
gamma: f32,
|
|
3673
|
+
enabled: f32,
|
|
3674
|
+
buffer: f32,
|
|
3675
|
+
outlineBuffer: f32,
|
|
3676
|
+
outlineColor: vec4<f32>
|
|
3677
|
+
};
|
|
3678
|
+
|
|
3679
|
+
${i?`struct CollisionUniforms {
|
|
3680
|
+
sort: i32,
|
|
3681
|
+
enabled: i32
|
|
3682
|
+
};
|
|
3683
|
+
`:``}
|
|
3684
|
+
|
|
3685
|
+
const ALIGN_MODE_START: i32 = 1;
|
|
3686
|
+
const ALIGN_MODE_CENTER: i32 = 2;
|
|
3687
|
+
const ALIGN_MODE_END: i32 = 3;
|
|
3688
|
+
|
|
3689
|
+
@group(0) @binding(auto) var<uniform> icon: IconUniforms;
|
|
3690
|
+
@group(0) @binding(auto) var<uniform> text: TextUniforms;
|
|
3691
|
+
@group(0) @binding(auto) var<uniform> sdf: SdfUniforms;
|
|
3692
|
+
${i?`@group(0) @binding(auto) var<uniform> collision: CollisionUniforms;`:``}
|
|
3693
|
+
@group(0) @binding(auto) var iconsTexture : texture_2d<f32>;
|
|
3694
|
+
@group(0) @binding(auto) var iconsTextureSampler : sampler;
|
|
3695
|
+
${i?`@group(0) @binding(auto) var collision_texture : texture_2d<f32>;
|
|
3696
|
+
`:``}
|
|
3697
|
+
|
|
3698
|
+
fn rotate_by_angle(vertex: vec2<f32>, angle_deg: f32) -> vec2<f32> {
|
|
3699
|
+
let angle_radian = angle_deg * PI / 180.0;
|
|
3700
|
+
let c = cos(angle_radian);
|
|
3701
|
+
let s = sin(angle_radian);
|
|
3702
|
+
let rotation = mat2x2<f32>(vec2<f32>(c, -s), vec2<f32>(s, c));
|
|
3703
|
+
return rotation * vertex;
|
|
3704
|
+
}
|
|
3705
|
+
|
|
3706
|
+
fn get_pixel_offset_from_alignment(
|
|
3707
|
+
anchor: f32,
|
|
3708
|
+
extent: f32,
|
|
3709
|
+
clipStart: f32,
|
|
3710
|
+
clipEnd: f32,
|
|
3711
|
+
mode: i32
|
|
3712
|
+
) -> f32 {
|
|
3713
|
+
if (clipEnd < clipStart) {
|
|
3714
|
+
return 0.0;
|
|
3715
|
+
}
|
|
3716
|
+
if (mode == ALIGN_MODE_START) {
|
|
3717
|
+
return max(-(anchor + clipStart), 0.0);
|
|
3718
|
+
}
|
|
3719
|
+
if (mode == ALIGN_MODE_CENTER) {
|
|
3720
|
+
let minValue = max(0.0, anchor + clipStart);
|
|
3721
|
+
let maxValue = min(extent, anchor + clipEnd);
|
|
3722
|
+
if (minValue < maxValue) {
|
|
3723
|
+
return (minValue + maxValue) / 2.0 - anchor;
|
|
3724
|
+
}
|
|
3725
|
+
return 0.0;
|
|
3726
|
+
}
|
|
3727
|
+
if (mode == ALIGN_MODE_END) {
|
|
3728
|
+
return min(extent - (anchor + clipEnd), 0.0);
|
|
3729
|
+
}
|
|
3730
|
+
return 0.0;
|
|
3731
|
+
}
|
|
3732
|
+
|
|
3733
|
+
${i?`fn collision_match(texCoords: vec2<f32>, pickingColor: vec3<f32>) -> f32 {
|
|
3734
|
+
let textureSize = vec2<i32>(textureDimensions(collision_texture));
|
|
3735
|
+
let pixelCoords = clamp(
|
|
3736
|
+
vec2<i32>(texCoords * vec2<f32>(textureSize)),
|
|
3737
|
+
vec2<i32>(0),
|
|
3738
|
+
textureSize - vec2<i32>(1)
|
|
3739
|
+
);
|
|
3740
|
+
let collisionPickingColor = textureLoad(collision_texture, pixelCoords, 0);
|
|
3741
|
+
let delta = dot(abs(collisionPickingColor.rgb - pickingColor), vec3<f32>(1.0));
|
|
3742
|
+
return step(delta, 0.001);
|
|
3743
|
+
}
|
|
3744
|
+
|
|
3745
|
+
fn collision_is_visible(texCoords: vec2<f32>, pickingColor: vec3<f32>) -> f32 {
|
|
3746
|
+
if (collision.enabled == 0) {
|
|
3747
|
+
return 1.0;
|
|
3748
|
+
}
|
|
3749
|
+
|
|
3750
|
+
var accumulator = 0.0;
|
|
3751
|
+
let stepSize = vec2<f32>(1.0) / project.viewportSize;
|
|
3752
|
+
|
|
3753
|
+
for (var i: i32 = -2; i <= 2; i = i + 1) {
|
|
3754
|
+
for (var j: i32 = -2; j <= 2; j = j + 1) {
|
|
3755
|
+
let delta = vec2<f32>(f32(j), f32(i)) * stepSize;
|
|
3756
|
+
accumulator = accumulator + collision_match(texCoords + delta, pickingColor);
|
|
3757
|
+
}
|
|
3758
|
+
}
|
|
3759
|
+
|
|
3760
|
+
return pow(accumulator / 25.0, 2.2);
|
|
3761
|
+
}
|
|
3762
|
+
`:``}
|
|
3763
|
+
|
|
3764
|
+
struct Attributes {
|
|
3765
|
+
@location(0) positions: vec2<f32>,
|
|
3766
|
+
|
|
3767
|
+
@location(1) instancePositions: vec3<f32>,
|
|
3768
|
+
@location(2) instancePositions64Low: vec3<f32>,
|
|
3769
|
+
@location(3) instanceSizes: f32,
|
|
3770
|
+
@location(4) instanceAngles: f32,
|
|
3771
|
+
@location(5) instanceColors: vec4<f32>,
|
|
3772
|
+
@location(6) instanceIconFrames: vec4<f32>,
|
|
3773
|
+
@location(7) instanceColorModes: f32,
|
|
3774
|
+
@location(8) instanceOffsets: vec2<f32>,
|
|
3775
|
+
@location(9) instancePixelOffset: vec2<f32>,
|
|
3776
|
+
@location(10) rowIndexes: u32,
|
|
3777
|
+
@location(11) instanceClipRect: vec4<f32>,
|
|
3778
|
+
${i?`@location(12) collisionPriorities: f32,`:``}
|
|
3779
|
+
};
|
|
3780
|
+
|
|
3781
|
+
struct Varyings {
|
|
3782
|
+
@builtin(position) position: vec4<f32>,
|
|
3783
|
+
|
|
3784
|
+
@location(0) vColorMode: f32,
|
|
3785
|
+
@location(1) vColor: vec4<f32>,
|
|
3786
|
+
@location(2) vTextureCoords: vec2<f32>,
|
|
3787
|
+
@location(3) uv: vec2<f32>,
|
|
3788
|
+
@location(4) pickingColor: vec3<f32>,
|
|
3789
|
+
};
|
|
3790
|
+
|
|
3791
|
+
@vertex
|
|
3792
|
+
fn vertexMain(inp: Attributes) -> Varyings {
|
|
3793
|
+
geometry.worldPosition = inp.instancePositions;
|
|
3794
|
+
geometry.uv = inp.positions;
|
|
3795
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(inp.rowIndexes);
|
|
3796
|
+
|
|
3797
|
+
var outp: Varyings;
|
|
3798
|
+
outp.uv = inp.positions;
|
|
3799
|
+
|
|
3800
|
+
let iconSize = inp.instanceIconFrames.zw;
|
|
3801
|
+
|
|
3802
|
+
let sizePixels = clamp(
|
|
3803
|
+
project_unit_size_to_pixel(inp.instanceSizes * icon.sizeScale, icon.sizeUnits),
|
|
3804
|
+
icon.sizeMinPixels, icon.sizeMaxPixels
|
|
3805
|
+
);
|
|
3806
|
+
let instanceScale = sizePixels / text.fontSize;
|
|
3807
|
+
|
|
3808
|
+
var pixelOffset = inp.positions / 2.0 * iconSize + inp.instanceOffsets;
|
|
3809
|
+
pixelOffset = rotate_by_angle(pixelOffset, inp.instanceAngles) * instanceScale;
|
|
3810
|
+
pixelOffset = pixelOffset + inp.instancePixelOffset;
|
|
3811
|
+
pixelOffset.y = pixelOffset.y * -1.0;
|
|
3812
|
+
|
|
3813
|
+
var pos: vec4<f32>;
|
|
3814
|
+
var anchorPosScreen: vec2<f32>;
|
|
3815
|
+
if (icon.billboard != 0) {
|
|
3816
|
+
pos = project_position_to_clipspace(inp.instancePositions, inp.instancePositions64Low, vec3<f32>(0.0));
|
|
3817
|
+
anchorPosScreen = pos.xy / pos.w;
|
|
3818
|
+
|
|
3819
|
+
let clipOffset = project_pixel_size_to_clipspace(pixelOffset);
|
|
3820
|
+
pos = vec4<f32>(pos.x + clipOffset.x, pos.y + clipOffset.y, pos.z, pos.w);
|
|
3821
|
+
} else {
|
|
3822
|
+
var offsetCommon = vec3<f32>(project_pixel_size_vec2(pixelOffset), 0.0);
|
|
3823
|
+
if (text.flipY > 0.5) {
|
|
3824
|
+
offsetCommon.y = offsetCommon.y * -1.0;
|
|
3825
|
+
}
|
|
3826
|
+
let anchorPos = project_position_to_clipspace(inp.instancePositions, inp.instancePositions64Low, vec3<f32>(0.0));
|
|
3827
|
+
anchorPosScreen = anchorPos.xy / anchorPos.w;
|
|
3828
|
+
pos = project_position_to_clipspace(inp.instancePositions, inp.instancePositions64Low, offsetCommon);
|
|
3829
|
+
}
|
|
3830
|
+
|
|
3831
|
+
anchorPosScreen = vec2<f32>(anchorPosScreen.x + 1.0, 1.0 - anchorPosScreen.y) / 2.0 *
|
|
3832
|
+
project.viewportSize / project.devicePixelRatio;
|
|
3833
|
+
var xy = project_size_vec2(inp.instanceClipRect.xy) * project.scale;
|
|
3834
|
+
var wh = project_size_vec2(inp.instanceClipRect.zw) * project.scale;
|
|
3835
|
+
|
|
3836
|
+
if (text.flipY > 0.5) {
|
|
3837
|
+
xy.y = -xy.y - wh.y;
|
|
3838
|
+
}
|
|
3839
|
+
if (text.align.x > 0 || text.align.y > 0) {
|
|
3840
|
+
let viewportPixels = project.viewportSize / project.devicePixelRatio;
|
|
3841
|
+
let scrollPixels = vec2<f32>(
|
|
3842
|
+
get_pixel_offset_from_alignment(anchorPosScreen.x, viewportPixels.x, xy.x, xy.x + wh.x, text.align.x),
|
|
3843
|
+
-get_pixel_offset_from_alignment(anchorPosScreen.y, viewportPixels.y, -xy.y - wh.y, -xy.y, text.align.y)
|
|
3844
|
+
);
|
|
3845
|
+
pixelOffset = pixelOffset + scrollPixels;
|
|
3846
|
+
let scrollClipOffset = project_pixel_size_to_clipspace(scrollPixels);
|
|
3847
|
+
pos.x = pos.x + scrollClipOffset.x;
|
|
3848
|
+
pos.y = pos.y + scrollClipOffset.y;
|
|
3849
|
+
}
|
|
3850
|
+
|
|
3851
|
+
if (inp.instanceClipRect.z >= 0.0) {
|
|
3852
|
+
if (pixelOffset.x < xy.x || pixelOffset.x > xy.x + wh.x) {
|
|
3853
|
+
pos = vec4<f32>(0.0);
|
|
3854
|
+
} else if (text.cutoffPixels.x > 0.0) {
|
|
3855
|
+
let viewportWidth = project.viewportSize.x / project.devicePixelRatio;
|
|
3856
|
+
let left = max(anchorPosScreen.x + xy.x, 0.0);
|
|
3857
|
+
let right = min(anchorPosScreen.x + xy.x + wh.x, viewportWidth);
|
|
3858
|
+
if (right - left < text.cutoffPixels.x) {
|
|
3859
|
+
pos = vec4<f32>(0.0);
|
|
3860
|
+
}
|
|
3861
|
+
}
|
|
3862
|
+
}
|
|
3863
|
+
if (inp.instanceClipRect.w >= 0.0) {
|
|
3864
|
+
if (pixelOffset.y < xy.y || pixelOffset.y > xy.y + wh.y) {
|
|
3865
|
+
pos = vec4<f32>(0.0);
|
|
3866
|
+
} else if (text.cutoffPixels.y > 0.0) {
|
|
3867
|
+
let viewportHeight = project.viewportSize.y / project.devicePixelRatio;
|
|
3868
|
+
let top = max(anchorPosScreen.y - xy.y - wh.y, 0.0);
|
|
3869
|
+
let bottom = min(anchorPosScreen.y - xy.y, viewportHeight);
|
|
3870
|
+
if (bottom - top < text.cutoffPixels.y) {
|
|
3871
|
+
pos = vec4<f32>(0.0);
|
|
3872
|
+
}
|
|
3873
|
+
}
|
|
3874
|
+
}
|
|
3875
|
+
|
|
3876
|
+
${i?` if (collision.sort != 0) {
|
|
3877
|
+
pos.z = -0.001 * inp.collisionPriorities * pos.w;
|
|
3878
|
+
}
|
|
3879
|
+
`:``}
|
|
3880
|
+
|
|
3881
|
+
let uvMix = (inp.positions.xy + vec2<f32>(1.0, 1.0)) * 0.5;
|
|
3882
|
+
outp.vTextureCoords = mix(inp.instanceIconFrames.xy, inp.instanceIconFrames.xy + iconSize, uvMix) / icon.iconsTextureDim;
|
|
3883
|
+
|
|
3884
|
+
outp.position = pos;
|
|
3885
|
+
outp.vColor = inp.instanceColors;
|
|
3886
|
+
outp.vColorMode = inp.instanceColorModes;
|
|
3887
|
+
outp.pickingColor = picking_getPickingColorFromIndex(inp.rowIndexes);
|
|
3888
|
+
|
|
3889
|
+
return outp;
|
|
3890
|
+
}
|
|
3891
|
+
|
|
3892
|
+
@fragment
|
|
3893
|
+
fn fragmentMain(inp: Varyings) -> @location(0) vec4<f32> {
|
|
3894
|
+
geometry.uv = inp.uv;
|
|
3895
|
+
|
|
3896
|
+
let texColor = textureSample(iconsTexture, iconsTextureSampler, inp.vTextureCoords);
|
|
3897
|
+
var alpha = texColor.a;
|
|
3898
|
+
var color = inp.vColor;
|
|
3899
|
+
|
|
3900
|
+
if (sdf.enabled > 0.5) {
|
|
3901
|
+
let distance = alpha;
|
|
3902
|
+
alpha = smoothstep(sdf.buffer - sdf.gamma, sdf.buffer + sdf.gamma, distance);
|
|
3903
|
+
|
|
3904
|
+
if (sdf.outlineBuffer > 0.0) {
|
|
3905
|
+
let inFill = alpha;
|
|
3906
|
+
let inBorder = smoothstep(sdf.outlineBuffer - sdf.gamma, sdf.outlineBuffer + sdf.gamma, distance);
|
|
3907
|
+
color = mix(sdf.outlineColor, inp.vColor, inFill);
|
|
3908
|
+
alpha = inBorder;
|
|
3909
|
+
}
|
|
3910
|
+
} else if (inp.vColorMode == 0.0) {
|
|
3911
|
+
color = texColor;
|
|
3912
|
+
}
|
|
3913
|
+
|
|
3914
|
+
var a = alpha * color.a * layer.opacity;
|
|
3915
|
+
if (a < icon.alphaCutoff) {
|
|
3916
|
+
discard;
|
|
3917
|
+
}
|
|
3918
|
+
|
|
3919
|
+
if (picking.isActive > 0.5) {
|
|
3920
|
+
if (!picking_isColorValid(inp.pickingColor)) {
|
|
3921
|
+
discard;
|
|
3922
|
+
}
|
|
3923
|
+
return vec4<f32>(inp.pickingColor, 1.0);
|
|
3924
|
+
}
|
|
3925
|
+
|
|
3926
|
+
${i?` let collisionFade = collision_is_visible(inp.position.xy / project.viewportSize, inp.pickingColor);
|
|
3927
|
+
a = a * collisionFade;
|
|
3928
|
+
if (a <= 0.0001) {
|
|
3929
|
+
discard;
|
|
3930
|
+
}
|
|
3931
|
+
`:``}
|
|
3932
|
+
|
|
3933
|
+
var fragColor = deckgl_premultiplied_alpha(vec4<f32>(color.rgb, a));
|
|
3934
|
+
|
|
3935
|
+
if (picking.isHighlightActive > 0.5) {
|
|
3936
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
3937
|
+
if (picking_isColorZero(abs(inp.pickingColor - highlightedObjectColor))) {
|
|
3938
|
+
let highLightAlpha = picking.highlightColor.a;
|
|
3939
|
+
let blendedAlpha = highLightAlpha + fragColor.a * (1.0 - highLightAlpha);
|
|
3940
|
+
if (blendedAlpha > 0.0) {
|
|
3941
|
+
let highLightRatio = highLightAlpha / blendedAlpha;
|
|
3942
|
+
fragColor = vec4<f32>(
|
|
3943
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highLightRatio),
|
|
3944
|
+
blendedAlpha
|
|
3945
|
+
);
|
|
3946
|
+
} else {
|
|
3947
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
3948
|
+
}
|
|
3949
|
+
}
|
|
3950
|
+
}
|
|
3951
|
+
|
|
3952
|
+
return fragColor;
|
|
3953
|
+
}
|
|
3954
|
+
`}var Do=or();var Ft=192/256;var nr={getIconOffsets:{type:`accessor`,value:i=>i.offsets},getContentBox:{type:`accessor`,value:[0,0,-1,-1]},fontSize:1,alphaCutoff:.001,smoothing:.1,outlineWidth:0,outlineColor:{type:`color`,value:[0,0,0,255]},contentCutoffPixels:{type:`array`,value:[0,0]},contentAlignHorizontal:`none`,contentAlignVertical:`none`};var Ve=class extends ge{getShaders(){let e=super.getShaders();return s(r({},e),{modules:[...e.modules,mt,Mo],vs:zo,fs:ko,source:Do})}initializeState(){super.initializeState();let e=this.getAttributeManager(),t=e.attributes.instanceIconDefs;t.settings.update=this.calculateInstanceIconDefs,e.addInstanced({rowIndexes:{type:`uint32`,size:1,bufferGroup:`icon-instance-data`,accessor:(o,{index:n})=>n},instanceClipRect:{size:4,bufferGroup:`icon-instance-data`,accessor:`getContentBox`,defaultValue:[0,0,-1,-1]}})}updateState(e){super.updateState(e);let{props:t,oldProps:o,changeFlags:n}=e,{outlineColor:s}=t;if(n.extensionsChanged){this.state.fillModel?.destroy();let r=this.context.device.type===`webgpu`?this._getModel(`${this.props.id}-fill`):void 0;this.setState({fillModel:r,models:r?[this.state.model,r]:[this.state.model]})}if(n.updateTriggersChanged&&(n.updateTriggersChanged.getIcon||n.updateTriggersChanged.getIconOffsets)&&this.getAttributeManager().invalidate(`instanceIconDefs`),s!==o.outlineColor){let r=[s[0]/255,s[1]/255,s[2]/255,(s[3]??255)/255];this.setState({outlineColor:r})}!t.sdf&&t.outlineWidth&&S.warn(`${this.id}: fontSettings.sdf is required to render outline`)()}draw(e){let{sdf:t,smoothing:o,fontSize:n,outlineWidth:s$9,contentCutoffPixels:r$10,contentAlignHorizontal:a,contentAlignVertical:l}=this.props,{outlineColor:c}=this.state,f=s$9?Math.max(o,Ft*(1-s$9)):-1,d=this.state.model,p={buffer:Ft,outlineBuffer:f,gamma:o,enabled:!!t,outlineColor:c},u={contentCutoffPixels:r$10,contentAlignHorizontal:a,contentAlignVertical:l,fontSize:n,viewport:this.context.viewport};if(d.shaderInputs.setProps({sdf:p,text:u}),super.draw(e),t&&s$9){let{iconManager:g}=this.state;if(g.getTexture()){let v=this.state.fillModel||d;v.shaderInputs.setProps({sdf:s(r({},p),{outlineBuffer:Ft}),text:u}),this._drawModel(v)}}}calculateInstanceIconDefs(e,{startRow:t,endRow:o}){let{data:n,getIcon:s,getIconOffsets:r}=this.props,a=e.getVertexOffset(t),l=e.value,{iterable:c,objectInfo:f}=Yr(n,t,o);for(let d of c){f.index++;let p=s(d,f),u=r(d,f);if(p){let g=0;for(let h of Array.from(p)){let v=super.getInstanceIconDef(h);v[0]=u[g*2],v[1]+=u[g*2+1],v[6]=1,l.set(v,a),a+=e.size,g++}}}}};Ve.defaultProps=nr;Ve.layerName=`MultiIconLayer`;var Nt=Ve;var Gt=new Float64Array(256);for(let i=0;i<256;i++){let e=.5-Math.pow(i/255,.45454545454545453);Gt[i]=e*Math.abs(e)}Gt[255]=-0x56bc75e2d63100000;var He=class{constructor({fontSize:e=24,buffer:t=3,radius:o=8,cutoff:n=.25,fontFamily:s=`sans-serif`,fontWeight:r=`normal`,fontStyle:a=`normal`,lang:l=null}={}){t=this.buffer=Math.round(t),this.radius=o,this.cutoff=n,this.lang=l;let c=this.size=Math.ceil(e)+t*4,f=this._createCanvas(c),d=this.ctx=f.getContext(`2d`,{willReadFrequently:!0});d.font=`${a} ${r} ${e}px ${s}`,d.textBaseline=`alphabetic`,d.textAlign=`left`,d.fillStyle=`black`,l&&(d.lang=l);let u=(this.maxGlyphDim=c-t)+2*t;this.gridOuter=new Float64Array(u*u),this.gridInner=new Float64Array(u*u),this.f=new Float64Array(u),this.z=new Float64Array(u+1),this.v=new Uint16Array(u)}_createCanvas(e){if(typeof OffscreenCanvas<`u`)return new OffscreenCanvas(e,e);let t=document.createElement(`canvas`);return t.width=t.height=e,t}draw(e){let{width:t,actualBoundingBoxAscent:o,actualBoundingBoxDescent:n,actualBoundingBoxLeft:s,actualBoundingBoxRight:r}=this.ctx.measureText(e),a=Math.ceil(o),l=Math.floor(-s),c=Math.max(0,Math.min(this.maxGlyphDim,Math.ceil(r)-l)),f=Math.max(0,Math.min(this.maxGlyphDim,a+Math.ceil(n))),d=c+2*this.buffer,p=f+2*this.buffer,u=d*p,g=new Uint8ClampedArray(u),h={data:g,width:d,height:p,glyphWidth:c,glyphHeight:f,glyphTop:a,glyphLeft:l,glyphAdvance:t};if(c===0||f===0)return h;let{ctx:v,buffer:P,gridInner:C,gridOuter:m}=this;v.clearRect(P,P,c,f),v.fillText(e,P-l,P+a);let x=v.getImageData(P,P,c,f);m.fill(0x56bc75e2d63100000,0,u),C.fill(0,0,u);let S=3;for(let F=0;F<f;F++){let A=(F+P)*d+P;for(let V=0;V<c;V++,S+=4,A++){let B=x.data[S];if(B===0)continue;let U=Gt[B];m[A]=Math.max(0,U),C[A]=Math.max(0,-U)}}Fo(m,0,0,d,p,d,this.f,this.v,this.z,P);let N=Math.min(P,1);Fo(C,P-N,P-N,c+2*N,f+2*N,d,this.f,this.v,this.z);let W=255/this.radius,j=255*(1-this.cutoff);for(let F=0;F<u;F++){let A=Math.sqrt(m[F])-Math.sqrt(C[F]);g[F]=j-W*A}return h}};function Fo(i,e,t,o,n,s,r,a,l,c=0){for(let f=e+c;f<e+o-c;f++)No(i,t*s+f,s,n,r,a,l);for(let f=t;f<t+n;f++)No(i,f*s+e,1,o,r,a,l)}function No(i,e,t,o,n,s,r){s[0]=0,r[0]=-0x56bc75e2d63100000,r[1]=0x56bc75e2d63100000,n[0]=i[e];for(let a=1,l=0;a<o;a++){let c=n[a]=i[e+a*t],f=a*a,d;do{let p=s[l];d=(c-n[p]+f-p*p)/(a-p)/2}while(d<=r[l]&&--l>-1);l++,s[l]=a,r[l]=d,r[l+1]=0x56bc75e2d63100000}for(let a=0,l=0;a<o;a++){for(;r[l+1]<a;)l++;let c=s[l],f=a-c;i[e+a*t]=n[c]+f*f}}var sr=32;var rr=[];function ar(i){return Math.pow(2,Math.ceil(Math.log2(i)))}function Go({characterSet:i,measureText:e,buffer:t,maxCanvasWidth:o,mapping:n={},xOffset:s=0,yOffsetMin:r=0,yOffsetMax:a=0}){let c=s,f=r,d=a;for(let p of i)if(!n[p]){let{advance:u,width:g,ascent:h,descent:v}=e(p),P=h+v;c+g+t*2>o&&(c=0,f=d),n[p]={x:c+t,y:f+t,width:g,height:P,advance:u,anchorX:g/2,anchorY:h},c+=g+t*2,d=Math.max(d,f+P+t*2)}return{mapping:n,xOffset:c,yOffsetMin:f,yOffsetMax:d,canvasHeight:ar(d)}}function jo(i,e,t,o){let n=0;for(let s=e;s<t;s++){let r=i[s];n+=o[r]?.advance||0}return n}function Bo(i,e,t,o,n,s){let r=e,a=0;for(let l=e;l<t;l++){let c=jo(i,l,l+1,n);a+c>o&&(r<l&&s.push(l),r=l,a=0),a+=c}return a}function lr(i,e,t,o,n,s){let r=e,a=e,l=e,c=0;for(let f=e;f<t;f++)if((i[f]===` `||i[f+1]===` `||f+1===t)&&(l=f+1),l>a){let d=jo(i,a,l,n);c+d>o&&(r<a&&(s.push(a),r=a,c=0),d>o&&(d=Bo(i,a,l,o,n,s),r=s[s.length-1])),a=l,c+=d}return c}function cr(i,e,t,o,n=0,s){s===void 0&&(s=i.length);let r=[];return e===`break-all`?Bo(i,n,s,t,o,r):lr(i,n,s,t,o,r),r}function fr(i,e,t,o,n,s){let r=0,a=0;for(let l=e;l<t;l++){let f=o[i[l]];f&&(a=Math.max(a,f.height))}for(let l=e;l<t;l++){let c=i[l],f=o[c];f?(n[l]=r+f.anchorX,r+=f.advance):(S.warn(`Missing character: ${c} (${c.codePointAt(0)})`)(),n[l]=r,r+=sr)}s[0]=r,s[1]=a}function Wo(i,e,t,o,n,s){let r=Array.from(i),a=r.length,l=new Array(a),c=new Array(a),f=new Array(a),d=(o===`break-word`||o===`break-all`)&&isFinite(n)&&n>0,p=[0,0],u=[0,0],g=0,h=e+t/2,v=0,P=0;for(let C=0;C<=a;C++){let m=r[C];if((m===`
|
|
3955
|
+
`||C===a)&&(P=C),P>v){let x=d?cr(r,o,n,s,v,P):rr;for(let S=0;S<=x.length;S++){let N=S===0?v:x[S-1],W=S<x.length?x[S]:P;fr(r,N,W,s,l,u);for(let j=N;j<W;j++)c[j]=h,f[j]=u[0];g++,h+=t,p[0]=Math.max(p[0],u[0])}v=P}m===`
|
|
3956
|
+
`&&(l[v]=0,c[v]=0,f[v]=0,v++)}return p[1]=g*t,{x:l,y:c,rowWidth:f,size:p}}function Uo({value:i,length:e,stride:t,offset:o,startIndices:n,characterSet:s}){let r=i.BYTES_PER_ELEMENT,a=t?t/r:1,l=o?o/r:0,c=n[e]||Math.ceil((i.length-l)/a),f=s&&new Set,d=new Array(e),p=i;if(a>1||l>0){let u=i.constructor;p=new u(c);for(let g=0;g<c;g++)p[g]=i[g*a+l]}for(let u=0;u<e;u++){let g=n[u],h=n[u+1]||c,v=p.subarray(g,h);d[u]=String.fromCodePoint.apply(null,v),f&&v.forEach(f.add,f)}if(f)for(let u of f)s.add(String.fromCodePoint(u));return{texts:d,characterCount:c}}var ae=class{constructor(e=5){this._cache={},this._order=[],this.limit=e}get(e){let t=this._cache[e];return t&&(this._deleteOrder(e),this._appendOrder(e)),t}set(e,t){this._cache[e]?(this.delete(e),this._cache[e]=t,this._appendOrder(e)):(Object.keys(this._cache).length===this.limit&&this.delete(this._order[0]),this._cache[e]=t,this._appendOrder(e))}delete(e){this._cache[e]&&(delete this._cache[e],this._deleteOrder(e))}_deleteOrder(e){let t=this._order.indexOf(e);t>=0&&this._order.splice(t,1)}_appendOrder(e){this._order.push(e)}};function dr(){let i=[];for(let e=32;e<128;e++)i.push(String.fromCharCode(e));return i}var q={fontFamily:`Monaco, monospace`,fontWeight:`normal`,characterSet:dr(),fontSize:64,buffer:4,sdf:!1,cutoff:.25,radius:12,smoothing:.1};var Vo=1024;var Ho=.9;var Zo=.3;var $o=3;var yt=new ae($o);function pr(i,e){let t;typeof e==`string`?t=new Set(Array.from(e)):t=new Set(e);let o=yt.get(i);if(!o)return t;for(let n in o.mapping)t.has(n)&&t.delete(n);return t}function ur(i,e){for(let t=0;t<i.length;t++)e.data[4*t+3]=i[t]}function Ko(i,e,t,o){i.font=`${o} ${t}px ${e}`,i.fillStyle=`#000`,i.textBaseline=`alphabetic`,i.textAlign=`left`}function gr(i,e,t){if(t===void 0){let n=i.measureText(`A`);return n.fontBoundingBoxAscent?{advance:0,width:0,ascent:Math.ceil(n.fontBoundingBoxAscent),descent:Math.ceil(n.fontBoundingBoxDescent)}:{advance:0,width:0,ascent:e*Ho,descent:e*Zo}}let o=i.measureText(t);return o.actualBoundingBoxAscent?{advance:o.width,width:Math.ceil(o.actualBoundingBoxRight-o.actualBoundingBoxLeft),ascent:Math.ceil(o.actualBoundingBoxAscent),descent:Math.ceil(o.actualBoundingBoxDescent)}:{advance:o.width,width:o.width,ascent:e*Ho,descent:e*Zo}}function Yo(i){S.assert(Number.isFinite(i)&&i>=$o,`Invalid cache limit`),yt=new ae(i)}var Ze=class{constructor(){this.props=r({},q)}get atlas(){return this._atlas}get mapping(){return this._atlas&&this._atlas.mapping}setProps(e={}){Object.assign(this.props,e),e._getFontRenderer&&(this._getFontRenderer=e._getFontRenderer),this._key=this._getKey();let t=pr(this._key,this.props.characterSet),o=yt.get(this._key);if(o&&t.size===0){this._atlas!==o&&(this._atlas=o);return}let n=this._generateFontAtlas(t,o);this._atlas=n,yt.set(this._key,n)}_generateFontAtlas(e,t){let{fontFamily:o,fontWeight:n,fontSize:s,buffer:r$11,sdf:a,radius:l,cutoff:c}=this.props,f=t&&t.data;f||(f=document.createElement(`canvas`),f.width=Vo);let d=f.getContext(`2d`,{willReadFrequently:!0});Ko(d,o,s,n);let p=x=>gr(d,s,x),u;this._getFontRenderer?u=this._getFontRenderer(this.props):a&&(u={measure:p,draw:hr(this.props)});let{mapping:g,canvasHeight:h,xOffset:v,yOffsetMin:P,yOffsetMax:C}=Go(r({measureText:x=>u?u.measure(x):p(x),buffer:r$11,characterSet:e,maxCanvasWidth:Vo},t&&{mapping:t.mapping,xOffset:t.xOffset,yOffsetMin:t.yOffsetMin,yOffsetMax:t.yOffsetMax}));if(f.height!==h){let x=f.height>0?d.getImageData(0,0,f.width,f.height):null;f.height=h,x&&d.putImageData(x,0,0)}if(Ko(d,o,s,n),u)for(let x of e){let S=g[x],N=S.width,{data:W,left:j=0,top:F=0}=u.draw(x),A=S.x-j,V=S.y-F,B=Math.max(0,Math.round(A)),U=Math.max(0,Math.round(V)),$=Math.min(W.width,f.width-B),Q=Math.min(W.height,f.height-U);d.putImageData(W,B,U,0,0,$,Q),S.x=B,S.y=U,S.width=$,S.height=Q,S.anchorX+=$/2-j-N/2,S.anchorY+=F}else for(let x of e){let S=g[x];d.fillText(x,S.x,S.y+S.anchorY)}let m=u?u.measure():p();return{baselineOffset:(m.ascent-m.descent)/2,xOffset:v,yOffsetMin:P,yOffsetMax:C,mapping:g,data:f,width:f.width,height:f.height}}_getKey(){let{fontFamily:e,fontWeight:t,fontSize:o,buffer:n,sdf:s,radius:r,cutoff:a}=this.props;return s?`${e} ${t} ${o} ${n} ${r} ${a}`:`${e} ${t} ${o} ${n}`}};function hr({fontSize:i,buffer:e,radius:t,cutoff:o,fontFamily:n,fontWeight:s}){let r=new He({fontSize:i,buffer:e,radius:t,cutoff:o,fontFamily:n,fontWeight:`${s}`});return a=>{let{data:l,width:c,height:f}=r.draw(a),d=new ImageData(c,f);return ur(l,d),{data:d,left:e,top:e}}}var xr=`struct TextBackgroundUniforms {
|
|
3957
|
+
billboard: f32,
|
|
3958
|
+
sizeScale: f32,
|
|
3959
|
+
sizeMinPixels: f32,
|
|
3960
|
+
sizeMaxPixels: f32,
|
|
3961
|
+
borderRadius: vec4<f32>,
|
|
3962
|
+
padding: vec4<f32>,
|
|
3963
|
+
sizeUnits: i32,
|
|
3964
|
+
stroked: f32,
|
|
3965
|
+
};
|
|
3966
|
+
|
|
3967
|
+
@group(0) @binding(auto) var<uniform> textBackground: TextBackgroundUniforms;
|
|
3968
|
+
`;var Jo=`layout(std140) uniform textBackgroundUniforms {
|
|
3969
|
+
bool billboard;
|
|
3970
|
+
float sizeScale;
|
|
3971
|
+
float sizeMinPixels;
|
|
3972
|
+
float sizeMaxPixels;
|
|
3973
|
+
vec4 borderRadius;
|
|
3974
|
+
vec4 padding;
|
|
3975
|
+
highp int sizeUnits;
|
|
3976
|
+
bool stroked;
|
|
3977
|
+
} textBackground;
|
|
3978
|
+
`;var Xo={name:`textBackground`,source:xr,vs:Jo,fs:Jo,uniformTypes:{billboard:`f32`,sizeScale:`f32`,sizeMinPixels:`f32`,sizeMaxPixels:`f32`,borderRadius:`vec4<f32>`,padding:`vec4<f32>`,sizeUnits:`i32`,stroked:`f32`}};var qo=`#version 300 es
|
|
3979
|
+
#define SHADER_NAME text-background-layer-vertex-shader
|
|
3980
|
+
in vec2 positions;
|
|
3981
|
+
in vec3 instancePositions;
|
|
3982
|
+
in vec3 instancePositions64Low;
|
|
3983
|
+
in vec4 instanceRects;
|
|
3984
|
+
in vec4 instanceClipRect;
|
|
3985
|
+
in float instanceSizes;
|
|
3986
|
+
in float instanceAngles;
|
|
3987
|
+
in vec2 instancePixelOffsets;
|
|
3988
|
+
in float instanceLineWidths;
|
|
3989
|
+
in vec4 instanceFillColors;
|
|
3990
|
+
in vec4 instanceLineColors;
|
|
3991
|
+
out vec4 vFillColor;
|
|
3992
|
+
out vec4 vLineColor;
|
|
3993
|
+
out float vLineWidth;
|
|
3994
|
+
out vec2 uv;
|
|
3995
|
+
out vec2 dimensions;
|
|
3996
|
+
vec2 rotate_by_angle(vec2 vertex, float angle) {
|
|
3997
|
+
float angle_radian = radians(angle);
|
|
3998
|
+
float cos_angle = cos(angle_radian);
|
|
3999
|
+
float sin_angle = sin(angle_radian);
|
|
4000
|
+
mat2 rotationMatrix = mat2(cos_angle, -sin_angle, sin_angle, cos_angle);
|
|
4001
|
+
return rotationMatrix * vertex;
|
|
4002
|
+
}
|
|
4003
|
+
void main(void) {
|
|
4004
|
+
geometry.worldPosition = instancePositions;
|
|
4005
|
+
geometry.uv = positions;
|
|
4006
|
+
geometry.pickingColor = picking_getPickingColorFromInstanceID();
|
|
4007
|
+
uv = positions;
|
|
4008
|
+
vLineWidth = instanceLineWidths;
|
|
4009
|
+
float sizePixels = clamp(
|
|
4010
|
+
project_size_to_pixel(instanceSizes * textBackground.sizeScale, textBackground.sizeUnits),
|
|
4011
|
+
textBackground.sizeMinPixels, textBackground.sizeMaxPixels
|
|
4012
|
+
);
|
|
4013
|
+
float instanceScale = sizePixels / text.fontSize;
|
|
4014
|
+
dimensions = instanceRects.zw * instanceScale + textBackground.padding.xy + textBackground.padding.zw;
|
|
4015
|
+
vec2 pixelOffset = (positions * instanceRects.zw + instanceRects.xy) * instanceScale + mix(-textBackground.padding.xy, textBackground.padding.zw, positions);
|
|
4016
|
+
pixelOffset = rotate_by_angle(pixelOffset, instanceAngles);
|
|
4017
|
+
pixelOffset += instancePixelOffsets;
|
|
4018
|
+
pixelOffset.y *= -1.0;
|
|
4019
|
+
vec2 xy = project_size_to_pixel(instanceClipRect.xy);
|
|
4020
|
+
vec2 wh = project_size_to_pixel(instanceClipRect.zw);
|
|
4021
|
+
if (text.flipY) {
|
|
4022
|
+
xy.y = -xy.y - wh.y;
|
|
4023
|
+
}
|
|
4024
|
+
if (instanceClipRect.z >= 0.0) {
|
|
4025
|
+
dimensions.x = wh.x;
|
|
4026
|
+
pixelOffset.x = xy.x + uv.x * wh.x + mix(-textBackground.padding.x, textBackground.padding.z, uv.x);
|
|
4027
|
+
}
|
|
4028
|
+
if (instanceClipRect.w >= 0.0) {
|
|
4029
|
+
dimensions.y = wh.y;
|
|
4030
|
+
pixelOffset.y = xy.y + uv.y * wh.y + mix(-textBackground.padding.y, textBackground.padding.w, uv.y);
|
|
4031
|
+
}
|
|
4032
|
+
if (textBackground.billboard) {
|
|
4033
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, vec3(0.0), geometry.position);
|
|
4034
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
4035
|
+
vec3 offset = vec3(pixelOffset, 0.0);
|
|
4036
|
+
DECKGL_FILTER_SIZE(offset, geometry);
|
|
4037
|
+
gl_Position.xy += project_pixel_size_to_clipspace(offset.xy);
|
|
4038
|
+
} else {
|
|
4039
|
+
vec3 offset_common = vec3(project_pixel_size(pixelOffset), 0.0);
|
|
4040
|
+
if (text.flipY) {
|
|
4041
|
+
offset_common.y *= -1.;
|
|
4042
|
+
}
|
|
4043
|
+
DECKGL_FILTER_SIZE(offset_common, geometry);
|
|
4044
|
+
gl_Position = project_position_to_clipspace(instancePositions, instancePositions64Low, offset_common, geometry.position);
|
|
4045
|
+
DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
|
|
4046
|
+
}
|
|
4047
|
+
vFillColor = vec4(instanceFillColors.rgb, instanceFillColors.a * layer.opacity);
|
|
4048
|
+
DECKGL_FILTER_COLOR(vFillColor, geometry);
|
|
4049
|
+
vLineColor = vec4(instanceLineColors.rgb, instanceLineColors.a * layer.opacity);
|
|
4050
|
+
DECKGL_FILTER_COLOR(vLineColor, geometry);
|
|
4051
|
+
}
|
|
4052
|
+
`;var Qo=`#version 300 es
|
|
4053
|
+
#define SHADER_NAME text-background-layer-fragment-shader
|
|
4054
|
+
precision highp float;
|
|
4055
|
+
in vec4 vFillColor;
|
|
4056
|
+
in vec4 vLineColor;
|
|
4057
|
+
in float vLineWidth;
|
|
4058
|
+
in vec2 uv;
|
|
4059
|
+
in vec2 dimensions;
|
|
4060
|
+
out vec4 fragColor;
|
|
4061
|
+
float round_rect(vec2 p, vec2 size, vec4 radii) {
|
|
4062
|
+
vec2 pixelPositionCB = (p - 0.5) * size;
|
|
4063
|
+
vec2 sizeCB = size * 0.5;
|
|
4064
|
+
float maxBorderRadius = min(size.x, size.y) * 0.5;
|
|
4065
|
+
vec4 borderRadius = vec4(min(radii, maxBorderRadius));
|
|
4066
|
+
borderRadius.xy =
|
|
4067
|
+
(pixelPositionCB.x > 0.0) ? borderRadius.xy : borderRadius.zw;
|
|
4068
|
+
borderRadius.x = (pixelPositionCB.y > 0.0) ? borderRadius.x : borderRadius.y;
|
|
4069
|
+
vec2 q = abs(pixelPositionCB) - sizeCB + borderRadius.x;
|
|
4070
|
+
return -(min(max(q.x, q.y), 0.0) + length(max(q, 0.0)) - borderRadius.x);
|
|
4071
|
+
}
|
|
4072
|
+
float rect(vec2 p, vec2 size) {
|
|
4073
|
+
vec2 pixelPosition = p * size;
|
|
4074
|
+
return min(min(pixelPosition.x, size.x - pixelPosition.x),
|
|
4075
|
+
min(pixelPosition.y, size.y - pixelPosition.y));
|
|
4076
|
+
}
|
|
4077
|
+
vec4 get_stroked_fragColor(float dist) {
|
|
4078
|
+
float isBorder = smoothedge(dist, vLineWidth);
|
|
4079
|
+
return mix(vFillColor, vLineColor, isBorder);
|
|
4080
|
+
}
|
|
4081
|
+
void main(void) {
|
|
4082
|
+
geometry.uv = uv;
|
|
4083
|
+
if (textBackground.borderRadius != vec4(0.0)) {
|
|
4084
|
+
float distToEdge = round_rect(uv, dimensions, textBackground.borderRadius);
|
|
4085
|
+
float shapeAlpha = smoothedge(-distToEdge, 0.0);
|
|
4086
|
+
if (shapeAlpha == 0.0) {
|
|
4087
|
+
discard;
|
|
4088
|
+
}
|
|
4089
|
+
if (textBackground.stroked) {
|
|
4090
|
+
fragColor = get_stroked_fragColor(distToEdge);
|
|
4091
|
+
} else {
|
|
4092
|
+
fragColor = vFillColor;
|
|
4093
|
+
}
|
|
4094
|
+
fragColor.a *= shapeAlpha;
|
|
4095
|
+
} else {
|
|
4096
|
+
if (textBackground.stroked) {
|
|
4097
|
+
float distToEdge = rect(uv, dimensions);
|
|
4098
|
+
fragColor = get_stroked_fragColor(distToEdge);
|
|
4099
|
+
} else {
|
|
4100
|
+
fragColor = vFillColor;
|
|
4101
|
+
}
|
|
4102
|
+
}
|
|
4103
|
+
DECKGL_FILTER_COLOR(fragColor, geometry);
|
|
4104
|
+
}
|
|
4105
|
+
`;var en=`struct TextUniforms {
|
|
4106
|
+
cutoffPixels: vec2<f32>,
|
|
4107
|
+
align: vec2<i32>,
|
|
4108
|
+
fontSize: f32,
|
|
4109
|
+
flipY: f32,
|
|
4110
|
+
};
|
|
4111
|
+
|
|
4112
|
+
@group(0) @binding(auto) var<uniform> text: TextUniforms;
|
|
4113
|
+
|
|
4114
|
+
fn rotate_by_angle(vertex: vec2<f32>, angle: f32) -> vec2<f32> {
|
|
4115
|
+
let angleRadian = radians(angle);
|
|
4116
|
+
let cosine = cos(angleRadian);
|
|
4117
|
+
let sine = sin(angleRadian);
|
|
4118
|
+
let rotationMatrix = mat2x2<f32>(
|
|
4119
|
+
vec2<f32>(cosine, -sine),
|
|
4120
|
+
vec2<f32>(sine, cosine)
|
|
4121
|
+
);
|
|
4122
|
+
return rotationMatrix * vertex;
|
|
4123
|
+
}
|
|
4124
|
+
|
|
4125
|
+
struct Attributes {
|
|
4126
|
+
@builtin(instance_index) instanceIndex: u32,
|
|
4127
|
+
@location(0) positions: vec2<f32>,
|
|
4128
|
+
@location(1) instancePositions: vec3<f32>,
|
|
4129
|
+
@location(2) instancePositions64Low: vec3<f32>,
|
|
4130
|
+
@location(3) instanceSizes: f32,
|
|
4131
|
+
@location(4) instanceAngles: f32,
|
|
4132
|
+
@location(5) instanceRects: vec4<f32>,
|
|
4133
|
+
@location(6) instanceClipRect: vec4<f32>,
|
|
4134
|
+
@location(7) instancePixelOffsets: vec2<f32>,
|
|
4135
|
+
@location(8) instanceFillColors: vec4<f32>,
|
|
4136
|
+
@location(9) instanceLineColors: vec4<f32>,
|
|
4137
|
+
@location(10) instanceLineWidths: f32,
|
|
4138
|
+
};
|
|
4139
|
+
|
|
4140
|
+
struct Varyings {
|
|
4141
|
+
@builtin(position) position: vec4<f32>,
|
|
4142
|
+
@location(0) vFillColor: vec4<f32>,
|
|
4143
|
+
@location(1) vLineColor: vec4<f32>,
|
|
4144
|
+
@location(2) vLineWidth: f32,
|
|
4145
|
+
@location(3) uv: vec2<f32>,
|
|
4146
|
+
@location(4) dimensions: vec2<f32>,
|
|
4147
|
+
@location(5) pickingColor: vec3<f32>,
|
|
4148
|
+
};
|
|
4149
|
+
|
|
4150
|
+
@vertex
|
|
4151
|
+
fn vertexMain(attributes: Attributes) -> Varyings {
|
|
4152
|
+
geometry.worldPosition = attributes.instancePositions;
|
|
4153
|
+
geometry.uv = attributes.positions;
|
|
4154
|
+
geometry.pickingColor = picking_getPickingColorFromIndex(attributes.instanceIndex);
|
|
4155
|
+
|
|
4156
|
+
var varyings: Varyings;
|
|
4157
|
+
varyings.uv = attributes.positions;
|
|
4158
|
+
varyings.vLineWidth = attributes.instanceLineWidths;
|
|
4159
|
+
|
|
4160
|
+
let sizePixels = clamp(
|
|
4161
|
+
project_unit_size_to_pixel(
|
|
4162
|
+
attributes.instanceSizes * textBackground.sizeScale,
|
|
4163
|
+
textBackground.sizeUnits
|
|
4164
|
+
),
|
|
4165
|
+
textBackground.sizeMinPixels,
|
|
4166
|
+
textBackground.sizeMaxPixels
|
|
4167
|
+
);
|
|
4168
|
+
let instanceScale = sizePixels / text.fontSize;
|
|
4169
|
+
|
|
4170
|
+
varyings.dimensions = attributes.instanceRects.zw * instanceScale +
|
|
4171
|
+
textBackground.padding.xy + textBackground.padding.zw;
|
|
4172
|
+
|
|
4173
|
+
var pixelOffset =
|
|
4174
|
+
(attributes.positions * attributes.instanceRects.zw + attributes.instanceRects.xy) *
|
|
4175
|
+
instanceScale +
|
|
4176
|
+
mix(-textBackground.padding.xy, textBackground.padding.zw, attributes.positions);
|
|
4177
|
+
pixelOffset = rotate_by_angle(pixelOffset, attributes.instanceAngles);
|
|
4178
|
+
pixelOffset = pixelOffset + attributes.instancePixelOffsets;
|
|
4179
|
+
pixelOffset.y = pixelOffset.y * -1.0;
|
|
4180
|
+
|
|
4181
|
+
var xy = project_size_vec2(attributes.instanceClipRect.xy) * project.scale;
|
|
4182
|
+
let wh = project_size_vec2(attributes.instanceClipRect.zw) * project.scale;
|
|
4183
|
+
if (text.flipY > 0.5) {
|
|
4184
|
+
xy.y = -xy.y - wh.y;
|
|
4185
|
+
}
|
|
4186
|
+
if (attributes.instanceClipRect.z >= 0.0) {
|
|
4187
|
+
varyings.dimensions.x = wh.x;
|
|
4188
|
+
pixelOffset.x = xy.x + varyings.uv.x * wh.x + mix(
|
|
4189
|
+
-textBackground.padding.x,
|
|
4190
|
+
textBackground.padding.z,
|
|
4191
|
+
varyings.uv.x
|
|
4192
|
+
);
|
|
4193
|
+
}
|
|
4194
|
+
if (attributes.instanceClipRect.w >= 0.0) {
|
|
4195
|
+
varyings.dimensions.y = wh.y;
|
|
4196
|
+
pixelOffset.y = xy.y + varyings.uv.y * wh.y + mix(
|
|
4197
|
+
-textBackground.padding.y,
|
|
4198
|
+
textBackground.padding.w,
|
|
4199
|
+
varyings.uv.y
|
|
4200
|
+
);
|
|
4201
|
+
}
|
|
4202
|
+
|
|
4203
|
+
if (textBackground.billboard > 0.5) {
|
|
4204
|
+
var position = project_position_to_clipspace(
|
|
4205
|
+
attributes.instancePositions,
|
|
4206
|
+
attributes.instancePositions64Low,
|
|
4207
|
+
vec3<f32>(0.0)
|
|
4208
|
+
);
|
|
4209
|
+
let clipOffset = project_pixel_size_to_clipspace(pixelOffset);
|
|
4210
|
+
position = vec4<f32>(
|
|
4211
|
+
position.x + clipOffset.x,
|
|
4212
|
+
position.y + clipOffset.y,
|
|
4213
|
+
position.z,
|
|
4214
|
+
position.w
|
|
4215
|
+
);
|
|
4216
|
+
varyings.position = position;
|
|
4217
|
+
} else {
|
|
4218
|
+
var offsetCommon = vec3<f32>(project_pixel_size_vec2(pixelOffset), 0.0);
|
|
4219
|
+
if (text.flipY > 0.5) {
|
|
4220
|
+
offsetCommon.y = offsetCommon.y * -1.0;
|
|
4221
|
+
}
|
|
4222
|
+
varyings.position = project_position_to_clipspace(
|
|
4223
|
+
attributes.instancePositions,
|
|
4224
|
+
attributes.instancePositions64Low,
|
|
4225
|
+
offsetCommon
|
|
4226
|
+
);
|
|
4227
|
+
}
|
|
4228
|
+
|
|
4229
|
+
varyings.vFillColor = vec4<f32>(
|
|
4230
|
+
attributes.instanceFillColors.rgb,
|
|
4231
|
+
attributes.instanceFillColors.a * layer.opacity
|
|
4232
|
+
);
|
|
4233
|
+
varyings.vLineColor = vec4<f32>(
|
|
4234
|
+
attributes.instanceLineColors.rgb,
|
|
4235
|
+
attributes.instanceLineColors.a * layer.opacity
|
|
4236
|
+
);
|
|
4237
|
+
varyings.pickingColor = geometry.pickingColor;
|
|
4238
|
+
return varyings;
|
|
4239
|
+
}
|
|
4240
|
+
|
|
4241
|
+
fn round_rect(point: vec2<f32>, size: vec2<f32>, radii: vec4<f32>) -> f32 {
|
|
4242
|
+
let pixelPosition = (point - 0.5) * size;
|
|
4243
|
+
let halfSize = size * 0.5;
|
|
4244
|
+
let maxBorderRadius = min(size.x, size.y) * 0.5;
|
|
4245
|
+
var borderRadius = min(radii, vec4<f32>(maxBorderRadius));
|
|
4246
|
+
|
|
4247
|
+
borderRadius = select(borderRadius.zwxy, borderRadius, pixelPosition.x > 0.0);
|
|
4248
|
+
let radius = select(borderRadius.y, borderRadius.x, pixelPosition.y > 0.0);
|
|
4249
|
+
let q = abs(pixelPosition) - halfSize + radius;
|
|
4250
|
+
return -(min(max(q.x, q.y), 0.0) + length(max(q, vec2<f32>(0.0))) - radius);
|
|
4251
|
+
}
|
|
4252
|
+
|
|
4253
|
+
fn rect(point: vec2<f32>, size: vec2<f32>) -> f32 {
|
|
4254
|
+
let pixelPosition = point * size;
|
|
4255
|
+
return min(
|
|
4256
|
+
min(pixelPosition.x, size.x - pixelPosition.x),
|
|
4257
|
+
min(pixelPosition.y, size.y - pixelPosition.y)
|
|
4258
|
+
);
|
|
4259
|
+
}
|
|
4260
|
+
|
|
4261
|
+
fn get_stroked_frag_color(
|
|
4262
|
+
distanceToEdge: f32,
|
|
4263
|
+
lineWidth: f32,
|
|
4264
|
+
fillColor: vec4<f32>,
|
|
4265
|
+
lineColor: vec4<f32>
|
|
4266
|
+
) -> vec4<f32> {
|
|
4267
|
+
let isBorder = smoothedge(distanceToEdge, lineWidth);
|
|
4268
|
+
return mix(fillColor, lineColor, isBorder);
|
|
4269
|
+
}
|
|
4270
|
+
|
|
4271
|
+
@fragment
|
|
4272
|
+
fn fragmentMain(varyings: Varyings) -> @location(0) vec4<f32> {
|
|
4273
|
+
geometry.uv = varyings.uv;
|
|
4274
|
+
var fragColor: vec4<f32>;
|
|
4275
|
+
|
|
4276
|
+
if (any(textBackground.borderRadius != vec4<f32>(0.0))) {
|
|
4277
|
+
let distanceToEdge = round_rect(
|
|
4278
|
+
varyings.uv,
|
|
4279
|
+
varyings.dimensions,
|
|
4280
|
+
textBackground.borderRadius
|
|
4281
|
+
);
|
|
4282
|
+
let shapeAlpha = smoothedge(-distanceToEdge, 0.0);
|
|
4283
|
+
if (shapeAlpha == 0.0) {
|
|
4284
|
+
discard;
|
|
4285
|
+
}
|
|
4286
|
+
if (textBackground.stroked > 0.5) {
|
|
4287
|
+
fragColor = get_stroked_frag_color(
|
|
4288
|
+
distanceToEdge,
|
|
4289
|
+
varyings.vLineWidth,
|
|
4290
|
+
varyings.vFillColor,
|
|
4291
|
+
varyings.vLineColor
|
|
4292
|
+
);
|
|
4293
|
+
} else {
|
|
4294
|
+
fragColor = varyings.vFillColor;
|
|
4295
|
+
}
|
|
4296
|
+
fragColor.a = fragColor.a * shapeAlpha;
|
|
4297
|
+
} else if (textBackground.stroked > 0.5) {
|
|
4298
|
+
let distanceToEdge = rect(varyings.uv, varyings.dimensions);
|
|
4299
|
+
fragColor = get_stroked_frag_color(
|
|
4300
|
+
distanceToEdge,
|
|
4301
|
+
varyings.vLineWidth,
|
|
4302
|
+
varyings.vFillColor,
|
|
4303
|
+
varyings.vLineColor
|
|
4304
|
+
);
|
|
4305
|
+
} else {
|
|
4306
|
+
fragColor = varyings.vFillColor;
|
|
4307
|
+
}
|
|
4308
|
+
|
|
4309
|
+
if (picking.isActive > 0.5) {
|
|
4310
|
+
if (!picking_isColorValid(varyings.pickingColor)) {
|
|
4311
|
+
discard;
|
|
4312
|
+
}
|
|
4313
|
+
return vec4<f32>(varyings.pickingColor, 1.0);
|
|
4314
|
+
}
|
|
4315
|
+
|
|
4316
|
+
if (picking.isHighlightActive > 0.5) {
|
|
4317
|
+
let highlightedObjectColor = picking_normalizeColor(picking.highlightedObjectColor);
|
|
4318
|
+
if (picking_isColorZero(abs(varyings.pickingColor - highlightedObjectColor))) {
|
|
4319
|
+
let highlightAlpha = picking.highlightColor.a;
|
|
4320
|
+
let blendedAlpha = highlightAlpha + fragColor.a * (1.0 - highlightAlpha);
|
|
4321
|
+
if (blendedAlpha > 0.0) {
|
|
4322
|
+
let highlightRatio = highlightAlpha / blendedAlpha;
|
|
4323
|
+
fragColor = vec4<f32>(
|
|
4324
|
+
mix(fragColor.rgb, picking.highlightColor.rgb, highlightRatio),
|
|
4325
|
+
blendedAlpha
|
|
4326
|
+
);
|
|
4327
|
+
} else {
|
|
4328
|
+
fragColor = vec4<f32>(fragColor.rgb, 0.0);
|
|
4329
|
+
}
|
|
4330
|
+
}
|
|
4331
|
+
}
|
|
4332
|
+
|
|
4333
|
+
return deckgl_premultiplied_alpha(fragColor);
|
|
4334
|
+
}
|
|
4335
|
+
`;var vr={billboard:!0,sizeScale:1,sizeUnits:`pixels`,sizeMinPixels:0,sizeMaxPixels:Number.MAX_SAFE_INTEGER,fontSize:1,borderRadius:{type:`object`,value:0},padding:{type:`array`,value:[0,0,0,0]},getPosition:{type:`accessor`,value:i=>i.position},getSize:{type:`accessor`,value:1},getAngle:{type:`accessor`,value:0},getPixelOffset:{type:`accessor`,value:[0,0]},getBoundingRect:{type:`accessor`,value:[0,0,0,0]},getClipRect:{type:`accessor`,value:[0,0,-1,-1]},getFillColor:{type:`accessor`,value:[0,0,0,255]},getLineColor:{type:`accessor`,value:[0,0,0,255]},getLineWidth:{type:`accessor`,value:1}};var Ke=class extends ao{getShaders(){return super.getShaders({vs:qo,fs:Qo,source:en,modules:[Wa,ma,Ka,Xo,mt]})}initializeState(){this.getAttributeManager().addInstanced({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceSizes:{size:1,transition:!0,bufferGroup:`text-background-instance-data`,accessor:`getSize`,defaultValue:1},instanceAngles:{size:1,transition:!0,bufferGroup:`text-background-instance-data`,accessor:`getAngle`},instanceRects:{size:4,bufferGroup:`text-background-instance-data`,accessor:`getBoundingRect`},instanceClipRect:{size:4,bufferGroup:`text-background-instance-data`,accessor:`getClipRect`,defaultValue:[0,0,-1,-1]},instancePixelOffsets:{size:2,transition:!0,bufferGroup:`text-background-instance-data`,accessor:`getPixelOffset`},instanceFillColors:{size:4,transition:!0,type:`unorm8`,accessor:`getFillColor`,defaultValue:[0,0,0,255]},instanceLineColors:{size:4,transition:!0,type:`unorm8`,accessor:`getLineColor`,defaultValue:[0,0,0,255]},instanceLineWidths:{size:1,transition:!0,bufferGroup:`text-background-instance-data`,accessor:`getLineWidth`,defaultValue:1}})}updateState(e){super.updateState(e);let{changeFlags:t}=e;t.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{billboard:t,sizeScale:o,sizeUnits:n,sizeMinPixels:s,sizeMaxPixels:r,getLineWidth:a,fontSize:l}=this.props,{padding:c,borderRadius:f}=this.props;c.length<4&&(c=[c[0],c[1],c[0],c[1]]),Array.isArray(f)||(f=[f,f,f,f]);let d=this.state.model,p={billboard:t,stroked:!!a,borderRadius:f,padding:c,sizeUnits:ee[n],sizeScale:o,sizeMinPixels:s,sizeMaxPixels:r},u={fontSize:l,viewport:this.context.viewport};d.shaderInputs.setProps({textBackground:p,text:u}),d.draw(this.context.renderPass)}_getModel(){return new De(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new re$1({topology:`triangle-strip`,vertexCount:4,attributes:{positions:{size:2,value:new Float32Array([0,0,1,0,0,1,1,1])}}}),isInstanced:!0}))}};Ke.defaultProps=vr;Ke.layerName=`TextBackgroundLayer`;var jt=Ke;var tn={start:1,middle:0,end:-1};var on={top:1,center:0,bottom:-1};var Bt=[0,0,0,255];var yr={billboard:!0,sizeScale:1,sizeUnits:`pixels`,sizeMinPixels:0,sizeMaxPixels:Number.MAX_SAFE_INTEGER,background:!1,getBackgroundColor:{type:`accessor`,value:[255,255,255,255]},getBorderColor:{type:`accessor`,value:Bt},getBorderWidth:{type:`accessor`,value:0},backgroundBorderRadius:{type:`object`,value:0},backgroundPadding:{type:`array`,value:[0,0,0,0]},characterSet:{type:`object`,value:q.characterSet},fontFamily:q.fontFamily,fontWeight:q.fontWeight,lineHeight:1,outlineWidth:{type:`number`,value:0,min:0},outlineColor:{type:`color`,value:Bt},fontSettings:{type:`object`,value:{},compare:1},wordBreak:`break-word`,maxWidth:{type:`number`,value:-1},contentCutoffPixels:{type:`array`,value:[0,0]},contentAlignHorizontal:`none`,contentAlignVertical:`none`,getText:{type:`accessor`,value:i=>i.text},getPosition:{type:`accessor`,value:i=>i.position},getColor:{type:`accessor`,value:Bt},getSize:{type:`accessor`,value:32},getAngle:{type:`accessor`,value:0},getTextAnchor:{type:`accessor`,value:`middle`},getAlignmentBaseline:{type:`accessor`,value:`center`},getPixelOffset:{type:`accessor`,value:[0,0]},getContentBox:{type:`accessor`,value:[0,0,-1,-1]},backgroundColor:{deprecatedFor:[`background`,`getBackgroundColor`]}};var $e=class extends _m{constructor(){super(...arguments),this.getBoundingRect=(e,t)=>{let{size:[o,n]}=this.transformParagraph(e,t),{getTextAnchor:s,getAlignmentBaseline:r}=this.props,a=tn[typeof s==`function`?s(e,t):s],l=on[typeof r==`function`?r(e,t):r];return[(a-1)*o/2,(l-1)*n/2,o,n]},this.getIconOffsets=(e,t)=>{let{getTextAnchor:o,getAlignmentBaseline:n}=this.props,{x:s,y:r,rowWidth:a,size:[,l]}=this.transformParagraph(e,t),c=tn[typeof o==`function`?o(e,t):o],f=on[typeof n==`function`?n(e,t):n],d=s.length,p=new Array(d*2),u=0;for(let g=0;g<d;g++)p[u++]=(c-1)*a[g]/2+s[g],p[u++]=(f-1)*l/2+r[g];return p}}initializeState(){this.state={styleVersion:0,fontAtlasManager:new Ze},this.props.maxWidth>0&&S.once(1,`v8.9 breaking change: TextLayer maxWidth is now relative to text size`)()}updateState(e){let{props:t,oldProps:o,changeFlags:n}=e;(n.dataChanged||n.updateTriggersChanged&&(n.updateTriggersChanged.all||n.updateTriggersChanged.getText))&&this._updateText(),(this._updateFontAtlas()||t.lineHeight!==o.lineHeight||t.wordBreak!==o.wordBreak||t.maxWidth!==o.maxWidth)&&this.setState({styleVersion:this.state.styleVersion+1})}getPickingInfo({info:e}){return e.object=e.index>=0?this.props.data[e.index]:null,e}_updateFontAtlas(){let{fontSettings:e,fontFamily:t,fontWeight:o,_getFontRenderer:n}=this.props,{fontAtlasManager:s$10,characterSet:r$12}=this.state,a=s(r({},e),{characterSet:r$12,fontFamily:t,fontWeight:o,_getFontRenderer:n});if(!s$10.mapping)return s$10.setProps(a),!0;for(let l in a)if(a[l]!==s$10.props[l])return s$10.setProps(a),!0;return!1}_updateText(){let{data:e,characterSet:t}=this.props,o=e.attributes?.getText,{getText:n}=this.props,s$11=e.startIndices,r$13,a=t===`auto`&&new Set;if(o&&s$11){let{texts:l,characterCount:c}=Uo(s(r({},ArrayBuffer.isView(o)?{value:o}:o),{length:e.length,startIndices:s$11,characterSet:a}));r$13=c,n=(f,{index:d})=>l[d]}else{let{iterable:l,objectInfo:c}=Yr(e);s$11=[0],r$13=0;for(let f of l){c.index++;let d=Array.from(n(f,c)||``);a&&d.forEach(a.add,a),r$13+=d.length,s$11.push(r$13)}}this.setState({getText:n,startIndices:s$11,numInstances:r$13,characterSet:a||t})}transformParagraph(e,t){let{fontAtlasManager:o}=this.state,n=o.mapping,{baselineOffset:s}=o.atlas,{fontSize:r}=o.props,a=this.state.getText,{wordBreak:l,lineHeight:c,maxWidth:f}=this.props;return Wo(a(e,t)||``,s,c*r,l,f*r,n)}renderLayers(){let{startIndices:e,numInstances:t,getText:o,fontAtlasManager:{atlas:n,mapping:s},styleVersion:r}=this.state,{data:a,_dataDiff:l,getPosition:c,getColor:f,getSize:d,getAngle:p,getPixelOffset:u,getBackgroundColor:g,getBorderColor:h,getBorderWidth:v,getContentBox:P,backgroundBorderRadius:C,backgroundPadding:m,background:x,billboard:S,fontSettings:N,outlineWidth:W,outlineColor:j,sizeScale:F,sizeUnits:A,sizeMinPixels:V,sizeMaxPixels:B,contentCutoffPixels:U,contentAlignHorizontal:$,contentAlignVertical:Q,transitions:D,updateTriggers:I}=this.props,St=this.getSubLayerClass(`characters`,Nt),cn=this.getSubLayerClass(`background`,jt),{fontSize:Vt}=this.state.fontAtlasManager.props;return[x&&new cn({getFillColor:g,getLineColor:h,getLineWidth:v,borderRadius:C,padding:m,getPosition:c,getSize:d,getAngle:p,getPixelOffset:u,getClipRect:P,billboard:S,sizeScale:F,sizeUnits:A,sizeMinPixels:V,sizeMaxPixels:B,fontSize:Vt,transitions:D&&{getPosition:D.getPosition,getAngle:D.getAngle,getSize:D.getSize,getFillColor:D.getBackgroundColor,getLineColor:D.getBorderColor,getLineWidth:D.getBorderWidth,getPixelOffset:D.getPixelOffset}},this.getSubLayerProps({id:`background`,updateTriggers:{getPosition:I.getPosition,getAngle:I.getAngle,getSize:I.getSize,getFillColor:I.getBackgroundColor,getLineColor:I.getBorderColor,getLineWidth:I.getBorderWidth,getPixelOffset:I.getPixelOffset,getBoundingRect:{getText:I.getText,getTextAnchor:I.getTextAnchor,getAlignmentBaseline:I.getAlignmentBaseline,styleVersion:r}}}),{data:a.attributes&&a.attributes.background?{length:a.length,attributes:a.attributes.background}:a,_dataDiff:l,autoHighlight:!1,getBoundingRect:this.getBoundingRect}),new St({sdf:N.sdf,smoothing:Number.isFinite(N.smoothing)?N.smoothing:q.smoothing,outlineWidth:W/(N.radius||q.radius),outlineColor:j,iconAtlas:n,iconMapping:s,getPosition:c,getColor:f,getSize:d,getAngle:p,getPixelOffset:u,getContentBox:P,billboard:S,sizeScale:F,sizeUnits:A,sizeMinPixels:V,sizeMaxPixels:B,fontSize:Vt,contentCutoffPixels:U,contentAlignHorizontal:$,contentAlignVertical:Q,transitions:D&&{getPosition:D.getPosition,getAngle:D.getAngle,getColor:D.getColor,getSize:D.getSize,getPixelOffset:D.getPixelOffset,getContentBox:D.getContentBox}},this.getSubLayerProps({id:`characters`,updateTriggers:{all:I.getText,getPosition:I.getPosition,getAngle:I.getAngle,getColor:I.getColor,getSize:I.getSize,getPixelOffset:I.getPixelOffset,getContentBox:I.getContentBox,getIconOffsets:{getTextAnchor:I.getTextAnchor,getAlignmentBaseline:I.getAlignmentBaseline,styleVersion:r}}}),{data:a,_dataDiff:l,startIndices:e,numInstances:t,getIconOffsets:this.getIconOffsets,getIcon:o})]}static set fontAtlasCacheLimit(e){Yo(e)}};$e.defaultProps=yr;$e.layerName=`TextLayer`;var Wt=$e;var Ye={circle:{type:wt,props:{filled:`filled`,stroked:`stroked`,lineWidthMaxPixels:`lineWidthMaxPixels`,lineWidthMinPixels:`lineWidthMinPixels`,lineWidthScale:`lineWidthScale`,lineWidthUnits:`lineWidthUnits`,pointRadiusMaxPixels:`radiusMaxPixels`,pointRadiusMinPixels:`radiusMinPixels`,pointRadiusScale:`radiusScale`,pointRadiusUnits:`radiusUnits`,pointAntialiasing:`antialiasing`,pointBillboard:`billboard`,getFillColor:`getFillColor`,getLineColor:`getLineColor`,getLineWidth:`getLineWidth`,getPointRadius:`getRadius`}},icon:{type:ge,props:{iconAtlas:`iconAtlas`,iconMapping:`iconMapping`,iconSizeMaxPixels:`sizeMaxPixels`,iconSizeMinPixels:`sizeMinPixels`,iconSizeScale:`sizeScale`,iconSizeUnits:`sizeUnits`,iconAlphaCutoff:`alphaCutoff`,iconBillboard:`billboard`,getIcon:`getIcon`,getIconAngle:`getAngle`,getIconColor:`getColor`,getIconPixelOffset:`getPixelOffset`,getIconSize:`getSize`}},text:{type:Wt,props:{textSizeMaxPixels:`sizeMaxPixels`,textSizeMinPixels:`sizeMinPixels`,textSizeScale:`sizeScale`,textSizeUnits:`sizeUnits`,textBackground:`background`,textBackgroundPadding:`backgroundPadding`,textFontFamily:`fontFamily`,textFontWeight:`fontWeight`,textLineHeight:`lineHeight`,textMaxWidth:`maxWidth`,textOutlineColor:`outlineColor`,textOutlineWidth:`outlineWidth`,textWordBreak:`wordBreak`,textCharacterSet:`characterSet`,textBillboard:`billboard`,textFontSettings:`fontSettings`,getText:`getText`,getTextAngle:`getAngle`,getTextColor:`getColor`,getTextPixelOffset:`getPixelOffset`,getTextSize:`getSize`,getTextAnchor:`getTextAnchor`,getTextAlignmentBaseline:`getAlignmentBaseline`,getTextBackgroundColor:`getBackgroundColor`,getTextBorderColor:`getBorderColor`,getTextBorderWidth:`getBorderWidth`}}};var Je={type:ze,props:{lineWidthUnits:`widthUnits`,lineWidthScale:`widthScale`,lineWidthMinPixels:`widthMinPixels`,lineWidthMaxPixels:`widthMaxPixels`,lineJointRounded:`jointRounded`,lineCapRounded:`capRounded`,lineMiterLimit:`miterLimit`,lineBillboard:`billboard`,lineAntialiasing:`antialiasing`,getLineColor:`getColor`,getLineWidth:`getWidth`}};var Pt={type:Be,props:{extruded:`extruded`,filled:`filled`,wireframe:`wireframe`,elevationScale:`elevationScale`,material:`material`,_full3d:`_full3d`,getElevation:`getElevation`,getFillColor:`getFillColor`,getLineColor:`getLineColor`}};function le({type:i,props:e}){let t={};for(let o in e)t[o]=i.defaultProps[e[o]];return t}function _t(i,e){let{transitions:t,updateTriggers:o}=i.props,n={updateTriggers:{},transitions:t&&{getPosition:t.geometry}};for(let s in e){let r=e[s],a=i.props[s];s.startsWith(`get`)&&(a=i.getSubLayerAccessor(a),n.updateTriggers[r]=o[s],t&&(n.transitions[r]=t[s])),n[r]=a}return n}function sn(i){if(Array.isArray(i))return i;switch(S.assert(i.type,`GeoJSON does not have type`),i.type){case`Feature`:return[i];case`FeatureCollection`:return S.assert(Array.isArray(i.features),`GeoJSON does not have features array`),i.features;default:return[{geometry:i}]}}function Ut(i,e,t={}){let o={pointFeatures:[],lineFeatures:[],polygonFeatures:[],polygonOutlineFeatures:[]},{startRow:n=0,endRow:s=i.length}=t;for(let r=n;r<s;r++){let a=i[r],{geometry:l}=a;if(l)if(l.type===`GeometryCollection`){S.assert(Array.isArray(l.geometries),`GeoJSON does not have geometries array`);let{geometries:c}=l;for(let f=0;f<c.length;f++){let d=c[f];nn(d,o,e,a,r)}}else nn(l,o,e,a,r)}return o}function nn(i,e,t,o,n){let{type:s,coordinates:r}=i,{pointFeatures:a,lineFeatures:l,polygonFeatures:c,polygonOutlineFeatures:f}=e;if(!_r(s,r)){S.warn(`${s} coordinates are malformed`)();return}switch(s){case`Point`:a.push(t({geometry:i},o,n));break;case`MultiPoint`:r.forEach(d=>{a.push(t({geometry:{type:`Point`,coordinates:d}},o,n))});break;case`LineString`:l.push(t({geometry:i},o,n));break;case`MultiLineString`:r.forEach(d=>{l.push(t({geometry:{type:`LineString`,coordinates:d}},o,n))});break;case`Polygon`:c.push(t({geometry:i},o,n)),r.forEach(d=>{f.push(t({geometry:{type:`LineString`,coordinates:d}},o,n))});break;case`MultiPolygon`:r.forEach(d=>{c.push(t({geometry:{type:`Polygon`,coordinates:d}},o,n)),d.forEach(p=>{f.push(t({geometry:{type:`LineString`,coordinates:p}},o,n))})})}}var Pr={Point:1,MultiPoint:2,LineString:2,MultiLineString:3,Polygon:3,MultiPolygon:4};function _r(i,e){let t=Pr[i];for(S.assert(t,`Unknown GeoJSON type ${i}`);e&&--t>0;)e=e[0];return e&&Number.isFinite(e[0])}function rn(){return{points:{},lines:{},polygons:{},polygonsOutline:{}}}function Ct(i){return i.geometry.coordinates}function an(i,e){let t=rn(),{pointFeatures:o,lineFeatures:n,polygonFeatures:s,polygonOutlineFeatures:r}=i;return t.points.data=o,t.points._dataDiff=e.pointFeatures&&(()=>e.pointFeatures),t.points.getPosition=Ct,t.lines.data=n,t.lines._dataDiff=e.lineFeatures&&(()=>e.lineFeatures),t.lines.getPath=Ct,t.polygons.data=s,t.polygons._dataDiff=e.polygonFeatures&&(()=>e.polygonFeatures),t.polygons.getPolygon=Ct,t.polygonsOutline.data=r,t.polygonsOutline._dataDiff=e.polygonOutlineFeatures&&(()=>e.polygonOutlineFeatures),t.polygonsOutline.getPath=Ct,t}function ln(i){let e=rn(),{points:t,lines:o,polygons:n}=i,s$12=Oo(i);e.points.data={length:t.positions.value.length/t.positions.size,attributes:s(r({},t.attributes),{getPosition:t.positions,rowIndexes:{size:1,type:`uint32`,value:s$12.points}}),properties:t.properties,numericProps:t.numericProps,featureIds:t.featureIds},e.lines.data={length:o.pathIndices.value.length-1,startIndices:o.pathIndices.value,attributes:s(r({},o.attributes),{getPath:o.positions,rowIndexes:{size:1,type:`uint32`,value:s$12.lines}}),properties:o.properties,numericProps:o.numericProps,featureIds:o.featureIds},e.lines._pathType=`open`;let r$14=n.positions.value.length/n.positions.size,a=Array(r$14).fill(1);for(let l of n.primitivePolygonIndices.value)a[l-1]=0;return e.polygons.data={length:n.polygonIndices.value.length-1,startIndices:n.polygonIndices.value,attributes:s(r({},n.attributes),{getPolygon:n.positions,instanceVertexValid:{size:1,value:new Uint16Array(a)},rowIndexes:{size:1,type:`uint32`,value:s$12.polygons}}),properties:n.properties,numericProps:n.numericProps,featureIds:n.featureIds},e.polygons._normalize=!1,n.triangles&&(e.polygons.data.attributes.indices=n.triangles.value),e.polygonsOutline.data={length:n.primitivePolygonIndices.value.length-1,startIndices:n.primitivePolygonIndices.value,attributes:s(r({},n.attributes),{getPath:n.positions,rowIndexes:{size:1,type:`uint32`,value:s$12.polygons}}),properties:n.properties,numericProps:n.numericProps,featureIds:n.featureIds},e.polygonsOutline._pathType=`open`,e}var Cr=[`points`,`linestrings`,`polygons`];var Sr=s(r(r(r(r(r({},le(Ye.circle)),le(Ye.icon)),le(Ye.text)),le(Je)),le(Pt)),{stroked:!0,filled:!0,extruded:!1,wireframe:!1,_full3d:!1,iconAtlas:{type:`object`,value:null},iconMapping:{type:`object`,value:{}},getIcon:{type:`accessor`,value:i=>i.properties.icon},getText:{type:`accessor`,value:i=>i.properties.text},pointType:`circle`,getRadius:{deprecatedFor:`getPointRadius`}});var Xe=class extends _m{initializeState(){this.state={layerProps:{},features:{},featuresDiff:{}}}updateState({props:e,changeFlags:t}){if(!t.dataChanged)return;let{data:o}=this.props,n=o&&`points`in o&&`polygons`in o&&`lines`in o;this.setState({binary:n}),n?this._updateStateBinary({props:e,changeFlags:t}):this._updateStateJSON({props:e,changeFlags:t})}_updateStateBinary({props:e,changeFlags:t}){let o=ln(e.data);this.setState({layerProps:o})}_updateStateJSON({props:e,changeFlags:t}){let o=sn(e.data),n=this.getSubLayerRow.bind(this),s={},r={};if(Array.isArray(t.dataChanged)){let l=this.state.features;for(let c in l)s[c]=l[c].slice(),r[c]=[];for(let c of t.dataChanged){let f=Ut(o,n,c);for(let d in l)r[d].push(vt({data:s[d],getIndex:p=>p.__source.index,dataRange:c,replace:f[d]}))}}else s=Ut(o,n);let a=an(s,r);this.setState({features:s,featuresDiff:r,layerProps:a})}getPickingInfo(e){let t=super.getPickingInfo(e),{index:o,sourceLayer:n}=t;return t.featureType=Cr.find(s=>n.id.startsWith(`${this.id}-${s}-`)),o>=0&&n.id.startsWith(`${this.id}-points-text`)&&this.state.binary&&(t.index=this.props.data.points.globalFeatureIds.value[o]),t}_updateAutoHighlight(e){let t=`${this.id}-points-`,o=e.featureType===`points`;for(let n of this.getSubLayers())n.id.startsWith(t)===o&&n.updateAutoHighlight(e)}_renderPolygonLayer(){let{extruded:e,wireframe:t}=this.props,{layerProps:o}=this.state,n=`polygons-fill`,s=this.shouldRenderSubLayer(n,o.polygons?.data)&&this.getSubLayerClass(n,Pt.type);if(s){let r=_t(this,Pt.props),a=e&&t;return a||delete r.getLineColor,r.updateTriggers.lineColors=a,new s(r,this.getSubLayerProps({id:n,updateTriggers:r.updateTriggers}),o.polygons)}return null}_renderLineLayers(){let{extruded:e,stroked:t}=this.props,{layerProps:o}=this.state,n=`polygons-stroke`,s=`linestrings`,r=!e&&t&&this.shouldRenderSubLayer(n,o.polygonsOutline?.data)&&this.getSubLayerClass(n,Je.type),a=this.shouldRenderSubLayer(s,o.lines?.data)&&this.getSubLayerClass(s,Je.type);if(r||a){let l=_t(this,Je.props);return[r&&new r(l,this.getSubLayerProps({id:n,updateTriggers:l.updateTriggers}),o.polygonsOutline),a&&new a(l,this.getSubLayerProps({id:s,updateTriggers:l.updateTriggers}),o.lines)]}return null}_renderPointLayers(){let{pointType:e}=this.props,{layerProps:t,binary:o}=this.state,{highlightedObjectIndex:n}=this.props;!o&&Number.isFinite(n)&&(n=t.points.data.findIndex(l=>l.__source.index===n));let s$13=new Set(e.split(`+`)),r$15=[];for(let l of s$13){let c=`points-${l}`,f=Ye[l],d=f&&this.shouldRenderSubLayer(c,t.points?.data)&&this.getSubLayerClass(c,f.type);if(d){let p=_t(this,f.props),u$1=t.points;if(l===`text`&&o){let a=u$1.data.attributes,{rowIndexes:g}=a,h=u(a,[`rowIndexes`]);u$1=s(r({},u$1),{data:s(r({},u$1.data),{attributes:h})})}r$15.push(new d(p,this.getSubLayerProps({id:c,updateTriggers:p.updateTriggers,highlightedObjectIndex:n}),u$1))}}return r$15}renderLayers(){let{extruded:e}=this.props,t=this._renderPolygonLayer(),o=this._renderLineLayers(),n=this._renderPointLayers();return[!e&&t,o,n,e&&t]}getSubLayerAccessor(e){let{binary:t}=this.state;return!t||typeof e!=`function`?super.getSubLayerAccessor(e):(o,n)=>{let{data:s,index:r}=n;return e(To(s,r),n)}}};Xe.layerName=`GeoJsonLayer`;Xe.defaultProps=Sr;var Lr=Xe;export{ze as _,Gn as a,Tt as c,er as d,ge as f,ye as g,wt as h,Dn as i,Wt as l,jt as m,Cn as n,Lr as o,gn as p,Cs as r,Nt as s,Be as t,Zn as u};
|
|
4336
|
+
//# debugId=7fec4dc7-70a9-597d-a1ca-61760d4e356b
|