@mapvx/web-components-ssr 1.6.1-dev.1 → 1.7.0-dev.1
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 +6 -4
- package/dist/browser/chunk-7vIcv6rM.js +1180 -0
- package/dist/browser/chunk-BK2bFfek.js +6148 -0
- package/dist/browser/chunk-Bjk3HkK2.js +2 -1
- package/dist/browser/chunk-C8XJWaI5.js +2 -0
- package/dist/browser/chunk-CCaUxYwr.js +2 -1
- package/dist/browser/chunk-CTFjnL_B.js +2 -1
- package/dist/browser/chunk-Cg9Nd_Mm.js +4336 -0
- package/dist/browser/chunk-ClYPPgpq.js +3 -0
- package/dist/browser/chunk-ConEJto8.js +1318 -0
- package/dist/browser/chunk-CuTcljJ2.js +2 -0
- package/dist/browser/chunk-CzASft0S.js +13 -0
- package/dist/browser/chunk-DAjekpI-.js +3 -0
- package/dist/browser/chunk-DHX-WiFW.js +3 -0
- package/dist/browser/chunk-DsKCGfdq.js +3 -1
- package/dist/browser/chunk-LltjhLJU.js +2 -1
- package/dist/browser/chunk-qJiyNNGo.js +348 -0
- package/dist/browser/main.js +551 -532
- package/dist/browser/styles.css +1 -1
- package/package.json +37 -30
- package/dist/browser/chunk-CP_etSVX.js +0 -4343
- 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-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{A as Zo$1,J as ne$1,Z as pt$1,l as Ko$1,p as Ni$1,t as De$1,w as Wr}from"./chunk-BK2bFfek.js";import{A as en$1,G as st$1,L as oe$1,M as ge$1,O as ee,P as ma,T as an,U as se,a as Dm,n as A,r as Ar,u as Ka,v as Wa}from"./chunk-ConEJto8.js";var Xi=v((mc,_t)=>{"use strict";_t.exports=Ze;_t.exports.default=Ze;function Ze(t,o,e){e=e||2;var i=o&&o.length,n=i?o[0]*e:t.length,s=$i(t,0,n,e,!0),r=[];if(!s||s.next===s.prev)return r;var a,l,c,f,d,u,p;if(i&&(s=Is(t,o,s,e)),t.length>80*e){a=c=t[0],l=f=t[1];for(var g=e;g<n;g+=e)d=t[g],u=t[g+1],d<a&&(a=d),u<l&&(l=u),d>c&&(c=d),u>f&&(f=u);p=Math.max(c-a,f-l),p=p!==0?32767/p:0}return Ce(s,r,e,a,l,p,0),r}function $i(t,o,e,i,n){var s,r;if(n===Pt(t,o,e,i)>0)for(s=o;s<e;s+=i)r=Ki(s,t[s],t[s+1],r);else for(s=e-i;s>=o;s-=i)r=Ki(s,t[s],t[s+1],r);return r&&Ke(r,r.next)&&(Se(r),r=r.next),r}function X(t,o){if(!t)return t;o||(o=t);var e=t,i;do if(i=!1,!e.steiner&&(Ke(e,e.next)||w(e.prev,e,e.next)===0)){if(Se(e),e=o=e.prev,e===e.next)break;i=!0}else e=e.next;while(i||e!==o);return o}function Ce(t,o,e,i,n,s,r){if(t){!r&&s&&Rs(t,i,n,s);for(var a=t,l,c;t.prev!==t.next;){if(l=t.prev,c=t.next,s?Ss(t,i,n,s):Ls(t)){o.push(l.i/e|0),o.push(t.i/e|0),o.push(c.i/e|0),Se(t),t=c.next,a=c.next;continue}if(t=c,t===a){r?r===1?(t=bs(X(t),o,e),Ce(t,o,e,i,n,s,2)):r===2&&ws(t,o,e,i,n,s):Ce(X(t),o,e,i,n,s,1);break}}}}function Ls(t){var o=t.prev,e=t,i=t.next;if(w(o,e,i)>=0)return!1;for(var n=o.x,s=e.x,r=i.x,a=o.y,l=e.y,c=i.y,f=n<s?n<r?n:r:s<r?s:r,d=a<l?a<c?a:c:l<c?l:c,u=n>s?n>r?n:r:s>r?s:r,p=a>l?a>c?a:c:l>c?l:c,g=i.next;g!==o;){if(g.x>=f&&g.x<=u&&g.y>=d&&g.y<=p&&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 Ss(t,o,e,i){var n=t.prev,s=t,r=t.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,u=r.y,p=a<l?a<c?a:c:l<c?l:c,g=f<d?f<u?f:u:d<u?d:u,h=a>l?a>c?a:c:l>c?l:c,v=f>d?f>u?f:u:d>u?d:u,P=mt(p,g,o,e,i),C=mt(h,v,o,e,i),m=t.prevZ,x=t.nextZ;m&&m.z>=P&&x&&x.z<=C;){if(m.x>=p&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&se(a,f,l,d,c,u,m.x,m.y)&&w(m.prev,m,m.next)>=0||(m=m.prevZ,x.x>=p&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&se(a,f,l,d,c,u,x.x,x.y)&&w(x.prev,x,x.next)>=0))return!1;x=x.nextZ}for(;m&&m.z>=P;){if(m.x>=p&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&se(a,f,l,d,c,u,m.x,m.y)&&w(m.prev,m,m.next)>=0)return!1;m=m.prevZ}for(;x&&x.z<=C;){if(x.x>=p&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&se(a,f,l,d,c,u,x.x,x.y)&&w(x.prev,x,x.next)>=0)return!1;x=x.nextZ}return!0}function bs(t,o,e){var i=t;do{var n=i.prev,s=i.next.next;!Ke(n,s)&&Ji(n,i,i.next,s)&&Le(n,s)&&Le(s,n)&&(o.push(n.i/e|0),o.push(i.i/e|0),o.push(s.i/e|0),Se(i),Se(i.next),i=t=s),i=i.next}while(i!==t);return X(i)}function ws(t,o,e,i,n,s){var r=t;do{for(var a=r.next.next;a!==r.prev;){if(r.i!==a.i&&ks(r,a)){var l=Yi(r,a);r=X(r,r.next),l=X(l,l.next),Ce(r,o,e,i,n,s,0),Ce(l,o,e,i,n,s,0);return}a=a.next}r=r.next}while(r!==t)}function Is(t,o,e,i){var n=[],s,r,a,l,c;for(s=0,r=o.length;s<r;s++)a=o[s]*i,l=s<r-1?o[s+1]*i:t.length,c=$i(t,a,l,i,!1),c===c.next&&(c.steiner=!0),n.push(zs(c));for(n.sort(As),s=0;s<n.length;s++)e=Es(n[s],e);return e}function As(t,o){return t.x-o.x}function Es(t,o){var e=Ts(t,o);if(!e)return o;var i=Yi(e,t);return X(i,i.next),X(e,e.next)}function Ts(t,o){var e=o,i=t.x,n=t.y,s=-Infinity,r;do{if(n<=e.y&&n>=e.next.y&&e.next.y!==e.y){var a=e.x+(n-e.y)*(e.next.x-e.x)/(e.next.y-e.y);if(a<=i&&a>s&&(s=a,r=e.x<e.next.x?e:e.next,a===i))return r}e=e.next}while(e!==o);if(!r)return null;var l=r,c=r.x,f=r.y,d=Infinity,u;e=r;do i>=e.x&&e.x>=c&&i!==e.x&&se(n<f?i:s,n,c,f,n<f?s:i,n,e.x,e.y)&&(u=Math.abs(n-e.y)/(i-e.x),Le(e,t)&&(u<d||u===d&&(e.x>r.x||e.x===r.x&&Os(r,e)))&&(r=e,d=u)),e=e.next;while(e!==l);return r}function Os(t,o){return w(t.prev,t,o.prev)<0&&w(o.next,t,t.next)<0}function Rs(t,o,e,i){var n=t;do n.z===0&&(n.z=mt(n.x,n.y,o,e,i)),n.prevZ=n.prev,n.nextZ=n.next,n=n.next;while(n!==t);n.prevZ.nextZ=null,n.prevZ=null,Ms(n)}function Ms(t){var o,e,i,n,s,r,a,l,c=1;do{for(e=t,t=null,s=null,r=0;e;){for(r++,i=e,a=0,o=0;o<c&&(a++,i=i.nextZ,!!i);o++);for(l=c;a>0||l>0&&i;)a!==0&&(l===0||!i||e.z<=i.z)?(n=e,e=e.nextZ,a--):(n=i,i=i.nextZ,l--),s?s.nextZ=n:t=n,n.prevZ=s,s=n;e=i}s.nextZ=null,c*=2}while(r>1);return t}function mt(t,o,e,i,n){return t=(t-e)*n|0,o=(o-i)*n|0,t=(t|t<<8)&16711935,t=(t|t<<4)&252645135,t=(t|t<<2)&858993459,t=(t|t<<1)&1431655765,o=(o|o<<8)&16711935,o=(o|o<<4)&252645135,o=(o|o<<2)&858993459,o=(o|o<<1)&1431655765,t|o<<1}function zs(t){var o=t,e=t;do(o.x<e.x||o.x===e.x&&o.y<e.y)&&(e=o),o=o.next;while(o!==t);return e}function se(t,o,e,i,n,s,r,a){return(n-r)*(o-a)>=(t-r)*(s-a)&&(t-r)*(i-a)>=(e-r)*(o-a)&&(e-r)*(s-a)>=(n-r)*(i-a)}function ks(t,o){return t.next.i!==o.i&&t.prev.i!==o.i&&!Ds(t,o)&&(Le(t,o)&&Le(o,t)&&Fs(t,o)&&(w(t.prev,t,o.prev)||w(t,o.prev,o))||Ke(t,o)&&w(t.prev,t,t.next)>0&&w(o.prev,o,o.next)>0)}function w(t,o,e){return(o.y-t.y)*(e.x-o.x)-(o.x-t.x)*(e.y-o.y)}function Ke(t,o){return t.x===o.x&&t.y===o.y}function Ji(t,o,e,i){var n=He(w(t,o,e)),s=He(w(t,o,i)),r=He(w(e,i,t)),a=He(w(e,i,o));return!!(n!==s&&r!==a||n===0&&Ve(t,e,o)||s===0&&Ve(t,i,o)||r===0&&Ve(e,t,i)||a===0&&Ve(e,o,i))}function Ve(t,o,e){return o.x<=Math.max(t.x,e.x)&&o.x>=Math.min(t.x,e.x)&&o.y<=Math.max(t.y,e.y)&&o.y>=Math.min(t.y,e.y)}function He(t){return t>0?1:t<0?-1:0}function Ds(t,o){var e=t;do{if(e.i!==t.i&&e.next.i!==t.i&&e.i!==o.i&&e.next.i!==o.i&&Ji(e,e.next,t,o))return!0;e=e.next}while(e!==t);return!1}function Le(t,o){return w(t.prev,t,t.next)<0?w(t,o,t.next)>=0&&w(t,t.prev,o)>=0:w(t,o,t.prev)<0||w(t,t.next,o)<0}function Fs(t,o){var e=t,i=!1,n=(t.x+o.x)/2,s=(t.y+o.y)/2;do e.y>s!=e.next.y>s&&e.next.y!==e.y&&n<(e.next.x-e.x)*(s-e.y)/(e.next.y-e.y)+e.x&&(i=!i),e=e.next;while(e!==t);return i}function Yi(t,o){var e=new yt(t.i,t.x,t.y),i=new yt(o.i,o.x,o.y),n=t.next,s=o.prev;return t.next=o,o.prev=t,e.next=n,n.prev=e,i.next=e,e.prev=i,s.next=i,i.prev=s,i}function Ki(t,o,e,i){var n=new yt(t,o,e);return i?(n.next=i.next,n.prev=i,i.next.prev=n,i.next=n):(n.prev=n,n.next=n),n}function Se(t){t.next.prev=t.prev,t.prev.next=t.next,t.prevZ&&(t.prevZ.nextZ=t.nextZ),t.nextZ&&(t.nextZ.prevZ=t.prevZ)}function yt(t,o,e){this.i=t,this.x=o,this.y=e,this.prev=null,this.next=null,this.z=0,this.prevZ=null,this.nextZ=null,this.steiner=!1}Ze.deviation=function(t,o,e,i){var n=o&&o.length,s=n?o[0]*e:t.length,r=Math.abs(Pt(t,0,s,e));if(n)for(var a=0,l=o.length;a<l;a++){var c=o[a]*e,f=a<l-1?o[a+1]*e:t.length;r-=Math.abs(Pt(t,c,f,e))}var d=0;for(a=0;a<i.length;a+=3){var u=i[a]*e,p=i[a+1]*e,g=i[a+2]*e;d+=Math.abs((t[u]-t[g])*(t[p+1]-t[u+1])-(t[u]-t[p])*(t[g+1]-t[u+1]))}return r===0&&d===0?0:Math.abs((d-r)/r)};function Pt(t,o,e,i){for(var n=0,s=o,r=e-i;s<e;s+=i)n+=(t[r]-t[s])*(t[s+1]+t[r+1]),r=s;return n}Ze.flatten=function(t){for(var o=t[0][0].length,e={vertices:[],holes:[],dimensions:o},i=0,n=0;n<t.length;n++){for(var s=0;s<t[n].length;s++)for(var r=0;r<o;r++)e.vertices.push(t[n][s][r]);n>0&&(i+=t[n-1].length,e.holes.push(i))}return e}});var Xo=`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 Ft=`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 Nt={name:`arc`,source:Xo,vs:Ft,fs:Ft,uniformTypes:{greatCircle:`f32`,useShortestPath:`f32`,numSegments:`f32`,widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,widthUnits:`i32`}};var Gt=`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 Bt=`#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 jt=`#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 ze=[0,0,0,255];var qo={getSourcePosition:{type:`accessor`,value:t=>t.sourcePosition},getTargetPosition:{type:`accessor`,value:t=>t.targetPosition},getSourceColor:{type:`accessor`,value:ze},getTargetColor:{type:`accessor`,value:ze},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 en=(()=>{class t extends en$1{getBounds(){return this.getAttributeManager()?.getBounds([`instanceSourcePositions`,`instanceTargetPositions`])}getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:Bt,fs:jt,source:Gt,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,Nt]})}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:ze},instanceTargetColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getTargetColor`,defaultValue:ze},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:i,oldProps:n,changeFlags:s}=e;(s.extensionsChanged||i.antialiasing!==n.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{widthUnits:i,widthScale:n,widthMinPixels:s,widthMaxPixels:r,greatCircle:a,wrapLongitude:l,numSegments:c}=this.props,f={numSegments:c,widthUnits:ee[i],widthScale:n,widthMinPixels:s,widthMaxPixels:r,greatCircle:a,useShortestPath:l},d=this.state.model;d.shaderInputs.setProps({arc:f}),d.setVertexCount(c*2),d.draw(this.context.renderPass)}_getModel(){return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),topology:`triangle-strip`,isInstanced:!0}))}}return t.layerName=`ArcLayer`,t.defaultProps=qo,t})();var tn=new Uint32Array([0,2,1,0,3,2]);var on=new Float32Array([0,1,0,0,1,0,1,1]);function dt(t,o){if(!o)return nn(t);let e=Math.max(Math.abs(t[0][0]-t[3][0]),Math.abs(t[1][0]-t[2][0])),i=Math.max(Math.abs(t[1][1]-t[0][1]),Math.abs(t[2][1]-t[3][1])),n=Math.ceil(e/o)+1,s=Math.ceil(i/o)+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 u=0;u<n;u++){let p=u/(n-1);for(let g=0;g<s;g++){let h=g/(s-1),v=sn(t,p,h);c[f*3+0]=v[0],c[f*3+1]=v[1],c[f*3+2]=v[2]||0,l[f*2+0]=p,l[f*2+1]=1-h,u>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 nn(t){let o=new Float64Array(12);for(let e=0;e<t.length;e++)o[e*3+0]=t[e][0],o[e*3+1]=t[e][1],o[e*3+2]=t[e][2]||0;return{vertexCount:6,positions:o,indices:tn,texCoords:on}}function sn(t,o,e){return Ni$1(Ni$1(t[0],t[1],e),Ni$1(t[3],t[2],e),o)}var rn=`
|
|
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 Wt=`layout(std140) uniform bitmapUniforms {
|
|
589
|
+
vec4 bounds;
|
|
590
|
+
float coordinateConversion;
|
|
591
|
+
float desaturate;
|
|
592
|
+
vec3 tintColor;
|
|
593
|
+
vec4 transparentColor;
|
|
594
|
+
} bitmap;
|
|
595
|
+
`;var Ut={name:`bitmap`,source:rn,vs:Wt,fs:Wt,uniformTypes:{bounds:`vec4<f32>`,coordinateConversion:`f32`,desaturate:`f32`,tintColor:`vec3<f32>`,transparentColor:`vec4<f32>`}};var Vt=`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 Ht=`#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 Zt=`#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 ln={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 fn=(()=>{class t extends en$1{getShaders(){return super.getShaders({vs:Ht,fs:Zt,source:Vt,modules:[ma,Wa,Ka,Ut]})}initializeState(){let e=this.getAttributeManager(),i=!0;e.add({indices:{size:1,isIndexed:!0,update:n=>n.value=this.state.mesh.indices,noAlloc:i},positions:{size:3,type:`float64`,fp64:this.use64bitPositions(),update:n=>n.value=this.state.mesh.positions,noAlloc:i},texCoords:{size:2,update:n=>n.value=this.state.mesh.texCoords,noAlloc:i}})}updateState({props:e,oldProps:i,changeFlags:n}){let s=this.getAttributeManager();if(n.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),s.invalidateAll()),e.bounds!==i.bounds){let r$1=this.state.mesh,a=this._createMesh();this.state.model.setVertexCount(a.vertexCount);for(let l in a)r$1&&r$1[l]!==a[l]&&s.invalidate(l);this.setState(r({mesh:a},this._getCoordinateUniforms()))}else e._imageCoordinateSystem!==i._imageCoordinateSystem&&this.setState(this._getCoordinateUniforms())}getPickingInfo(e){let{image:i}=this.props,n=e.info;if(!n.color||!i)return n.bitmap=null,n;let{width:s,height:r}=i;n.index=0;let a=dn(n.color);return n.bitmap={size:{width:s,height:r},uv:a,pixel:[Math.floor(a[0]*s),Math.floor(a[1]*r)]},n}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,i=e;return Kt(e)&&(i=[[e[0],e[1]],[e[0],e[3]],[e[2],e[3]],[e[2],e[1]]]),dt(i,this.context.viewport.resolution)}_getModel(){let e=this.context.device.type===`webgpu`?this.getAttributeManager().getBufferLayouts({isInstanced:!1}).filter(i=>i.name!==`indices`):this.getAttributeManager().getBufferLayouts();return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:e,topology:`triangle-list`,isInstanced:!1}))}draw(e){let{shaderModuleProps:i}=e,{model:n,coordinateConversion:s,bounds:r,disablePicking:a}=this.state,{image:l,desaturate:c,transparentColor:f,tintColor:d}=this.props;if(!(i.picking.isActive&&a)&&l&&n){let u={bitmapTexture:l,bounds:r,coordinateConversion:s,desaturate:c,tintColor:d.slice(0,3).map(p=>p/255),transparentColor:f.map(p=>p/255)};n.shaderInputs.setProps({bitmap:u}),n.draw(this.context.renderPass)}}_getCoordinateUniforms(){let{_imageCoordinateSystem:e}=this.props;if(e!=="default"){let{bounds:i}=this.props;if(!Kt(i))throw new Error(`_imageCoordinateSystem only supports rectangular bounds`);let n=this.context.viewport.resolution?`lnglat`:`cartesian`;if(e=e===`lnglat`?`lnglat`:`cartesian`,e===`lnglat`&&n===`cartesian`)return{coordinateConversion:-1,bounds:i};if(e===`cartesian`&&n===`lnglat`){let s=st$1([i[0],i[1]]),r=st$1([i[2],i[3]]);return{coordinateConversion:1,bounds:[s[0],s[1],r[0],r[1]]}}}return{coordinateConversion:0,bounds:[0,0,0,0]}}}return t.layerName=`BitmapLayer`,t.defaultProps=ln,t})();function dn(t){let[o,e,i]=t,n=(i&240)/256;return[(o+(i&15)/16)/256,(e+n)/256]}function Kt(t){return Number.isFinite(t[0])}var $t=`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 Jt={name:`icon`,vs:$t,fs:$t,uniformTypes:{sizeScale:`f32`,iconsTextureDim:`vec2<f32>`,sizeBasis:`f32`,sizeMinPixels:`f32`,sizeMaxPixels:`f32`,billboard:`f32`,sizeUnits:`i32`,alphaCutoff:`f32`}};var Yt=`#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 Xt=`#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 un=`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 qt(t){return un.replace(`PICKING_COLOR_ATTRIBUTE`,t?`@location(10) rowIndexes: u32,`:``).replace(`PICKING_COLOR_VALUE`,t?`picking_getPickingColorFromIndex(inp.rowIndexes)`:`picking_getPickingColorFromIndex(inp.instanceIndex)`)}var pn=1024;var gn=4;var Qt=()=>{};var ei={minFilter:`linear`,mipmapFilter:`linear`,magFilter:`linear`,addressModeU:`clamp-to-edge`,addressModeV:`clamp-to-edge`};var hn={x:0,y:0,width:0,height:0};function xn(t){return Math.pow(2,Math.ceil(Math.log2(t)))}function vn(t,o,e,i){let n=Math.min(e/o.width,i/o.height),s=Math.floor(o.width*n),r=Math.floor(o.height*n);return n===1?{image:o,width:s,height:r}:(t.canvas.height=r,t.canvas.width=s,t.clearRect(0,0,s,r),t.drawImage(o,0,0,o.width,o.height,0,0,s,r),{image:t.canvas,width:s,height:r})}function le(t){return t&&(t.id||t.url)}function ii(t){let{device:o}=t;o.type===`webgl`?t.generateMipmapsWebGL():o.type===`webgpu`&&o.generateMipmapsWebGPU(t)}function mn(t,o,e,i){let{width:n,height:s,device:r}=t,a=r.createTexture({format:`rgba8unorm`,width:o,height:e,sampler:i,mipLevels:r.getMipLevelCount(o,e)}),l=r.createCommandEncoder();l.copyTextureToTexture({sourceTexture:t,destinationTexture:a,width:n,height:s});let c=l.finish();return r.submit(c),ii(a),t.destroy(),a}function ti(t,o,e){for(let i=0;i<o.length;i++){let{icon:n,xOffset:s$1}=o[i],r$2=le(n);t[r$2]=s(r({},n),{x:s$1,y:e})}}function yn({icons:t,buffer:o,mapping:e={},xOffset:i=0,yOffset:n=0,rowHeight:s=0,canvasWidth:r}){let a=[];for(let l=0;l<t.length;l++){let c=t[l];if(!e[le(c)]){let{height:d,width:u}=c;i+u+o>r&&(ti(e,a,n),i=0,n=s+n+o,s=0,a=[]),a.push({icon:c,xOffset:i}),i=i+u+o,s=Math.max(s,d)}}return a.length>0&&ti(e,a,n),{mapping:e,rowHeight:s,xOffset:i,yOffset:n,canvasWidth:r,canvasHeight:xn(s+n+o)}}function Pn(t,o,e){if(!t||!o)return null;e=e||{};let i={},{iterable:n,objectInfo:s$2}=Ar(t);for(let r$3 of n){s$2.index++;let a=o(r$3,s$2),l=le(a);if(!a)throw new Error(`Icon is missing.`);if(!a.url)throw new Error(`Icon url is missing.`);!i[l]&&(!e[l]||a.url!==e[l].url)&&(i[l]=s(r({},a),{source:r$3,sourceIndex:s$2.index}))}return i}var ke=class{constructor(o,{onUpdate:e=Qt,onError:i=Qt}){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=gn,this._canvasWidth=pn,this._canvasHeight=0,this._canvas=null,this.device=o,this.onUpdate=e,this.onError=i}finalize(){this._texture?.delete()}getTexture(){return this._texture||this._externalTexture}getIconMapping(o){let e=this._autoPacking?le(o):o;return this._mapping[e]||hn}setProps({loadOptions:o,autoPacking:e,iconAtlas:i,iconMapping:n,textureParameters:s}){o&&(this._loadOptions=o),e!==void 0&&(this._autoPacking=e),n&&(this._mapping=n),i&&(this._texture?.delete(),this._texture=null,this._externalTexture=i),s&&(this._samplerParameters=s)}get isLoaded(){return this._pendingCount===0}packIcons(o,e){if(!this._autoPacking||typeof document>`u`)return;let i=Object.values(Pn(o,e,this._mapping)||{});if(i.length>0){let{mapping:n,xOffset:s,yOffset:r,rowHeight:a,canvasHeight:l}=yn({icons:i,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||ei,mipLevels:this.device.getMipLevelCount(this._canvasWidth,this._canvasHeight)})),this._texture.height!==this._canvasHeight&&(this._texture=mn(this._texture,this._canvasWidth,this._canvasHeight,this._samplerParameters||ei)),this.onUpdate(!0),this._canvas=this._canvas||document.createElement(`canvas`),this._loadIcons(i)}}_loadIcons(o){let e=this._canvas.getContext(`2d`,{willReadFrequently:!0});for(let i of o)this._pendingCount++,ge$1(i.url,this._loadOptions).then(n=>{let s=le(i),r=this._mapping[s],{x:a,y:l,width:c,height:f}=r,{image:d,width:u,height:p}=vn(e,n,c,f),g=a+(c-u)/2,h=l+(f-p)/2;this._texture?.copyExternalImage({image:d,x:g,y:h,width:u,height:p}),r.x=g,r.y=h,r.width=u,r.height=p,this._texture&&ii(this._texture),this.onUpdate(u!==c||p!==f)}).catch(n=>{this.onError({url:i.url,source:i.source,sourceIndex:i.sourceIndex,loadOptions:this._loadOptions,error:n})}).finally(()=>{this._pendingCount--})}};var oi=[0,0,0,255];var _n={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:t=>t.position},getIcon:{type:`accessor`,value:t=>t.icon},getColor:{type:`accessor`,value:oi},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 ce=(()=>{class t extends en$1{getShaders(){let e=!!this.props.data?.attributes?.rowIndexes;return super.getShaders({vs:Yt,fs:Xt,source:qt(e),defines:e?{USE_ROW_INDEXES:!0}:{},modules:[Wa,ma,Ka,Jt]})}initializeState(){this.state={iconManager:new ke(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:oi},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:i,oldProps:n,changeFlags:s}=e,r=this.getAttributeManager(),{iconAtlas:a,iconMapping:l,data:c,getIcon:f,textureParameters:d}=i,{iconManager:u}=this.state;if(typeof a==`string`)return;let p=a||this.internalState.isAsyncPropLoading(`iconAtlas`);u.setProps({loadOptions:i.loadOptions,autoPacking:!p,iconAtlas:a,iconMapping:p?l:null,textureParameters:d}),p?n.iconMapping!==i.iconMapping&&r.invalidate(`getIcon`):(s.dataChanged||s.updateTriggersChanged&&(s.updateTriggersChanged.all||s.updateTriggersChanged.getIcon))&&u.packIcons(c,f),s.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),r.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:i,sizeBasis:n,sizeMinPixels:s,sizeMaxPixels:r,sizeUnits:a,billboard:l,alphaCutoff:c}=this.props,{iconManager:f}=this.state,d=f.getTexture();if(d){let u={iconsTexture:d,iconsTextureDim:[d.width,d.height],sizeUnits:ee[a],sizeScale:i,sizeBasis:n===`height`?1:0,sizeMinPixels:s,sizeMaxPixels:r,billboard:l,alphaCutoff:c};e.shaderInputs.setProps({icon:u}),e.draw(this.context.renderPass)}}_getModel(e=this.props.id){return new De$1(this.context.device,s(r({},this.getShaders()),{id:e,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$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 i=this.getCurrentLayer()?.props.onIconError;i?i(e):A.error(e.error.message)()}getInstanceIconDef(e){let{x:i,y:n,width:s,height:r,mask:a,anchorX:l=s/2,anchorY:c=r/2}=this.state.iconManager.getIconMapping(e);return[s/2-l,r/2-c,i,n,s,r,a?1:0]}}return t.defaultProps=_n,t.layerName=`IconLayer`,t})();var ni=`layout(std140) uniform lineUniforms {
|
|
1119
|
+
float widthScale;
|
|
1120
|
+
float widthMinPixels;
|
|
1121
|
+
float widthMaxPixels;
|
|
1122
|
+
float useShortestPath;
|
|
1123
|
+
highp int widthUnits;
|
|
1124
|
+
} line;
|
|
1125
|
+
`;var si={name:`line`,source:``,vs:ni,fs:ni,uniformTypes:{widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,useShortestPath:`f32`,widthUnits:`i32`}};var ri=`// ---------- 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 ai=`#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 li=`#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 Sn={getSourcePosition:{type:`accessor`,value:t=>t.sourcePosition},getTargetPosition:{type:`accessor`,value:t=>t.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 wn=(()=>{class t extends en$1{getBounds(){return this.getAttributeManager()?.getBounds([`instanceSourcePositions`,`instanceTargetPositions`])}getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:ai,fs:li,source:ri,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,si]})}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:i,oldProps:n,changeFlags:s}=e;(s.extensionsChanged||i.antialiasing!==n.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{widthUnits:i,widthScale:n,widthMinPixels:s$3,widthMaxPixels:r$4,wrapLongitude:a}=this.props,l=this.state.model,c={widthUnits:ee[i],widthScale:n,widthMinPixels:s$3,widthMaxPixels:r$4,useShortestPath:a?1:0};l.shaderInputs.setProps({line:c}),l.draw(this.context.renderPass),a&&(l.shaderInputs.setProps({line:s(r({},c),{useShortestPath:-1})}),l.draw(this.context.renderPass))}_getModel(){return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$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}))}}return t.layerName=`LineLayer`,t.defaultProps=Sn,t})();var ci=`layout(std140) uniform pointCloudUniforms {
|
|
1441
|
+
float radiusPixels;
|
|
1442
|
+
highp int sizeUnits;
|
|
1443
|
+
} pointCloud;
|
|
1444
|
+
`;var fi={name:`pointCloud`,source:``,vs:ci,fs:ci,uniformTypes:{radiusPixels:`f32`,sizeUnits:`i32`}};var di=`#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 ui=`#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 pi=`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 gi=[0,0,0,255];var hi=[0,0,1];var In={sizeUnits:`pixels`,pointSize:{type:`number`,min:0,value:10},antialiasing:!1,getPosition:{type:`accessor`,value:t=>t.position},getNormal:{type:`accessor`,value:hi},getColor:{type:`accessor`,value:gi},material:!0,radiusPixels:{deprecatedFor:`pointSize`}};function An(t){let{header:o,attributes:e}=t;if(!(!o||!e)&&(t.length=o.vertexCount,e.POSITION&&(e.instancePositions=e.POSITION),e.NORMAL&&(e.instanceNormals=e.NORMAL),e.COLOR_0)){let{size:i,value:n}=e.COLOR_0;e.instanceColors={size:i,type:`unorm8`,value:n}}}var Tn=(()=>{class t extends en$1{getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:di,fs:ui,source:pi,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Zo$1,Ka,fi]})}initializeState(){this.getAttributeManager().addInstanced({instancePositions:{size:3,type:`float64`,fp64:this.use64bitPositions(),transition:!0,accessor:`getPosition`},instanceNormals:{size:3,transition:!0,accessor:`getNormal`,defaultValue:hi},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getColor`,defaultValue:gi}})}updateState(e){let{changeFlags:i,props:n,oldProps:s}=e;super.updateState(e),(i.extensionsChanged||n.antialiasing!==s.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll()),i.dataChanged&&An(n.data)}draw({uniforms:e}){let{pointSize:i,sizeUnits:n}=this.props,s=this.state.model,r={sizeUnits:ee[n],radiusPixels:i};s.shaderInputs.setProps({pointCloud:r}),s.draw(this.context.renderPass)}_getModel(){let e=[];for(let i=0;i<3;i++){let n=i/3*Math.PI*2;e.push(Math.cos(n)*2,Math.sin(n)*2,0)}return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$1({topology:`triangle-list`,attributes:{positions:new Float32Array(e)}}),isInstanced:!0}))}}return t.layerName=`PointCloudLayer`,t.defaultProps=In,t})();var xi=`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 vi={name:`scatterplot`,vs:xi,fs:xi,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 mi=`#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 yi=`#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 On=`// 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 Pi(t){return On.replace(`PICKING_COLOR_ATTRIBUTE`,t?`@location(8) rowIndexes: u32,`:``).replace(`PICKING_COLOR_VALUE`,t?`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(t={}){let o={};return t.enabled!==void 0&&(o.enabled=t.enabled?1:0),t.mode!==void 0&&(o.mode=t.mode===`instance`?1:0),t.bounds!==void 0&&(o.bounds=t.bounds),o}};var _i=[0,0,0,255];var zn={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:t=>t.position},getRadius:{type:`accessor`,value:1},getFillColor:{type:`accessor`,value:_i},getLineColor:{type:`accessor`,value:_i},getLineWidth:{type:`accessor`,value:1},getPixelOffset:{type:`accessor`,value:[0,0]},strokeWidth:{deprecatedFor:`getLineWidth`},outline:{deprecatedFor:`stroked`},getColor:{deprecatedFor:[`getFillColor`,`getLineColor`]}};var ut=(()=>{class t extends en$1{getShaders(){let e=!!this.props.data?.attributes?.rowIndexes;return super.getShaders({vs:mi,fs:yi,source:Pi(e),defines:e?{USE_ROW_INDEXES:!0}:{},modules:[Wa,ma,Ka,vi,...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:i,radiusScale:n,radiusMinPixels:s,radiusMaxPixels:r,stroked:a,filled:l,billboard:c,antialiasing:f,lineWidthUnits:d,lineWidthScale:u,lineWidthMinPixels:p,lineWidthMaxPixels:g}=this.props,h={stroked:a,filled:l,billboard:c,antialiasing:f,radiusUnits:ee[i],radiusScale:n,radiusMinPixels:s,radiusMaxPixels:r,lineWidthUnits:ee[d],lineWidthScale:u,lineWidthMinPixels:p,lineWidthMaxPixels:g},v=this.state.model;v.shaderInputs.setProps({scatterplot:h}),v.draw(this.context.renderPass)}_getModel(){return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$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}))}}return t.defaultProps=zn,t.layerName=`ScatterplotLayer`,t})();var oe={CLOCKWISE:1,COUNTER_CLOCKWISE:-1};function J(t,o,e={}){return Ci(t,e)!==o?(Dn(t,e),!0):!1}function Ci(t,o={}){return Math.sign(de(t,o))}var fe={x:0,y:1,z:2};function de(t,o={}){let{start:e=0,end:i=t.length,plane:n=`xy`}=o,s=o.size||2,r=0,a=fe[n[0]],l=fe[n[1]];for(let c=e,f=i-s;c<i;c+=s)r+=(t[c+a]-t[f+a])*(t[c+l]+t[f+l]),f=c;return r/2}function Dn(t,o){let{start:e=0,end:i=t.length,size:n=2}=o,s=(i-e)/n,r=Math.floor(s/2);for(let a=0;a<r;++a){let l=e+a*n,c=e+(s-1-a)*n;for(let f=0;f<n;++f){let d=t[l+f];t[l+f]=t[c+f],t[c+f]=d}}}function Nn(t,o,e=2,i,n=`xy`){let s=o&&o.length,r=s?o[0]*e:t.length,a=Si(t,0,r,e,!0,i&&i[0],n),l=[];if(!a||a.next===a.prev)return l;let c,f,d,u,p,g,h;if(s&&(a=Un(t,o,a,e,i,n)),t.length>80*e){u=f=t[0],p=d=t[1];for(let v=e;v<r;v+=e)g=t[v],h=t[v+1],g<u&&(u=g),h<p&&(p=h),g>f&&(f=g),h>d&&(d=h);c=Math.max(f-u,d-p),c=c!==0?32767/c:0}return ue(a,l,e,u,p,c,0),l}function Si(t,o,e,i,n,s,r){let a,l;s===void 0&&(s=de(t,{start:o,end:e,size:i,plane:r}));let c=fe[r[0]],f=fe[r[1]];if(n===s<0)for(a=o;a<e;a+=i)l=Li(a,t[a+c],t[a+f],l);else for(a=e-i;a>=o;a-=i)l=Li(a,t[a+c],t[a+f],l);return l&&Ne(l,l.next)&&(ge(l),l=l.next),l}function Y(t,o){if(!t)return t;o||(o=t);let e=t,i;do if(i=!1,!e.steiner&&(Ne(e,e.next)||b(e.prev,e,e.next)===0)){if(ge(e),e=o=e.prev,e===e.next)break;i=!0}else e=e.next;while(i||e!==o);return o}function ue(t,o,e,i,n,s,r){if(!t)return;!r&&s&&$n(t,i,n,s);let a=t,l,c;for(;t.prev!==t.next;){if(l=t.prev,c=t.next,s?Bn(t,i,n,s):Gn(t)){o.push(l.i/e|0),o.push(t.i/e|0),o.push(c.i/e|0),ge(t),t=c.next,a=c.next;continue}if(t=c,t===a){r?r===1?(t=jn(Y(t),o,e),ue(t,o,e,i,n,s,2)):r===2&&Wn(t,o,e,i,n,s):ue(Y(t),o,e,i,n,s,1);break}}}function Gn(t){let o=t.prev,e=t,i=t.next;if(b(o,e,i)>=0)return!1;let n=o.x,s=e.x,r=i.x,a=o.y,l=e.y,c=i.y,f=n<s?n<r?n:r:s<r?s:r,d=a<l?a<c?a:c:l<c?l:c,u=n>s?n>r?n:r:s>r?s:r,p=a>l?a>c?a:c:l>c?l:c,g=i.next;for(;g!==o;){if(g.x>=f&&g.x<=u&&g.y>=d&&g.y<=p&&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 Bn(t,o,e,i){let n=t.prev,s=t,r=t.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,u=r.y,p=a<l?a<c?a:c:l<c?l:c,g=f<d?f<u?f:u:d<u?d:u,h=a>l?a>c?a:c:l>c?l:c,v=f>d?f>u?f:u:d>u?d:u,P=pt(p,g,o,e,i),C=pt(h,v,o,e,i),m=t.prevZ,x=t.nextZ;for(;m&&m.z>=P&&x&&x.z<=C;){if(m.x>=p&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&ne(a,f,l,d,c,u,m.x,m.y)&&b(m.prev,m,m.next)>=0||(m=m.prevZ,x.x>=p&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&ne(a,f,l,d,c,u,x.x,x.y)&&b(x.prev,x,x.next)>=0))return!1;x=x.nextZ}for(;m&&m.z>=P;){if(m.x>=p&&m.x<=h&&m.y>=g&&m.y<=v&&m!==n&&m!==r&&ne(a,f,l,d,c,u,m.x,m.y)&&b(m.prev,m,m.next)>=0)return!1;m=m.prevZ}for(;x&&x.z<=C;){if(x.x>=p&&x.x<=h&&x.y>=g&&x.y<=v&&x!==n&&x!==r&&ne(a,f,l,d,c,u,x.x,x.y)&&b(x.prev,x,x.next)>=0)return!1;x=x.nextZ}return!0}function jn(t,o,e){let i=t;do{let n=i.prev,s=i.next.next;!Ne(n,s)&&bi(n,i,i.next,s)&&pe(n,s)&&pe(s,n)&&(o.push(n.i/e|0),o.push(i.i/e|0),o.push(s.i/e|0),ge(i),ge(i.next),i=t=s),i=i.next}while(i!==t);return Y(i)}function Wn(t,o,e,i,n,s){let r=t;do{let a=r.next.next;for(;a!==r.prev;){if(r.i!==a.i&&Xn(r,a)){let l=wi(r,a);r=Y(r,r.next),l=Y(l,l.next),ue(r,o,e,i,n,s,0),ue(l,o,e,i,n,s,0);return}a=a.next}r=r.next}while(r!==t)}function Un(t,o,e,i,n,s){let r=[],a,l,c,f,d;for(a=0,l=o.length;a<l;a++)c=o[a]*i,f=a<l-1?o[a+1]*i:t.length,d=Si(t,c,f,i,!1,n&&n[a+1],s),d===d.next&&(d.steiner=!0),r.push(Yn(d));for(r.sort(Vn),a=0;a<r.length;a++)e=Hn(r[a],e);return e}function Vn(t,o){return t.x-o.x}function Hn(t,o){let e=Zn(t,o);if(!e)return o;let i=wi(e,t);return Y(i,i.next),Y(e,e.next)}function Zn(t,o){let e=o,i=t.x,n=t.y,s=-Infinity,r;do{if(n<=e.y&&n>=e.next.y&&e.next.y!==e.y){let u=e.x+(n-e.y)*(e.next.x-e.x)/(e.next.y-e.y);if(u<=i&&u>s&&(s=u,r=e.x<e.next.x?e:e.next,u===i))return r}e=e.next}while(e!==o);if(!r)return null;let a=r,l=r.x,c=r.y,f=Infinity,d;e=r;do i>=e.x&&e.x>=l&&i!==e.x&&ne(n<c?i:s,n,l,c,n<c?s:i,n,e.x,e.y)&&(d=Math.abs(n-e.y)/(i-e.x),pe(e,t)&&(d<f||d===f&&(e.x>r.x||e.x===r.x&&Kn(r,e)))&&(r=e,f=d)),e=e.next;while(e!==a);return r}function Kn(t,o){return b(t.prev,t,o.prev)<0&&b(o.next,t,t.next)<0}function $n(t,o,e,i){let n=t;do n.z===0&&(n.z=pt(n.x,n.y,o,e,i)),n.prevZ=n.prev,n.nextZ=n.next,n=n.next;while(n!==t);n.prevZ.nextZ=null,n.prevZ=null,Jn(n)}function Jn(t){let o,e,i=1,n,s,r,a,l,c;do{for(s=t,t=null,c=null,n=0;s;){for(n++,a=s,r=0,e=0;e<i&&(r++,a=a.nextZ,!!a);e++);for(l=i;r>0||l>0&&a;)r!==0&&(l===0||!a||s.z<=a.z)?(o=s,s=s.nextZ,r--):(o=a,a=a.nextZ,l--),c?c.nextZ=o:t=o,o.prevZ=c,c=o;s=a}c.nextZ=null,i*=2}while(n>1);return t}function pt(t,o,e,i,n){return t=(t-e)*n|0,o=(o-i)*n|0,t=(t|t<<8)&16711935,t=(t|t<<4)&252645135,t=(t|t<<2)&858993459,t=(t|t<<1)&1431655765,o=(o|o<<8)&16711935,o=(o|o<<4)&252645135,o=(o|o<<2)&858993459,o=(o|o<<1)&1431655765,t|o<<1}function Yn(t){let o=t,e=t;do(o.x<e.x||o.x===e.x&&o.y<e.y)&&(e=o),o=o.next;while(o!==t);return e}function ne(t,o,e,i,n,s,r,a){return(n-r)*(o-a)>=(t-r)*(s-a)&&(t-r)*(i-a)>=(e-r)*(o-a)&&(e-r)*(s-a)>=(n-r)*(i-a)}function Xn(t,o){return t.next.i!==o.i&&t.prev.i!==o.i&&!qn(t,o)&&(pe(t,o)&&pe(o,t)&&Qn(t,o)&&(b(t.prev,t,o.prev)||b(t,o.prev,o))||Ne(t,o)&&b(t.prev,t,t.next)>0&&b(o.prev,o,o.next)>0)}function b(t,o,e){return(o.y-t.y)*(e.x-o.x)-(o.x-t.x)*(e.y-o.y)}function Ne(t,o){return t.x===o.x&&t.y===o.y}function bi(t,o,e,i){let n=Fe(b(t,o,e)),s=Fe(b(t,o,i)),r=Fe(b(e,i,t)),a=Fe(b(e,i,o));return!!(n!==s&&r!==a||n===0&&De(t,e,o)||s===0&&De(t,i,o)||r===0&&De(e,t,i)||a===0&&De(e,o,i))}function De(t,o,e){return o.x<=Math.max(t.x,e.x)&&o.x>=Math.min(t.x,e.x)&&o.y<=Math.max(t.y,e.y)&&o.y>=Math.min(t.y,e.y)}function Fe(t){return t>0?1:t<0?-1:0}function qn(t,o){let e=t;do{if(e.i!==t.i&&e.next.i!==t.i&&e.i!==o.i&&e.next.i!==o.i&&bi(e,e.next,t,o))return!0;e=e.next}while(e!==t);return!1}function pe(t,o){return b(t.prev,t,t.next)<0?b(t,o,t.next)>=0&&b(t,t.prev,o)>=0:b(t,o,t.prev)<0||b(t,t.next,o)<0}function Qn(t,o){let e=t,i=!1,n=(t.x+o.x)/2,s=(t.y+o.y)/2;do e.y>s!=e.next.y>s&&e.next.y!==e.y&&n<(e.next.x-e.x)*(s-e.y)/(e.next.y-e.y)+e.x&&(i=!i),e=e.next;while(e!==t);return i}function wi(t,o){let e=new he(t.i,t.x,t.y),i=new he(o.i,o.x,o.y),n=t.next,s=o.prev;return t.next=o,o.prev=t,e.next=n,n.prev=e,i.next=e,e.prev=i,s.next=i,i.prev=s,i}function Li(t,o,e,i){let n=new he(t,o,e);return i?(n.next=i.next,n.prev=i,i.next.prev=n,i.next=n):(n.prev=n,n.next=n),n}function ge(t){t.next.prev=t.prev,t.prev.next=t.next,t.prevZ&&(t.prevZ.nextZ=t.nextZ),t.nextZ&&(t.nextZ.prevZ=t.prevZ)}var he=class{constructor(o,e,i){this.prev=null,this.next=null,this.z=0,this.prevZ=null,this.nextZ=null,this.steiner=!1,this.i=o,this.x=e,this.y=i}};function B(t,o){let e=o.length,i=t.length;if(i>0){let n=!0;for(let s=0;s<e;s++)if(t[i-e+s]!==o[s]){n=!1;break}if(n)return!1}for(let n=0;n<e;n++)t[i+n]=o[n];return!0}function xe(t,o){let e=o.length;for(let i=0;i<e;i++)t[i]=o[i]}function K(t,o,e,i,n=[]){let s=i+o*e;for(let r=0;r<e;r++)n[r]=t[s+r];return n}function Ge(t,o,e,i,n=[]){let s,r;if(e&8)s=(i[3]-t[1])/(o[1]-t[1]),r=3;else if(e&4)s=(i[1]-t[1])/(o[1]-t[1]),r=1;else if(e&2)s=(i[2]-t[0])/(o[0]-t[0]),r=2;else if(e&1)s=(i[0]-t[0])/(o[0]-t[0]),r=0;else return null;for(let a=0;a<t.length;a++)n[a]=(r&1)===a?i[r]:s*(o[a]-t[a])+t[a];return n}function ve(t,o){let e=0;return t[0]<o[0]?e|=1:t[0]>o[2]&&(e|=2),t[1]<o[1]?e|=4:t[1]>o[3]&&(e|=8),e}function me(t,o){let{size:e=2,broken:i=!1,gridResolution:n=10,gridOffset:s=[0,0],startIndex:r=0,endIndex:a=t.length}=o||{},l=(a-r)/e,c=[],f=[c],d=K(t,0,e,r),u,p,g=Ei(d,n,s,[]),h=[];B(c,d);for(let v=1;v<l;v++){for(u=K(t,v,e,r,u),p=ve(u,g);p;){Ge(d,u,p,g,h);let P=ve(h,g);P&&(Ge(d,h,P,g,h),p=P),B(c,h),xe(d,h),ts(g,n,p),i&&c.length>e&&(c=[],f.push(c),B(c,d)),p=ve(u,g)}B(c,u),xe(d,u)}return i?f:f[0]}var Ii=0;var es=1;function ye(t,o=null,e){if(!t.length)return[];let{size:i=2,gridResolution:n=10,gridOffset:s=[0,0],edgeTypes:r=!1}=e||{},a=[],l=[{pos:t,types:r?new Array(t.length/i).fill(es):null,holes:o||[]}],c=[[],[]],f=[];for(;l.length;){let{pos:d,types:u,holes:p}=l.shift();is(d,i,p[0]||d.length,c),f=Ei(c[0],n,s,f);let g=ve(c[1],f);if(g){let h=Ai(d,u,i,0,p[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<p.length;C++)h=Ai(d,u,i,p[C],p[C+1]||d.length,f,g),h[0]&&(v.holes.push(v.pos.length),v.pos=Be(v.pos,h[0].pos),r&&(v.types=Be(v.types,h[0].types))),h[1]&&(P.holes.push(P.pos.length),P.pos=Be(P.pos,h[1].pos),r&&(P.types=Be(P.types,h[1].types)))}else{let h={positions:d};r&&(h.edgeTypes=u),p.length&&(h.holeIndices=p),a.push(h)}}return a}function Ai(t,o,e,i,n,s,r){let a=(n-i)/e,l=[],c=[],f=[],d=[],u=[],p,g,h,v=K(t,a-1,e,i),P=Math.sign(r&8?v[1]-s[3]:v[0]-s[2]),C=o&&o[a-1],m=0,x=0;for(let L=0;L<a;L++)p=K(t,L,e,i,p),g=Math.sign(r&8?p[1]-s[3]:p[0]-s[2]),h=o&&o[i/e+L],g&&P&&P!==g&&(Ge(v,p,r,s,u),B(l,u)&&f.push(C),B(c,u)&&d.push(C)),g<=0?(B(l,p)&&f.push(h),m-=g):f.length&&(f[f.length-1]=Ii),g>=0?(B(c,p)&&d.push(h),x+=g):d.length&&(d[d.length-1]=Ii),xe(v,p),P=g,C=h;return[m?{pos:l,types:o&&f}:null,x?{pos:c,types:o&&d}:null]}function Ei(t,o,e,i){let n=Math.floor((t[0]-e[0])/o)*o+e[0],s=Math.floor((t[1]-e[1])/o)*o+e[1];return i[0]=n,i[1]=s,i[2]=n+o,i[3]=s+o,i}function ts(t,o,e){e&8?(t[1]+=o,t[3]+=o):e&4?(t[1]-=o,t[3]-=o):e&2?(t[0]+=o,t[2]+=o):e&1&&(t[0]-=o,t[2]-=o)}function is(t,o,e,i){let n=Infinity,s=-Infinity,r=Infinity,a=-Infinity;for(let l=0;l<e;l+=o){let c=t[l],f=t[l+1];n=c<n?c:n,s=c>s?c:s,r=f<r?f:r,a=f>a?f:a}return i[0][0]=n,i[0][1]=r,i[1][0]=s,i[1][1]=a,i}function Be(t,o){for(let e=0;e<o.length;e++)t.push(o[e]);return t}var os=85.051129;function gt(t,o){let{size:e=2,startIndex:i=0,endIndex:n=t.length,normalize:s=!0}=o||{},r=t.slice(i,n);Ti(r,e,0,n-i);let a=me(r,{size:e,broken:!0,gridResolution:360,gridOffset:[-180,-180]});if(s)for(let l of a)Oi(l,e);return a}function ht(t,o=null,e){let{size:i=2,normalize:n=!0,edgeTypes:s=!1}=e||{};o=o||[];let r=[],a=[],l=0,c=0;for(let d=0;d<=o.length;d++){let u=o[d]||t.length,p=c,g=ns(t,i,l,u);for(let h=g;h<u;h++)r[c++]=t[h];for(let h=l;h<g;h++)r[c++]=t[h];Ti(r,i,p,c),ss(r,i,p,c,e?.maxLatitude),l=u,a[d]=c}a.pop();let f=ye(r,a,{size:i,gridResolution:360,gridOffset:[-180,-180],edgeTypes:s});if(n)for(let d of f)Oi(d.positions,i);return f}function ns(t,o,e,i){let n=-1,s=-1;for(let r=e+1;r<i;r+=o){let a=Math.abs(t[r]);a>n&&(n=a,s=r-1)}return s}function ss(t,o,e,i,n=os){let s=t[e],r=t[i-o];if(Math.abs(s-r)>180){let a=K(t,0,o,e);a[0]+=Math.round((r-s)/360)*360,B(t,a),a[1]=Math.sign(a[1])*n,B(t,a),a[0]=s,B(t,a)}}function Ti(t,o,e,i){let n=t[0],s;for(let r=e;r<i;r+=o){s=t[r];let a=s-n;(a>180||a<-180)&&(s-=Math.round(a/360)*360),t[r]=n=s}}function Oi(t,o){let e,i=t.length/o;for(let s=0;s<i&&(e=t[s*o],(e+180)%360===0);s++);let n=-Math.round(e/360)*360;if(n!==0)for(let s=0;s<i;s++)t[s*o]+=n}var je=class extends ne$1{constructor(o){let{indices:e,attributes:i}=as(o);super(s(r({},o),{topology:`line-list`,indices:e,attributes:i}))}};function as(t){let{radius:o,height:e=1,nradial:i=10}=t,{vertices:n}=t;n&&(A.assert(n.length>=i),n=n.flatMap(p=>[p[0],p[1]]),J(n,oe.COUNTER_CLOCKWISE));let s=e>0,r=i+1,a=s?r*3+1:i,l=Math.PI*2/i,c=new Uint16Array(s?i*3*2:0),f=new Float32Array(a*3),d=new Float32Array(a*3),u=0;if(s){for(let p=0;p<r;p++){let g=p*l,h=p%i,v=Math.sin(g),P=Math.cos(g);for(let C=0;C<2;C++)f[u+0]=n?n[h*2]:P*o,f[u+1]=n?n[h*2+1]:v*o,f[u+2]=(1/2-C)*e,d[u+0]=n?n[h*2]:P,d[u+1]=n?n[h*2+1]:v,u+=3}f[u+0]=f[u-3],f[u+1]=f[u-2],f[u+2]=f[u-1],u+=3}for(let p=s?0:1;p<r;p++){let g=Math.floor(p/2)*Math.sign(.5-p%2),h=g*l,v=(g+i)%i,P=Math.sin(h),C=Math.cos(h);f[u+0]=n?n[v*2]:C*o,f[u+1]=n?n[v*2+1]:P*o,f[u+2]=e/2,d[u+2]=1,u+=3}if(s){let p=0;for(let g=0;g<i;g++)c[p++]=g*2+0,c[p++]=g*2+2,c[p++]=g*2+0,c[p++]=g*2+1,c[p++]=g*2+1,c[p++]=g*2+3}return{indices:c,attributes:{POSITION:{size:3,value:f},NORMAL:{size:3,value:d}}}}var ls=`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 Ri=`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 Mi={name:`column`,source:ls,vs:Ri,fs:Ri,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 zi=`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 cs=`${zi}
|
|
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 fs=`${zi}
|
|
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 ki(t){return t?fs:cs}var Di=`#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 Fi=`#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 We=[0,0,0,255];var ds={name:`geometry`,stepMode:`vertex`,byteStride:24,attributes:[{attribute:`positions`,format:`float32x3`,byteOffset:0},{attribute:`normals`,format:`float32x3`,byteOffset:12}]};var us={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:t=>t.position},getFillColor:{type:`accessor`,value:We},getLineColor:{type:`accessor`,value:We},getLineWidth:{type:`accessor`,value:1},getElevation:{type:`accessor`,value:1e3},material:!0,getColor:{deprecatedFor:[`getFillColor`,`getLineColor`]}};var xt=(()=>{class t extends en$1{getShaders(){let e={},{flatShading:i}=this.props;return i&&(e.FLAT_SHADING=1),super.getShaders({vs:Di,fs:Fi,source:ki(i),defines:e,modules:[Wa,ma,i?Ko$1:Zo$1,Ka,Mi]})}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:We},instanceLineColors:{size:this.props.colorFormat.length,type:`unorm8`,transition:!0,accessor:`getLineColor`,defaultValue:We},instanceStrokeWidths:{size:1,accessor:`getLineWidth`,transition:!0}})}updateState(e){super.updateState(e);let{props:i,oldProps:n,changeFlags:s}=e,r=s.extensionsChanged||i.flatShading!==n.flatShading;r&&(this.state.models?.forEach(l=>l.destroy()),this.setState(this._getModels()),this.getAttributeManager().invalidateAll());let a=this.getNumInstances();this.state.fillModel.setInstanceCount(a),this.state.strokeModel.setInstanceCount(a),this.state.wireframeModel.setInstanceCount(a),(r||i.diskResolution!==n.diskResolution||i.vertices!==n.vertices||i.extruded!==n.extruded||i.stroked!==n.stroked)&&this._updateGeometry(i)}getGeometry(e,i,n){let s=new je({radius:1,height:n?2:0,vertices:i,nradial:e}),r=0;if(i)for(let a=0;a<e;a++){let l=i[a],c=Math.sqrt(l[0]*l[0]+l[1]*l[1]);r+=c/e}else r=1;return this.setState({edgeDistance:Math.cos(Math.PI/e)*r}),s}_getModels(){let e=this.getShaders(),i=[...this.getAttributeManager().getBufferLayouts(),ds],n=new De$1(this.context.device,s(r({},e),{id:`${this.props.id}-fill`,bufferLayout:i,isInstanced:!0})),s$4=new De$1(this.context.device,s(r({},e),{id:`${this.props.id}-stroke`,bufferLayout:i,isInstanced:!0})),r$5=new De$1(this.context.device,s(r({},e),{id:`${this.props.id}-wireframe`,bufferLayout:i,isInstanced:!0}));return{fillModel:n,strokeModel:s$4,wireframeModel:r$5,models:[r$5,n,s$4]}}_updateGeometry({diskResolution:e,vertices:i,extruded:n,stroked:s}){let r=this.getGeometry(e,i,n||s),a=r.attributes.POSITION,l=r.attributes.NORMAL;if(this._setFillGeometry(new ne$1({topology:`triangle-strip`,attributes:{POSITION:a,NORMAL:l}})),!n&&s){let c=a.value.length/3;this._setStrokeGeometry(new ne$1({topology:`triangle-strip`,vertexCount:c-e-1,attributes:{POSITION:a,NORMAL:l}}))}n&&this._setWireframeGeometry(r)}_setFillGeometry(e){let i=pt$1(e,{attributes:[`POSITION`,`NORMAL`]});this.state.fillModel.setGeometry(i)}_setStrokeGeometry(e){let i=pt$1(e,{attributes:[`POSITION`,`NORMAL`]});this.state.strokeModel.setGeometry(i)}_setWireframeGeometry(e){let i=pt$1(e,{attributes:[`POSITION`,`NORMAL`]}),n=this.state.wireframeModel;n.setGeometry(i),n.setTopology(`line-list`)}draw({uniforms:e}){let{lineWidthUnits:i,lineWidthScale:n,lineWidthMinPixels:s$5,lineWidthMaxPixels:r$6,radiusUnits:a,elevationScale:l,extruded:c,filled:f,stroked:d,wireframe:u,offset:p,coverage:g,radius:h,angle:v}=this.props,P=this.state.fillModel,C=this.state.strokeModel,m=this.state.wireframeModel,{edgeDistance:x}=this.state,L={radius:h,angle:v/180*Math.PI,offset:p,extruded:c,stroked:d,coverage:g,elevationScale:l,edgeDistance:x,radiusUnits:ee[a],widthUnits:ee[i],widthScale:n,widthMinPixels:s$5,widthMaxPixels:r$6};c&&u&&(m.shaderInputs.setProps({column:s(r({},L),{isStroke:!0})}),m.draw(this.context.renderPass)),f&&(P.shaderInputs.setProps({column:s(r({},L),{isStroke:!1})}),P.draw(this.context.renderPass)),!c&&d&&(C.shaderInputs.setProps({column:s(r({},L),{isStroke:!0})}),C.draw(this.context.renderPass))}}return t.layerName=`ColumnLayer`,t.defaultProps=us,t})();var gs={cellSize:{type:`number`,min:0,value:1e3},offset:{type:`array`,value:[1,1]}};var xs=(()=>{class t extends xt{_updateGeometry(){let e=new Wr;this._setFillGeometry(e)}draw({uniforms:e}){let{elevationScale:i,extruded:n,offset:s,coverage:r,cellSize:a,angle:l,radiusUnits:c}=this.props,f=this.state.fillModel,d={radius:a/2,radiusUnits:ee[c],angle:l,offset:s,extruded:n,stroked:!1,coverage:r,elevationScale:i,edgeDistance:1,isStroke:!1,widthUnits:0,widthScale:0,widthMinPixels:0,widthMaxPixels:0};f.shaderInputs.setProps({column:d}),f.draw(this.context.renderPass)}}return t.layerName=`GridCellLayer`,t.defaultProps=gs,t})();function Ni(t,o,e,i){let n;if(Array.isArray(t[0])){let s=t.length*o;n=new Array(s);for(let r=0;r<t.length;r++)for(let a=0;a<o;a++)n[r*o+a]=t[r][a]||0}else n=t;return e?me(n,{size:o,gridResolution:e}):i?gt(n,{size:o}):n}var vs=1;var ms=2;var Pe=4;var Ue=class extends an{constructor(o){super(s(r({},o),{attributes:{positions:{size:3,padding:18,initialize:!0,type:o.fp64?Float64Array:Float32Array},segmentTypes:{size:1,type:o.isWebGPU?Float32Array:Uint8ClampedArray}}}))}get(o){return this.attributes[o]}getPathSegmentIndices(o){let e=this.attributes.segmentTypes,i=this.vertexStarts[o],n=Math.min(this.vertexStarts[o+1]??this.instanceCount,this.instanceCount),s=[];for(let r=i;r<n-1;r++)(e[r]&Pe)===0&&s.push(r);return s.length&&(e[i]&Pe)!==0&&s.unshift(s.pop()),s}getGeometryFromBuffer(o){return this.normalize||this.opts.isWebGPU?super.getGeometryFromBuffer(o):null}normalizeGeometry(o){return this.normalize?Ni(o,this.positionSize,this.opts.resolution,this.opts.wrapLongitude):o}getGeometrySize(o){if(Gi(o)){let i=0;for(let n of o)i+=this.getGeometrySize(n);return i}let e=this.getPathLength(o);return e<2?0:this.isClosed(o)?e<3?0:e+2:e}updateGeometryAttributes(o,e){if(e.geometrySize!==0)if(o&&Gi(o))for(let i of o){let n=this.getGeometrySize(i);e.geometrySize=n,this.updateGeometryAttributes(i,e),e.vertexStart+=n}else this._updateSegmentTypes(o,e),this._updatePositions(o,e)}_updateSegmentTypes(o,e){let i=this.attributes.segmentTypes,n=o?this.isClosed(o):!1,{vertexStart:s,geometrySize:r}=e;i.fill(0,s,s+r),n?(i[s]=Pe,i[s+r-2]=Pe):(i[s]+=vs,i[s+r-2]+=ms),i[s+r-1]=Pe}_updatePositions(o,e){let{positions:i}=this.attributes;if(!i||!o)return;let{vertexStart:n,geometrySize:s}=e,r=new Array(3);for(let a=n,l=0;l<s;a++,l++)this.getPointOnPath(o,l,r),i[a*3]=r[0],i[a*3+1]=r[1],i[a*3+2]=r[2]}getPathLength(o){return o.length/this.positionSize}getPointOnPath(o,e,i=[]){let{positionSize:n}=this;e*n>=o.length&&(e+=1-o.length/n);let s=e*n;return i[0]=o[s],i[1]=o[s+1],i[2]=n===3&&o[s+2]||0,i}isClosed(o){if(!this.normalize)return!!this.opts.loop;let{positionSize:e}=this,i=o.length-e;return o[0]===o[i]&&o[1]===o[i+1]&&(e===2||o[2]===o[i+2])}};function Gi(t){return Array.isArray(t[0])}var ys=`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 Bi=`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 ji={name:`path`,source:ys,vs:Bi,fs:Bi,uniformTypes:{widthScale:`f32`,widthMinPixels:`f32`,widthMaxPixels:`f32`,jointType:`f32`,capType:`f32`,miterLimit:`f32`,billboard:`f32`,widthUnits:`i32`}};var Wi=`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 Ui=`#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 Vi=`#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 Zi=[0,0,0,255];var Ps={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:t=>t.path},getColor:{type:`accessor`,value:Zi},getWidth:{type:`accessor`,value:1},rounded:{deprecatedFor:[`jointRounded`,`capRounded`]}};var vt={enter:(t,o)=>o.length?o.subarray(o.length-t.length):t};function _s(t){if(t.isGeospatial)return null;let{unitsPerMeter:o}=t.distanceScales;return[o[0],o[1],o[2]]}function Hi(t,o){return t===o||!!(t&&o&&t.length===o.length&&t.every((e,i)=>e===o[i]))}var _e=(()=>{class t extends en$1{getShaders(){let{antialiasing:e}=this.props;return super.getShaders({vs:Ui,fs:Vi,source:Wi,defines:e?{ANTIALIASING:1}:{},modules:[Wa,ma,Ka,ji,...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 i=this.props.coordinateSystem;if(!!!this.getAttributeManager()?.getAttributes().instanceDashOffsets)return null;if(e instanceof se&&e.zoom>=12&&(i==="default"||i===`lnglat`||i===`cartesian`)){let a=oe$1.getUniforms({viewport:e,coordinateSystem:i,coordinateOrigin:this.props.coordinateOrigin,autoWrapLongitude:this.wrapLongitude});return[e.projectionMode,a.coordinateOrigin[1],a.commonOrigin[1],...a.commonUnitsPerWorldUnit,...a.commonUnitsPerWorldUnit2,a.commonUnitsPerMeter[2]]}let r=_s(e);return r?[e.projectionMode,...r]:[e.projectionMode]}shouldUpdateState(e){let{viewport:i}=this.context;return super.shouldUpdateState(e)||this.state?.tessellationResolution!==i.resolution||!Hi(this.state?.pathProjectionScale,this.getPathProjectionScale(i))}initializeState(){let i=this.context.device.type===`webgpu`;this.getAttributeManager().addInstanced(s(r({},i?{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:vt,accessor:`getPath`,update:this.calculatePositions,noAlloc:!0,shaderAttributes:{instanceLeftPositions:{vertexOffset:0},instanceStartPositions:{vertexOffset:1},instanceEndPositions:{vertexOffset:2},instanceRightPositions:{vertexOffset:3}}}}),{instanceTypes:{size:1,type:i?`float32`:`uint8`,update:this.calculateSegmentTypes,noAlloc:!0},instanceStrokeWidths:{size:1,accessor:`getWidth`,transition:i?!1:vt,defaultValue:1,bufferGroup:`path-instance-data`},instanceColors:{size:this.props.colorFormat.length,type:`unorm8`,accessor:`getColor`,transition:i?!1:vt,defaultValue:Zi,bufferGroup:`path-instance-data`},rowIndexes:{size:1,type:`uint32`,accessor:(s,{index:r})=>s&&s.__source?s.__source.index:r,bufferGroup:`path-instance-data`}})),this.setState({pathTesselator:new Ue({fp64:this.use64bitPositions(),isWebGPU:i}),tessellationResolution:this.context.viewport.resolution,pathProjectionScale:this.getPathProjectionScale(this.context.viewport)})}updateState(e){super.updateState(e);let{props:i,oldProps:n,changeFlags:s}=e,r=this.getAttributeManager(),{viewport:a}=this.context,l=this.state.tessellationResolution!==a.resolution,c=this.getPathProjectionScale(a),f=!Hi(this.state.pathProjectionScale,c),u=s.updateTriggersChanged&&(s.updateTriggersChanged.all||s.updateTriggersChanged.getPath)||i._pathType!==n._pathType||i.positionFormat!==n.positionFormat||i.wrapLongitude!==n.wrapLongitude||l;if(s.dataChanged||u){let{pathTesselator:g}=this.state,h=i.data.attributes||{};g.updateGeometry({data:i.data,geometryBuffer:h.getPath,buffers:h,normalize:!i._pathType,loop:i._pathType===`loop`,getGeometry:i.getPath,positionFormat:i.positionFormat,wrapLongitude:i.wrapLongitude,resolution:a.resolution,dataChanged:u?void 0:s.dataChanged}),this.setState({numInstances:g.instanceCount,startIndices:g.vertexStarts,tessellationResolution:a.resolution,pathProjectionScale:c}),!s.dataChanged||u?r.invalidateAll():f&&r.invalidate(`instanceDashOffsets`)}else f&&(this.setState({pathProjectionScale:c}),r.invalidate(`instanceDashOffsets`));(s.extensionsChanged||i.antialiasing!==n.antialiasing)&&(this.state.model?.destroy(),this.state.model=this._getModel(),r.invalidateAll())}getPickingInfo(e){let i=super.getPickingInfo(e),{index:n}=i,s=this.props.data;return s[0]&&s[0].__source&&(i.object=s.find(r=>r.__source.index===n)),i}disablePickingIndex(e){let i=this.props.data;if(i[0]&&i[0].__source)for(let n=0;n<i.length;n++)i[n].__source.index===e&&this._disablePickingIndex(n);else super.disablePickingIndex(e)}draw({uniforms:e}){let{jointRounded:i,capRounded:n,billboard:s,miterLimit:r,widthUnits:a,widthScale:l,widthMinPixels:c,widthMaxPixels:f}=this.props,d=this.state.model,u={jointType:Number(i),capType:Number(n),billboard:s,widthUnits:ee[a],widthScale:l,miterLimit:r,widthMinPixels:c,widthMaxPixels:f};d.shaderInputs.setProps({path:u}),d.draw(this.context.renderPass)}_getModel(){return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$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:i}=this.state;e.startIndices=i.vertexStarts,e.value=i.get(`positions`)}calculateSegmentTypes(e){let{pathTesselator:i}=this.state;e.startIndices=i.vertexStarts,e.value=i.get(`segmentTypes`)}calculateWebGPUPositions(e){let{pathTesselator:i}=this.state,n=i.get(`positions`);if(!n){e.value=null;return}let s=i.instanceCount,r=new Float32Array(s*24),a=[-1,0,1,2];for(let l=0;l<s;l++){let c=l*24;for(let f=0;f<4;f++){let d=l+a[f],u=c+f*3;for(let p=0;p<3;p++){let g=d>=0&&d<s?n[d*3+p]:0,h=Math.fround(g);r[u+p]=h,r[u+p+12]=g-h}}}e.startIndices=i.vertexStarts,e.value=r}}return t.defaultProps=Ps,t.layerName=`PathLayer`,t})();var io=x(Xi(),1);var $e=oe.CLOCKWISE;var qi=oe.COUNTER_CLOCKWISE;var $={isClosed:!0};function Ns(t){if(t=t&&t.positions||t,!Array.isArray(t)&&!ArrayBuffer.isView(t))throw new Error(`invalid polygon`)}function re(t){return`positions`in t?t.positions:t}function be(t){return`holeIndices`in t?t.holeIndices:null}function Gs(t){return Array.isArray(t[0])}function Bs(t){return t.length>=1&&t[0].length>=2&&Number.isFinite(t[0][0])}function js(t){let o=t[0],e=t[t.length-1];return o[0]===e[0]&&o[1]===e[1]&&o[2]===e[2]}function Ws(t,o,e,i){for(let n=0;n<o;n++)if(t[e+n]!==t[i-o+n])return!1;return!0}function Qi(t,o,e,i,n){let s=o,r=e.length;for(let a=0;a<r;a++)for(let l=0;l<i;l++)t[s++]=e[a][l]||0;if(!js(e))for(let a=0;a<i;a++)t[s++]=e[0][a]||0;return $.start=o,$.end=s,$.size=i,J(t,n,$),s}function eo(t,o,e,i,n=0,s,r){s=s||e.length;let a=s-n;if(a<=0)return o;let l=o;for(let c=0;c<a;c++)t[l++]=e[n+c];if(!Ws(e,i,n,s))for(let c=0;c<i;c++)t[l++]=e[n+c];return $.start=o,$.end=l,$.size=i,J(t,r,$),l}function Je(t,o){Ns(t);let e=[],i=[];if(`positions`in t){let{positions:n,holeIndices:s}=t;if(s){let r=0;for(let a=0;a<=s.length;a++)r=eo(e,r,n,o,s[a-1],s[a],a===0?$e:qi),i.push(r);return i.pop(),{positions:e,holeIndices:i}}t=n}if(!Gs(t))return eo(e,0,t,o,0,e.length,$e),e;if(!Bs(t)){let n=0;for(let[s,r]of t.entries())n=Qi(e,n,r,o,s===0?$e:qi),i.push(n);return i.pop(),{positions:e,holeIndices:i}}return Qi(e,0,t,o,$e),e}function Ct(t,o,e){let i=t.length/3,n=0;for(let s=0;s<i;s++){let r=(s+1)%i;n+=t[s*3+o]*t[r*3+e],n-=t[r*3+o]*t[s*3+e]}return Math.abs(n/2)}function to(t,o,e,i){let n=t.length/3;for(let s=0;s<n;s++){let r=s*3,a=t[r+0],l=t[r+1],c=t[r+2];t[r+o]=a,t[r+e]=l,t[r+i]=c}}function oo(t,o,e,i){let n=be(t);n&&(n=n.map(a=>a/o));let s=re(t),r=i&&o===3;if(e){let a=s.length;s=s.slice();let l=[];for(let c=0;c<a;c+=o){l[0]=s[c],l[1]=s[c+1],r&&(l[2]=s[c+2]);let f=e(l);s[c]=f[0],s[c+1]=f[1],r&&(s[c+2]=f[2])}}if(r){let a=Ct(s,0,1),l=Ct(s,0,2),c=Ct(s,1,2);if(!a&&!l&&!c)return[];a>l&&a>c||(l>c?(e||(s=s.slice()),to(s,0,2,1)):(e||(s=s.slice()),to(s,2,0,1)))}return(0,io.default)(s,n,o)}var Ye=class extends an{constructor(o){let{fp64:e,IndexType:i=Uint32Array}=o;super(s(r({},o),{attributes:{positions:{size:3,type:e?Float64Array:Float32Array},vertexValid:{type:Uint16Array,size:1},indices:{type:i,size:1}}}))}get(o){let{attributes:e}=this;return o===`indices`?e.indices&&e.indices.subarray(0,this.vertexCount):e[o]}updateGeometry(o){super.updateGeometry(o);let e=this.buffers.indices;if(e)this.vertexCount=(e.value||e).length;else if(this.data&&!this.getGeometry)throw new Error(`missing indices buffer`)}normalizeGeometry(o){if(this.normalize){let e=Je(o,this.positionSize);return this.opts.resolution?ye(re(e),be(e),{size:this.positionSize,gridResolution:this.opts.resolution,edgeTypes:!0}):this.opts.wrapLongitude?ht(re(e),be(e),{size:this.positionSize,maxLatitude:86,edgeTypes:!0}):e}return o}getGeometrySize(o){if(so(o)){let e=0;for(let i of o)e+=this.getGeometrySize(i);return e}return re(o).length/this.positionSize}getGeometryFromBuffer(o){return this.normalize||!this.buffers.indices?super.getGeometryFromBuffer(o):null}updateGeometryAttributes(o,e){if(o&&so(o))for(let i of o){let n=this.getGeometrySize(i);e.geometrySize=n,this.updateGeometryAttributes(i,e),e.vertexStart+=n,e.indexStart=this.indexStarts[e.geometryIndex+1]}else{let i=o;this._updateIndices(i,e),this._updatePositions(i,e),this._updateVertexValid(i,e)}}_updateIndices(o,{geometryIndex:e,vertexStart:i,indexStart:n}){let{attributes:s,indexStarts:r,typedArrayManager:a}=this,l=s.indices;if(!l||!o)return;let c=n,f=oo(o,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]+i;r[e+1]=n+f.length,s.indices=l}_updatePositions(o,{vertexStart:e,geometrySize:i}){let{attributes:{positions:n},positionSize:s}=this;if(!n||!o)return;let r=re(o);for(let a=e,l=0;l<i;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(o,{vertexStart:e,geometrySize:i}){let{positionSize:n}=this,s=this.attributes.vertexValid,r=o&&be(o);if(o&&o.edgeTypes?s.set(o.edgeTypes,e):s.fill(1,e,e+i),r)for(let a=0;a<r.length;a++)s[e+r[a]/n-1]=0;s[e+i-1]=0}};function so(t){return Array.isArray(t)&&t.length>0&&!Number.isFinite(t[0])}var Us=`struct SolidPolygonUniforms {
|
|
3158
|
+
extruded: f32,
|
|
3159
|
+
isWireframe: f32,
|
|
3160
|
+
elevationScale: f32,
|
|
3161
|
+
};
|
|
3162
|
+
|
|
3163
|
+
@group(0) @binding(auto) var<uniform> solidPolygon: SolidPolygonUniforms;
|
|
3164
|
+
`;var ro=`layout(std140) uniform solidPolygonUniforms {
|
|
3165
|
+
bool extruded;
|
|
3166
|
+
bool isWireframe;
|
|
3167
|
+
float elevationScale;
|
|
3168
|
+
} solidPolygon;
|
|
3169
|
+
`;var ao={name:`solidPolygon`,source:Us,vs:ro,fs:ro,uniformTypes:{extruded:`f32`,isWireframe:`f32`,elevationScale:`f32`}};var Xe=`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 lo=`#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
|
+
${Xe}
|
|
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 co=`#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
|
+
${Xe}
|
|
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 fo=`#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 uo(){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 po(){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 Vs(){return`${uo()}
|
|
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
|
+
${po()}
|
|
3391
|
+
`}function Hs(t){return`const RING_WINDING_ORDER_CW: bool = ${t?`true`:`false`};
|
|
3392
|
+
|
|
3393
|
+
${uo()}
|
|
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
|
+
${po()}
|
|
3481
|
+
`}function go(t,o){return t===`top`?Vs():Hs(o)}var Qe=[0,0,0,255];var Zs={filled:!0,extruded:!1,wireframe:!1,_normalize:!0,_windingOrder:`CW`,_full3d:!1,elevationScale:{type:`number`,min:0,value:1},getPolygon:{type:`accessor`,value:t=>t.polygon},getElevation:{type:`accessor`,value:1e3},getFillColor:{type:`accessor`,value:Qe},getLineColor:{type:`accessor`,value:Qe},material:!0};var qe={enter:(t,o)=>o.length?o.subarray(o.length-t.length):t};var we=(()=>{class t extends en$1{getShaders(e){let i=!this.props._normalize&&this.props._windingOrder===`CCW`?0:1;return super.getShaders({vs:e===`top`?lo:co,fs:fo,source:go(e,!!i),defines:{RING_WINDING_ORDER_CW:i},modules:[Wa,ma,Zo$1,Ka,ao,...this.context.device.type===`webgpu`?[ie]:[]]})}get wrapLongitude(){return!1}getBounds(){return this.getAttributeManager()?.getBounds([`vertexPositions`])}initializeState(){let{viewport:e}=this.context,{coordinateSystem:i}=this.props,{_full3d:n}=this.props;e.isGeospatial&&i==="default"&&(i=`lnglat`);let s$6;i===`lnglat`&&(n?s$6=e.projectPosition.bind(e):s$6=e.projectFlat.bind(e)),this.setState({numInstances:0,polygonTesselator:new Ye({preproject:s$6,fp64:this.use64bitPositions(),IndexType:Uint32Array})});let r$7=this.getAttributeManager(),a=!0,l=this.context.device.type===`webgpu`;r$7.add(s(r({indices:{size:1,isIndexed:!0,update:this.calculateIndices,noAlloc:a},vertexPositions:r({size:3,type:`float64`,stepMode:`dynamic`,fp64:this.use64bitPositions(),transition:qe,accessor:`getPolygon`,update:this.calculatePositions,noAlloc:a},l?{}:{shaderAttributes:{nextVertexPositions:{vertexOffset:1}}})},l?{nextVertexPositions:{size:3,type:`float64`,stepMode:`dynamic`,fp64:this.use64bitPositions(),transition:!1,update:this.calculateNextPositions,noAlloc:a}}:{}),{[l?`vertexValid`:`instanceVertexValid`]:{size:1,type:l?`float32`:`uint16`,stepMode:`instance`,update:this.calculateVertexValid,noAlloc:a},elevations:{size:1,stepMode:`dynamic`,transition:qe,accessor:`getElevation`,bufferGroup:`solid-polygon-instance-data`},fillColors:{size:this.props.colorFormat.length,type:`unorm8`,stepMode:`dynamic`,transition:qe,accessor:`getFillColor`,defaultValue:Qe,bufferGroup:`solid-polygon-instance-data`},lineColors:{size:this.props.colorFormat.length,type:`unorm8`,stepMode:`dynamic`,transition:qe,accessor:`getLineColor`,defaultValue:Qe,bufferGroup:`solid-polygon-instance-data`},rowIndexes:{size:1,type:`uint32`,stepMode:`dynamic`,accessor:(c,{index:f})=>c&&c.__source?c.__source.index:f,bufferGroup:`solid-polygon-instance-data`}}))}getPickingInfo(e){let i=super.getPickingInfo(e),{index:n}=i,s=this.props.data;return s[0]&&s[0].__source&&(i.object=s.find(r=>r.__source.index===n)),i}disablePickingIndex(e){let i=this.props.data;if(i[0]&&i[0].__source)for(let n=0;n<i.length;n++)i[n].__source.index===e&&this._disablePickingIndex(n);else super.disablePickingIndex(e)}draw({uniforms:e}){let{extruded:i,filled:n,wireframe:s$7,elevationScale:r$8}=this.props,{topModel:a,sideModel:l,wireframeModel:c,polygonTesselator:f}=this.state,d={extruded:!!i,elevationScale:r$8,isWireframe:!1};c&&s$7&&(c.setInstanceCount(f.instanceCount-1),c.shaderInputs.setProps({solidPolygon:s(r({},d),{isWireframe:!0})}),c.draw(this.context.renderPass)),l&&n&&(l.setInstanceCount(f.instanceCount-1),l.shaderInputs.setProps({solidPolygon:d}),l.draw(this.context.renderPass)),a&&n&&(a.setVertexCount(f.vertexCount),a.shaderInputs.setProps({solidPolygon:d}),a.draw(this.context.renderPass))}updateState(e){super.updateState(e),this.updateGeometry(e);let{props:i,oldProps:n,changeFlags:s}=e,r=this.getAttributeManager();(s.extensionsChanged||i.filled!==n.filled||i.extruded!==n.extruded)&&(this.state.models?.forEach(l=>l.destroy()),this.setState(this._getModels()),r.invalidateAll())}updateGeometry({props:e,oldProps:i,changeFlags:n}){if(n.dataChanged||n.updateTriggersChanged&&(n.updateTriggersChanged.all||n.updateTriggersChanged.getPolygon)){let{polygonTesselator:r$9}=this.state,a=e.data.attributes||{};r$9.updateGeometry({data:e.data,normalize:e._normalize,geometryBuffer:a.getPolygon,buffers:this.context.device.type===`webgpu`?r({},a):a,getGeometry:e.getPolygon,positionFormat:e.positionFormat,wrapLongitude:e.wrapLongitude,resolution:this.context.viewport.resolution,fp64:this.use64bitPositions(),dataChanged:n.dataChanged,full3d:e._full3d}),this.setState({numInstances:r$9.instanceCount,startIndices:r$9.vertexStarts}),n.dataChanged||this.getAttributeManager().invalidateAll()}}_getModels(){let{id:e,filled:i,extruded:n}=this.props,s$8,r$10,a;if(i){let l=this.getShaders(`top`);l.defines=s(r({},l.defines),{NON_INSTANCED_MODEL:1});let c=this.getAttributeManager().getBufferLayouts({isInstanced:!1});this.context.device.type===`webgpu`&&(c=c.filter(f=>f.name!==`indices`&&f.name!==`vertexValid`&&f.name!==`instanceVertexValid`&&f.name!==`nextVertexPositions`)),s$8=new De$1(this.context.device,s(r({},l),{id:`${e}-top`,topology:`triangle-list`,bufferLayout:c,isIndexed:!0,userData:{excludeAttributes:{vertexValid:!0,instanceVertexValid:!0,nextVertexPositions:!0}}}))}if(n){let l=this.getAttributeManager().getBufferLayouts({isInstanced:!0});this.context.device.type===`webgpu`&&(l=l.filter(c=>c.name!==`indices`)),r$10=new De$1(this.context.device,s(r({},this.getShaders(`side`)),{id:`${e}-side`,bufferLayout:l,geometry:new ne$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}}})),a=new De$1(this.context.device,s(r({},this.getShaders(`side`)),{id:`${e}-wireframe`,bufferLayout:l,geometry:new ne$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:[r$10,a,s$8].filter(Boolean),topModel:s$8,sideModel:r$10,wireframeModel:a}}calculateIndices(e){let{polygonTesselator:i}=this.state;e.startIndices=i.indexStarts,e.value=i.get(`indices`)}calculatePositions(e){let{polygonTesselator:i}=this.state;e.startIndices=i.vertexStarts;let n=this.props.data.attributes?.getPolygon;if(this.context.device.type===`webgpu`&&ArrayBuffer.isView(n?.value)){let{value:s,size:r=3,offset:a=0,stride:l}=n,c=a/s.BYTES_PER_ELEMENT,f=l?l/s.BYTES_PER_ELEMENT:r,d=new Float64Array(i.instanceCount*3);for(let u=0;u<i.instanceCount;u++){let p=c+u*f,g=u*3;d[g]=s[p],d[g+1]=s[p+1],d[g+2]=r>2?s[p+2]:0}e.value=d;return}e.value=i.get(`positions`)}calculateVertexValid(e){let i=this.props.data.attributes?.instanceVertexValid?.value,n=this.context.device.type===`webgpu`&&i?i:this.state.polygonTesselator.get(`vertexValid`);e.value=this.context.device.type===`webgpu`&&n?Float32Array.from(n):n}calculateNextPositions(e){let{polygonTesselator:i}=this.state,n=this.getAttributeManager().getAttributes(),s=n.vertexPositions.value,r=this.props.data.attributes?.instanceVertexValid?.value||n.vertexValid?.value||i.get(`vertexValid`);if(e.startIndices=i.vertexStarts,!s){e.value=s;return}let a=s.length/3,l=new s.constructor(s.length);for(let c=0;c<a;c++){let f=c*3,d=r?.[c]&&c+1<a?f+3:f;for(let u=0;u<3;u++)l[f+u]=s[d+u]}e.value=l}}return t.defaultProps=Zs,t.layerName=`SolidPolygonLayer`,t})();function et({data:t,getIndex:o,dataRange:e,replace:i}){let{startRow:n=0,endRow:s=Infinity}=e,r=t.length,a=r,l=r;for(let u=0;u<r;u++){let p=o(t[u]);if(a>u&&p>=n&&(a=u),p>=s){l=u;break}}let c=a,d=l-a!==i.length?t.slice(l):void 0;for(let u=0;u<i.length;u++)t[c++]=i[u];if(d){for(let u=0;u<d.length;u++)t[c++]=d[u];t.length=c}return{startRow:a,endRow:a+i.length}}var ho=[0,0,0,255];var Js={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:t=>t.polygon},getFillColor:{type:`accessor`,value:[0,0,0,255]},getLineColor:{type:`accessor`,value:ho},getLineWidth:{type:`accessor`,value:1},getElevation:{type:`accessor`,value:1e3},material:!0};var Xs=(()=>{class t extends Dm{initializeState(){this.state={paths:[],pathsDiff:null},this.props.getLineDashArray&&A.removed(`getLineDashArray`,`PathStyleExtension`)()}updateState({changeFlags:e}){let i=e.dataChanged||e.updateTriggersChanged&&(e.updateTriggersChanged.all||e.updateTriggersChanged.getPolygon);if(i&&Array.isArray(e.dataChanged)){let n=this.state.paths.slice(),s=e.dataChanged.map(r=>et({data:n,getIndex:a=>a.__source.index,dataRange:r,replace:this._getPaths(r)}));this.setState({paths:n,pathsDiff:s})}else i&&this.setState({paths:this._getPaths(),pathsDiff:null})}_getPaths(e={}){let{data:i,getPolygon:n,positionFormat:s,_normalize:r}=this.props,a=[],l=s===`XY`?2:3,{startRow:c,endRow:f}=e,{iterable:d,objectInfo:u}=Ar(i,c,f);for(let p of d){u.index++;let g=n(p,u);r&&(g=Je(g,l));let{holeIndices:h}=g,v=g.positions||g;if(h)for(let P=0;P<=h.length;P++){let C=v.slice(h[P-1]||0,h[P]||v.length);a.push(this.getSubLayerRow({path:C},p,u.index))}else a.push(this.getSubLayerRow({path:v},p,u.index))}return a}renderLayers(){let{data:e,_dataDiff:i,stroked:n,filled:s,extruded:r,wireframe:a,_normalize:l,_windingOrder:c,elevationScale:f,transitions:d,positionFormat:u}=this.props,{lineWidthUnits:p,lineWidthScale:g,lineWidthMinPixels:h,lineWidthMaxPixels:v,lineJointRounded:P,lineMiterLimit:C,lineAntialiasing:m,lineDashJustified:x}=this.props,{getFillColor:L,getLineColor:N,getLineWidth:G,getLineDashArray:j,getElevation:F,getPolygon:U,updateTriggers:D,material:V}=this.props,{paths:W,pathsDiff:H}=this.state,Q=this.getSubLayerClass(`fill`,we),lt=this.getSubLayerClass(`stroke`,_e),k=this.shouldRenderSubLayer(`fill`,W)&&new Q({_dataDiff:i,extruded:r,elevationScale:f,filled:s,wireframe:a,_normalize:l,_windingOrder:c,getElevation:F,getFillColor:L,getLineColor:r&&a?N:ho,material:V,transitions:d},this.getSubLayerProps({id:`fill`,updateTriggers:D&&{getPolygon:D.getPolygon,getElevation:D.getElevation,getFillColor:D.getFillColor,lineColors:r&&a,getLineColor:D.getLineColor}}),{data:e,positionFormat:u,getPolygon:U}),I=!r&&n&&this.shouldRenderSubLayer(`stroke`,W)&&new lt({_dataDiff:H&&(()=>H),widthUnits:p,widthScale:g,widthMinPixels:h,widthMaxPixels:v,jointRounded:P,miterLimit:C,antialiasing:m,dashJustified:x,_pathType:`loop`,transitions:d&&{getWidth:d.getLineWidth,getColor:d.getLineColor,getPath:d.getPolygon},getColor:this.getSubLayerAccessor(N),getWidth:this.getSubLayerAccessor(G),getDashArray:this.getSubLayerAccessor(j)},this.getSubLayerProps({id:`stroke`,updateTriggers:D&&{getWidth:D.getLineWidth,getColor:D.getLineColor,getDashArray:D.getLineDashArray}}),{data:W,positionFormat:u,getPath:ct=>ct.path});return[!r&&k,I,r&&k]}}return t.layerName=`PolygonLayer`,t.defaultProps=Js,t})();function xo(t,o){if(!t)return null;let e=`startIndices`in t?t.startIndices[o]:o,i=t.featureIds.value[e];return e!==-1?qs(t,i,e):null}function qs(t,o,e){let i={properties:r({},t.properties[o])};for(let n in t.numericProps)i.properties[n]=t.numericProps[n].value[e];return i}function vo(t){let o={points:null,lines:null,polygons:null};for(let e in o){let i=t[e].globalFeatureIds.value;o[e]=new Uint32Array(i)}return o}var mo=`layout(std140) uniform sdfUniforms {
|
|
3482
|
+
float gamma;
|
|
3483
|
+
bool enabled;
|
|
3484
|
+
float buffer;
|
|
3485
|
+
float outlineBuffer;
|
|
3486
|
+
vec4 outlineColor;
|
|
3487
|
+
} sdf;
|
|
3488
|
+
`;var yo={name:`sdf`,vs:mo,fs:mo,uniformTypes:{gamma:`f32`,enabled:`f32`,buffer:`f32`,outlineBuffer:`f32`,outlineColor:`vec4<f32>`}};var Ie={none:0,start:1,center:2,end:3};var tt={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 ${Ie.start}
|
|
3496
|
+
#define ALIGN_MODE_CENTER ${Ie.center}
|
|
3497
|
+
#define ALIGN_MODE_END ${Ie.end}
|
|
3498
|
+
`,getUniforms:({contentCutoffPixels:t=[0,0],contentAlignHorizontal:o=`none`,contentAlignVertical:e=`none`,fontSize:i,viewport:n})=>({cutoffPixels:t,align:[Ie[o],Ie[e]],fontSize:i,flipY:n?.flipY??!1}),uniformTypes:{cutoffPixels:`vec2<f32>`,align:`vec2<i32>`,fontSize:`f32`,flipY:`f32`}};var Po=`#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 _o=`#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 er({collision:t=!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
|
+
${t?`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
|
+
${t?`@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
|
+
${t?`@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
|
+
${t?`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
|
+
${t?`@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
|
+
${t?` 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
|
+
${t?` 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 Co=er();var Lt=192/256;var tr={getIconOffsets:{type:`accessor`,value:t=>t.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 St=(()=>{class t extends ce{getShaders(){let e=super.getShaders();return s(r({},e),{modules:[...e.modules,tt,yo],vs:Po,fs:_o,source:Co})}initializeState(){super.initializeState();let e=this.getAttributeManager(),i=e.attributes.instanceIconDefs;i.settings.update=this.calculateInstanceIconDefs,e.addInstanced({rowIndexes:{type:`uint32`,size:1,bufferGroup:`icon-instance-data`,accessor:(n,{index:s})=>s},instanceClipRect:{size:4,bufferGroup:`icon-instance-data`,accessor:`getContentBox`,defaultValue:[0,0,-1,-1]}})}updateState(e){super.updateState(e);let{props:i,oldProps:n,changeFlags:s}=e,{outlineColor:r}=i;if(s.extensionsChanged){this.state.fillModel?.destroy();let a=this.context.device.type===`webgpu`?this._getModel(`${this.props.id}-fill`):void 0;this.setState({fillModel:a,models:a?[this.state.model,a]:[this.state.model]})}if(s.updateTriggersChanged&&(s.updateTriggersChanged.getIcon||s.updateTriggersChanged.getIconOffsets)&&this.getAttributeManager().invalidate(`instanceIconDefs`),r!==n.outlineColor){let a=[r[0]/255,r[1]/255,r[2]/255,(r[3]??255)/255];this.setState({outlineColor:a})}!i.sdf&&i.outlineWidth&&A.warn(`${this.id}: fontSettings.sdf is required to render outline`)()}draw(e){let{sdf:i,smoothing:n,fontSize:s$9,outlineWidth:r$11,contentCutoffPixels:a,contentAlignHorizontal:l,contentAlignVertical:c}=this.props,{outlineColor:f}=this.state,d=r$11?Math.max(n,Lt*(1-r$11)):-1,u=this.state.model,p={buffer:Lt,outlineBuffer:d,gamma:n,enabled:!!i,outlineColor:f},g={contentCutoffPixels:a,contentAlignHorizontal:l,contentAlignVertical:c,fontSize:s$9,viewport:this.context.viewport};if(u.shaderInputs.setProps({sdf:p,text:g}),super.draw(e),i&&r$11){let{iconManager:h}=this.state;if(h.getTexture()){let P=this.state.fillModel||u;P.shaderInputs.setProps({sdf:s(r({},p),{outlineBuffer:Lt}),text:g}),this._drawModel(P)}}}calculateInstanceIconDefs(e,{startRow:i,endRow:n}){let{data:s,getIcon:r,getIconOffsets:a}=this.props,l=e.getVertexOffset(i),c=e.value,{iterable:f,objectInfo:d}=Ar(s,i,n);for(let u of f){d.index++;let p=r(u,d),g=a(u,d);if(p){let h=0;for(let v of Array.from(p)){let P=super.getInstanceIconDef(v);P[0]=g[h*2],P[1]+=g[h*2+1],P[6]=1,c.set(P,l),l+=e.size,h++}}}}}return t.defaultProps=tr,t.layerName=`MultiIconLayer`,t})();var bt=new Float64Array(256);for(let t=0;t<256;t++){let o=.5-Math.pow(t/255,.45454545454545453);bt[t]=o*Math.abs(o)}bt[255]=-0x56bc75e2d63100000;var it=class{constructor({fontSize:o=24,buffer:e=3,radius:i=8,cutoff:n=.25,fontFamily:s=`sans-serif`,fontWeight:r=`normal`,fontStyle:a=`normal`,lang:l=null}={}){this.buffer=e,this.radius=i,this.cutoff=n,this.lang=l;let c=this.size=o+e*4,f=this._createCanvas(c),d=this.ctx=f.getContext(`2d`,{willReadFrequently:!0});d.font=`${a} ${r} ${o}px ${s}`,d.textBaseline=`alphabetic`,d.textAlign=`left`,d.fillStyle=`black`,this.gridOuter=new Float64Array(c*c),this.gridInner=new Float64Array(c*c),this.f=new Float64Array(c),this.z=new Float64Array(c+1),this.v=new Uint16Array(c)}_createCanvas(o){if(typeof OffscreenCanvas<`u`)return new OffscreenCanvas(o,o);let e=document.createElement(`canvas`);return e.width=e.height=o,e}draw(o){let{width:e,actualBoundingBoxAscent:i,actualBoundingBoxDescent:n,actualBoundingBoxLeft:s,actualBoundingBoxRight:r}=this.ctx.measureText(o),a=Math.ceil(i),l=Math.floor(-s),c=Math.max(0,Math.min(this.size-this.buffer,Math.ceil(r)-l)),f=Math.max(0,Math.min(this.size-this.buffer,a+Math.ceil(n))),d=c+2*this.buffer,u=f+2*this.buffer,p=Math.max(d*u,0),g=new Uint8ClampedArray(p),h={data:g,width:d,height:u,glyphWidth:c,glyphHeight:f,glyphTop:a,glyphLeft:l,glyphAdvance:e};if(c===0||f===0)return h;let{ctx:v,buffer:P,gridInner:C,gridOuter:m}=this;this.lang&&(v.lang=this.lang),v.clearRect(P,P,c,f),v.fillText(o,P-l,P+a);let x=v.getImageData(P,P,c,f);m.fill(0x56bc75e2d63100000,0,p),C.fill(0,0,p);let L=3;for(let F=0;F<f;F++){let U=(F+P)*d+P;for(let D=0;D<c;D++,L+=4,U++){let V=x.data[L];if(V===0)continue;let W=bt[V];m[U]=Math.max(0,W),C[U]=Math.max(0,-W)}}Lo(m,0,0,d,u,d,this.f,this.v,this.z);let N=Math.min(P,1);Lo(C,P-N,P-N,c+2*N,f+2*N,d,this.f,this.v,this.z);let G=255/this.radius,j=255*(1-this.cutoff);for(let F=0;F<p;F++){let U=Math.sqrt(m[F])-Math.sqrt(C[F]);g[F]=Math.round(j-G*U)}return h}};function Lo(t,o,e,i,n,s,r,a,l){for(let c=o;c<o+i;c++)So(t,e*s+c,s,n,r,a,l);for(let c=e;c<e+n;c++)So(t,c*s+o,1,i,r,a,l)}function So(t,o,e,i,n,s,r){s[0]=0,r[0]=-0x56bc75e2d63100000,r[1]=0x56bc75e2d63100000,n[0]=t[o];for(let a=1,l=0,c=0;a<i;a++){n[a]=t[o+a*e];let f=a*a;do{let d=s[l];c=(n[a]-n[d]+f-d*d)/(a-d)/2}while(c<=r[l]&&--l>-1);l++,s[l]=a,r[l]=c,r[l+1]=0x56bc75e2d63100000}for(let a=0,l=0;a<i;a++){for(;r[l+1]<a;)l++;let c=s[l],f=a-c;t[o+a*e]=n[c]+f*f}}var or=32;var nr=[];function sr(t){return Math.pow(2,Math.ceil(Math.log2(t)))}function bo({characterSet:t,measureText:o,buffer:e,maxCanvasWidth:i,mapping:n={},xOffset:s=0,yOffsetMin:r=0,yOffsetMax:a=0}){let c=s,f=r,d=a;for(let u of t)if(!n[u]){let{advance:p,width:g,ascent:h,descent:v}=o(u),P=h+v;c+g+e*2>i&&(c=0,f=d),n[u]={x:c+e,y:f+e,width:g,height:P,advance:p,anchorX:g/2,anchorY:h},c+=g+e*2,d=Math.max(d,f+P+e*2)}return{mapping:n,xOffset:c,yOffsetMin:f,yOffsetMax:d,canvasHeight:sr(d)}}function wo(t,o,e,i){let n=0;for(let s=o;s<e;s++){let r=t[s];n+=i[r]?.advance||0}return n}function Io(t,o,e,i,n,s){let r=o,a=0;for(let l=o;l<e;l++){let c=wo(t,l,l+1,n);a+c>i&&(r<l&&s.push(l),r=l,a=0),a+=c}return a}function rr(t,o,e,i,n,s){let r=o,a=o,l=o,c=0;for(let f=o;f<e;f++)if((t[f]===` `||t[f+1]===` `||f+1===e)&&(l=f+1),l>a){let d=wo(t,a,l,n);c+d>i&&(r<a&&(s.push(a),r=a,c=0),d>i&&(d=Io(t,a,l,i,n,s),r=s[s.length-1])),a=l,c+=d}return c}function ar(t,o,e,i,n=0,s){s===void 0&&(s=t.length);let r=[];return o===`break-all`?Io(t,n,s,e,i,r):rr(t,n,s,e,i,r),r}function lr(t,o,e,i,n,s){let r=0,a=0;for(let l=o;l<e;l++){let f=i[t[l]];f&&(a=Math.max(a,f.height))}for(let l=o;l<e;l++){let c=t[l],f=i[c];f?(n[l]=r+f.anchorX,r+=f.advance):(A.warn(`Missing character: ${c} (${c.codePointAt(0)})`)(),n[l]=r,r+=or)}s[0]=r,s[1]=a}function Ao(t,o,e,i,n,s){let r=Array.from(t),a=r.length,l=new Array(a),c=new Array(a),f=new Array(a),d=(i===`break-word`||i===`break-all`)&&isFinite(n)&&n>0,u=[0,0],p=[0,0],g=0,h=o+e/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?ar(r,i,n,s,v,P):nr;for(let L=0;L<=x.length;L++){let N=L===0?v:x[L-1],G=L<x.length?x[L]:P;lr(r,N,G,s,l,p);for(let j=N;j<G;j++)c[j]=h,f[j]=p[0];g++,h+=e,u[0]=Math.max(u[0],p[0])}v=P}m===`
|
|
3956
|
+
`&&(l[v]=0,c[v]=0,f[v]=0,v++)}return u[1]=g*e,{x:l,y:c,rowWidth:f,size:u}}function Eo({value:t,length:o,stride:e,offset:i,startIndices:n,characterSet:s}){let r=t.BYTES_PER_ELEMENT,a=e?e/r:1,l=i?i/r:0,c=n[o]||Math.ceil((t.length-l)/a),f=s&&new Set,d=new Array(o),u=t;if(a>1||l>0){let p=t.constructor;u=new p(c);for(let g=0;g<c;g++)u[g]=t[g*a+l]}for(let p=0;p<o;p++){let g=n[p],h=n[p+1]||c,v=u.subarray(g,h);d[p]=String.fromCodePoint.apply(null,v),f&&v.forEach(f.add,f)}if(f)for(let p of f)s.add(String.fromCodePoint(p));return{texts:d,characterCount:c}}var Ae=class{constructor(o=5){this._cache={},this._order=[],this.limit=o}get(o){let e=this._cache[o];return e&&(this._deleteOrder(o),this._appendOrder(o)),e}set(o,e){this._cache[o]?(this.delete(o),this._cache[o]=e,this._appendOrder(o)):(Object.keys(this._cache).length===this.limit&&this.delete(this._order[0]),this._cache[o]=e,this._appendOrder(o))}delete(o){this._cache[o]&&(delete this._cache[o],this._deleteOrder(o))}_deleteOrder(o){let e=this._order.indexOf(o);e>=0&&this._order.splice(e,1)}_appendOrder(o){this._order.push(o)}};function cr(){let t=[];for(let o=32;o<128;o++)t.push(String.fromCharCode(o));return t}var q={fontFamily:`Monaco, monospace`,fontWeight:`normal`,characterSet:cr(),fontSize:64,buffer:4,sdf:!1,cutoff:.25,radius:12,smoothing:.1};var To=1024;var Oo=.9;var Ro=.3;var zo=3;var ot=new Ae(zo);function fr(t,o){let e;typeof o==`string`?e=new Set(Array.from(o)):e=new Set(o);let i=ot.get(t);if(!i)return e;for(let n in i.mapping)e.has(n)&&e.delete(n);return e}function dr(t,o){for(let e=0;e<t.length;e++)o.data[4*e+3]=t[e]}function Mo(t,o,e,i){t.font=`${i} ${e}px ${o}`,t.fillStyle=`#000`,t.textBaseline=`alphabetic`,t.textAlign=`left`}function ur(t,o,e){if(e===void 0){let n=t.measureText(`A`);return n.fontBoundingBoxAscent?{advance:0,width:0,ascent:Math.ceil(n.fontBoundingBoxAscent),descent:Math.ceil(n.fontBoundingBoxDescent)}:{advance:0,width:0,ascent:o*Oo,descent:o*Ro}}let i=t.measureText(e);return i.actualBoundingBoxAscent?{advance:i.width,width:Math.ceil(i.actualBoundingBoxRight-i.actualBoundingBoxLeft),ascent:Math.ceil(i.actualBoundingBoxAscent),descent:Math.ceil(i.actualBoundingBoxDescent)}:{advance:i.width,width:i.width,ascent:o*Oo,descent:o*Ro}}function ko(t){A.assert(Number.isFinite(t)&&t>=zo,`Invalid cache limit`),ot=new Ae(t)}var nt=class{constructor(){this.props=r({},q)}get atlas(){return this._atlas}get mapping(){return this._atlas&&this._atlas.mapping}setProps(o={}){Object.assign(this.props,o),o._getFontRenderer&&(this._getFontRenderer=o._getFontRenderer),this._key=this._getKey();let e=fr(this._key,this.props.characterSet),i=ot.get(this._key);if(i&&e.size===0){this._atlas!==i&&(this._atlas=i);return}let n=this._generateFontAtlas(e,i);this._atlas=n,ot.set(this._key,n)}_generateFontAtlas(o,e){let{fontFamily:i,fontWeight:n,fontSize:s,buffer:r$12,sdf:a,radius:l,cutoff:c}=this.props,f=e&&e.data;f||(f=document.createElement(`canvas`),f.width=To);let d=f.getContext(`2d`,{willReadFrequently:!0});Mo(d,i,s,n);let u=x=>ur(d,s,x),p;this._getFontRenderer?p=this._getFontRenderer(this.props):a&&(p={measure:u,draw:pr(this.props)});let{mapping:g,canvasHeight:h,xOffset:v,yOffsetMin:P,yOffsetMax:C}=bo(r({measureText:x=>p?p.measure(x):u(x),buffer:r$12,characterSet:o,maxCanvasWidth:To},e&&{mapping:e.mapping,xOffset:e.xOffset,yOffsetMin:e.yOffsetMin,yOffsetMax:e.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(Mo(d,i,s,n),p)for(let x of o){let L=g[x],N=L.width,{data:G,left:j=0,top:F=0}=p.draw(x),U=L.x-j,D=L.y-F,V=Math.max(0,Math.round(U)),W=Math.max(0,Math.round(D)),H=Math.min(G.width,f.width-V),Q=Math.min(G.height,f.height-W);d.putImageData(G,V,W,0,0,H,Q),L.x=V,L.y=W,L.width=H,L.height=Q,L.anchorX+=H/2-j-N/2,L.anchorY+=F}else for(let x of o){let L=g[x];d.fillText(x,L.x,L.y+L.anchorY)}let m=p?p.measure():u();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:o,fontWeight:e,fontSize:i,buffer:n,sdf:s,radius:r,cutoff:a}=this.props;return s?`${o} ${e} ${i} ${n} ${r} ${a}`:`${o} ${e} ${i} ${n}`}};function pr({fontSize:t,buffer:o,radius:e,cutoff:i,fontFamily:n,fontWeight:s}){let r=new it({fontSize:t,buffer:o,radius:e,cutoff:i,fontFamily:n,fontWeight:`${s}`});return a=>{let{data:l,width:c,height:f}=r.draw(a),d=new ImageData(c,f);return dr(l,d),{data:d,left:o,top:o}}}var gr=`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 Do=`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 Fo={name:`textBackground`,source:gr,vs:Do,fs:Do,uniformTypes:{billboard:`f32`,sizeScale:`f32`,sizeMinPixels:`f32`,sizeMaxPixels:`f32`,borderRadius:`vec4<f32>`,padding:`vec4<f32>`,sizeUnits:`i32`,stroked:`f32`}};var No=`#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 Go=`#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 Bo=`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 hr={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:t=>t.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 wt=(()=>{class t extends en$1{getShaders(){return super.getShaders({vs:No,fs:Go,source:Bo,modules:[Wa,ma,Ka,Fo,tt]})}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:i}=e;i.extensionsChanged&&(this.state.model?.destroy(),this.state.model=this._getModel(),this.getAttributeManager().invalidateAll())}draw({uniforms:e}){let{billboard:i,sizeScale:n,sizeUnits:s,sizeMinPixels:r,sizeMaxPixels:a,getLineWidth:l,fontSize:c}=this.props,{padding:f,borderRadius:d}=this.props;f.length<4&&(f=[f[0],f[1],f[0],f[1]]),Array.isArray(d)||(d=[d,d,d,d]);let u=this.state.model,p={billboard:i,stroked:!!l,borderRadius:d,padding:f,sizeUnits:ee[s],sizeScale:n,sizeMinPixels:r,sizeMaxPixels:a},g={fontSize:c,viewport:this.context.viewport};u.shaderInputs.setProps({textBackground:p,text:g}),u.draw(this.context.renderPass)}_getModel(){return new De$1(this.context.device,s(r({},this.getShaders()),{id:this.props.id,bufferLayout:this.getAttributeManager().getBufferLayouts(),geometry:new ne$1({topology:`triangle-strip`,vertexCount:4,attributes:{positions:{size:2,value:new Float32Array([0,0,1,0,0,1,1,1])}}}),isInstanced:!0}))}}return t.defaultProps=hr,t.layerName=`TextBackgroundLayer`,t})();var jo={start:1,middle:0,end:-1};var Wo={top:1,center:0,bottom:-1};var It=[0,0,0,255];var mr={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:It},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:It},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:t=>t.text},getPosition:{type:`accessor`,value:t=>t.position},getColor:{type:`accessor`,value:It},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 At=(()=>{class t extends Dm{constructor(){super(...arguments),this.getBoundingRect=(e,i)=>{let{size:[n,s]}=this.transformParagraph(e,i),{getTextAnchor:r,getAlignmentBaseline:a}=this.props,l=jo[typeof r==`function`?r(e,i):r],c=Wo[typeof a==`function`?a(e,i):a];return[(l-1)*n/2,(c-1)*s/2,n,s]},this.getIconOffsets=(e,i)=>{let{getTextAnchor:n,getAlignmentBaseline:s}=this.props,{x:r,y:a,rowWidth:l,size:[,c]}=this.transformParagraph(e,i),f=jo[typeof n==`function`?n(e,i):n],d=Wo[typeof s==`function`?s(e,i):s],u=r.length,p=new Array(u*2),g=0;for(let h=0;h<u;h++)p[g++]=(f-1)*l[h]/2+r[h],p[g++]=(d-1)*c/2+a[h];return p}}initializeState(){this.state={styleVersion:0,fontAtlasManager:new nt},this.props.maxWidth>0&&A.once(1,`v8.9 breaking change: TextLayer maxWidth is now relative to text size`)()}updateState(e){let{props:i,oldProps:n,changeFlags:s}=e;(s.dataChanged||s.updateTriggersChanged&&(s.updateTriggersChanged.all||s.updateTriggersChanged.getText))&&this._updateText(),(this._updateFontAtlas()||i.lineHeight!==n.lineHeight||i.wordBreak!==n.wordBreak||i.maxWidth!==n.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:i,fontWeight:n,_getFontRenderer:s$10}=this.props,{fontAtlasManager:r$13,characterSet:a}=this.state,l=s(r({},e),{characterSet:a,fontFamily:i,fontWeight:n,_getFontRenderer:s$10});if(!r$13.mapping)return r$13.setProps(l),!0;for(let c in l)if(l[c]!==r$13.props[c])return r$13.setProps(l),!0;return!1}_updateText(){let{data:e,characterSet:i}=this.props,n=e.attributes?.getText,{getText:s$11}=this.props,r$14=e.startIndices,a,l=i===`auto`&&new Set;if(n&&r$14){let{texts:c,characterCount:f}=Eo(s(r({},ArrayBuffer.isView(n)?{value:n}:n),{length:e.length,startIndices:r$14,characterSet:l}));a=f,s$11=(d,{index:u})=>c[u]}else{let{iterable:c,objectInfo:f}=Ar(e);r$14=[0],a=0;for(let d of c){f.index++;let u=Array.from(s$11(d,f)||``);l&&u.forEach(l.add,l),a+=u.length,r$14.push(a)}}this.setState({getText:s$11,startIndices:r$14,numInstances:a,characterSet:l||i})}transformParagraph(e,i){let{fontAtlasManager:n}=this.state,s=n.mapping,{baselineOffset:r}=n.atlas,{fontSize:a}=n.props,l=this.state.getText,{wordBreak:c,lineHeight:f,maxWidth:d}=this.props;return Ao(l(e,i)||``,r,f*a,c,d*a,s)}renderLayers(){let{startIndices:e,numInstances:i,getText:n,fontAtlasManager:{atlas:s,mapping:r},styleVersion:a}=this.state,{data:l,_dataDiff:c,getPosition:f,getColor:d,getSize:u,getAngle:p,getPixelOffset:g,getBackgroundColor:h,getBorderColor:v,getBorderWidth:P,getContentBox:C,backgroundBorderRadius:m,backgroundPadding:x,background:L,billboard:N,fontSettings:G,outlineWidth:j,outlineColor:F,sizeScale:U,sizeUnits:D,sizeMinPixels:V,sizeMaxPixels:W,contentCutoffPixels:H,contentAlignHorizontal:Q,contentAlignVertical:lt,transitions:k,updateTriggers:I}=this.props,ct=this.getSubLayerClass(`characters`,St),$o=this.getSubLayerClass(`background`,wt),{fontSize:Tt}=this.state.fontAtlasManager.props;return[L&&new $o({getFillColor:h,getLineColor:v,getLineWidth:P,borderRadius:m,padding:x,getPosition:f,getSize:u,getAngle:p,getPixelOffset:g,getClipRect:C,billboard:N,sizeScale:U,sizeUnits:D,sizeMinPixels:V,sizeMaxPixels:W,fontSize:Tt,transitions:k&&{getPosition:k.getPosition,getAngle:k.getAngle,getSize:k.getSize,getFillColor:k.getBackgroundColor,getLineColor:k.getBorderColor,getLineWidth:k.getBorderWidth,getPixelOffset:k.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:a}}}),{data:l.attributes&&l.attributes.background?{length:l.length,attributes:l.attributes.background}:l,_dataDiff:c,autoHighlight:!1,getBoundingRect:this.getBoundingRect}),new ct({sdf:G.sdf,smoothing:Number.isFinite(G.smoothing)?G.smoothing:q.smoothing,outlineWidth:j/(G.radius||q.radius),outlineColor:F,iconAtlas:s,iconMapping:r,getPosition:f,getColor:d,getSize:u,getAngle:p,getPixelOffset:g,getContentBox:C,billboard:N,sizeScale:U,sizeUnits:D,sizeMinPixels:V,sizeMaxPixels:W,fontSize:Tt,contentCutoffPixels:H,contentAlignHorizontal:Q,contentAlignVertical:lt,transitions:k&&{getPosition:k.getPosition,getAngle:k.getAngle,getColor:k.getColor,getSize:k.getSize,getPixelOffset:k.getPixelOffset,getContentBox:k.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:a}}}),{data:l,_dataDiff:c,startIndices:e,numInstances:i,getIconOffsets:this.getIconOffsets,getIcon:n})]}static set fontAtlasCacheLimit(e){ko(e)}}return t.defaultProps=mr,t.layerName=`TextLayer`,t})();var Ee={circle:{type:ut,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:ce,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:At,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 Te={type:_e,props:{lineWidthUnits:`widthUnits`,lineWidthScale:`widthScale`,lineWidthMinPixels:`widthMinPixels`,lineWidthMaxPixels:`widthMaxPixels`,lineJointRounded:`jointRounded`,lineCapRounded:`capRounded`,lineMiterLimit:`miterLimit`,lineBillboard:`billboard`,lineAntialiasing:`antialiasing`,getLineColor:`getColor`,getLineWidth:`getWidth`}};var st={type:we,props:{extruded:`extruded`,filled:`filled`,wireframe:`wireframe`,elevationScale:`elevationScale`,material:`material`,_full3d:`_full3d`,getElevation:`getElevation`,getFillColor:`getFillColor`,getLineColor:`getLineColor`}};function ae({type:t,props:o}){let e={};for(let i in o)e[i]=t.defaultProps[o[i]];return e}function rt(t,o){let{transitions:e,updateTriggers:i}=t.props,n={updateTriggers:{},transitions:e&&{getPosition:e.geometry}};for(let s in o){let r=o[s],a=t.props[s];s.startsWith(`get`)&&(a=t.getSubLayerAccessor(a),n.updateTriggers[r]=i[s],e&&(n.transitions[r]=e[s])),n[r]=a}return n}function Vo(t){if(Array.isArray(t))return t;switch(A.assert(t.type,`GeoJSON does not have type`),t.type){case`Feature`:return[t];case`FeatureCollection`:return A.assert(Array.isArray(t.features),`GeoJSON does not have features array`),t.features;default:return[{geometry:t}]}}function Et(t,o,e={}){let i={pointFeatures:[],lineFeatures:[],polygonFeatures:[],polygonOutlineFeatures:[]},{startRow:n=0,endRow:s=t.length}=e;for(let r=n;r<s;r++){let a=t[r],{geometry:l}=a;if(l)if(l.type===`GeometryCollection`){A.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];Uo(d,i,o,a,r)}}else Uo(l,i,o,a,r)}return i}function Uo(t,o,e,i,n){let{type:s,coordinates:r}=t,{pointFeatures:a,lineFeatures:l,polygonFeatures:c,polygonOutlineFeatures:f}=o;if(!_r(s,r)){A.warn(`${s} coordinates are malformed`)();return}switch(s){case`Point`:a.push(e({geometry:t},i,n));break;case`MultiPoint`:r.forEach(d=>{a.push(e({geometry:{type:`Point`,coordinates:d}},i,n))});break;case`LineString`:l.push(e({geometry:t},i,n));break;case`MultiLineString`:r.forEach(d=>{l.push(e({geometry:{type:`LineString`,coordinates:d}},i,n))});break;case`Polygon`:c.push(e({geometry:t},i,n)),r.forEach(d=>{f.push(e({geometry:{type:`LineString`,coordinates:d}},i,n))});break;case`MultiPolygon`:r.forEach(d=>{c.push(e({geometry:{type:`Polygon`,coordinates:d}},i,n)),d.forEach(u=>{f.push(e({geometry:{type:`LineString`,coordinates:u}},i,n))})});break;default:}}var Pr={Point:1,MultiPoint:2,LineString:2,MultiLineString:3,Polygon:3,MultiPolygon:4};function _r(t,o){let e=Pr[t];for(A.assert(e,`Unknown GeoJSON type ${t}`);o&&--e>0;)o=o[0];return o&&Number.isFinite(o[0])}function Ho(){return{points:{},lines:{},polygons:{},polygonsOutline:{}}}function at(t){return t.geometry.coordinates}function Zo(t,o){let e=Ho(),{pointFeatures:i,lineFeatures:n,polygonFeatures:s,polygonOutlineFeatures:r}=t;return e.points.data=i,e.points._dataDiff=o.pointFeatures&&(()=>o.pointFeatures),e.points.getPosition=at,e.lines.data=n,e.lines._dataDiff=o.lineFeatures&&(()=>o.lineFeatures),e.lines.getPath=at,e.polygons.data=s,e.polygons._dataDiff=o.polygonFeatures&&(()=>o.polygonFeatures),e.polygons.getPolygon=at,e.polygonsOutline.data=r,e.polygonsOutline._dataDiff=o.polygonOutlineFeatures&&(()=>o.polygonOutlineFeatures),e.polygonsOutline.getPath=at,e}function Ko(t){let o=Ho(),{points:e,lines:i,polygons:n}=t,s$12=vo(t);o.points.data={length:e.positions.value.length/e.positions.size,attributes:s(r({},e.attributes),{getPosition:e.positions,rowIndexes:{size:1,type:`uint32`,value:s$12.points}}),properties:e.properties,numericProps:e.numericProps,featureIds:e.featureIds},o.lines.data={length:i.pathIndices.value.length-1,startIndices:i.pathIndices.value,attributes:s(r({},i.attributes),{getPath:i.positions,rowIndexes:{size:1,type:`uint32`,value:s$12.lines}}),properties:i.properties,numericProps:i.numericProps,featureIds:i.featureIds},o.lines._pathType=`open`;let r$15=n.positions.value.length/n.positions.size,a=Array(r$15).fill(1);for(let l of n.primitivePolygonIndices.value)a[l-1]=0;return o.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},o.polygons._normalize=!1,n.triangles&&(o.polygons.data.attributes.indices=n.triangles.value),o.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},o.polygonsOutline._pathType=`open`,o}var Cr=[`points`,`linestrings`,`polygons`];var Lr=s(r(r(r(r(r({},ae(Ee.circle)),ae(Ee.icon)),ae(Ee.text)),ae(Te)),ae(st)),{stroked:!0,filled:!0,extruded:!1,wireframe:!1,_full3d:!1,iconAtlas:{type:`object`,value:null},iconMapping:{type:`object`,value:{}},getIcon:{type:`accessor`,value:t=>t.properties.icon},getText:{type:`accessor`,value:t=>t.properties.text},pointType:`circle`,getRadius:{deprecatedFor:`getPointRadius`}});var br=(()=>{class t extends Dm{initializeState(){this.state={layerProps:{},features:{},featuresDiff:{}}}updateState({props:e,changeFlags:i}){if(!i.dataChanged)return;let{data:n}=this.props,s=n&&`points`in n&&`polygons`in n&&`lines`in n;this.setState({binary:s}),s?this._updateStateBinary({props:e,changeFlags:i}):this._updateStateJSON({props:e,changeFlags:i})}_updateStateBinary({props:e,changeFlags:i}){let n=Ko(e.data);this.setState({layerProps:n})}_updateStateJSON({props:e,changeFlags:i}){let n=Vo(e.data),s=this.getSubLayerRow.bind(this),r={},a={};if(Array.isArray(i.dataChanged)){let c=this.state.features;for(let f in c)r[f]=c[f].slice(),a[f]=[];for(let f of i.dataChanged){let d=Et(n,s,f);for(let u in c)a[u].push(et({data:r[u],getIndex:p=>p.__source.index,dataRange:f,replace:d[u]}))}}else r=Et(n,s);let l=Zo(r,a);this.setState({features:r,featuresDiff:a,layerProps:l})}getPickingInfo(e){let i=super.getPickingInfo(e),{index:n,sourceLayer:s}=i;return i.featureType=Cr.find(r=>s.id.startsWith(`${this.id}-${r}-`)),n>=0&&s.id.startsWith(`${this.id}-points-text`)&&this.state.binary&&(i.index=this.props.data.points.globalFeatureIds.value[n]),i}_updateAutoHighlight(e){let i=`${this.id}-points-`,n=e.featureType===`points`;for(let s of this.getSubLayers())s.id.startsWith(i)===n&&s.updateAutoHighlight(e)}_renderPolygonLayer(){let{extruded:e,wireframe:i}=this.props,{layerProps:n}=this.state,s=`polygons-fill`,r=this.shouldRenderSubLayer(s,n.polygons?.data)&&this.getSubLayerClass(s,st.type);if(r){let a=rt(this,st.props),l=e&&i;return l||delete a.getLineColor,a.updateTriggers.lineColors=l,new r(a,this.getSubLayerProps({id:s,updateTriggers:a.updateTriggers}),n.polygons)}return null}_renderLineLayers(){let{extruded:e,stroked:i}=this.props,{layerProps:n}=this.state,s=`polygons-stroke`,r=`linestrings`,a=!e&&i&&this.shouldRenderSubLayer(s,n.polygonsOutline?.data)&&this.getSubLayerClass(s,Te.type),l=this.shouldRenderSubLayer(r,n.lines?.data)&&this.getSubLayerClass(r,Te.type);if(a||l){let c=rt(this,Te.props);return[a&&new a(c,this.getSubLayerProps({id:s,updateTriggers:c.updateTriggers}),n.polygonsOutline),l&&new l(c,this.getSubLayerProps({id:r,updateTriggers:c.updateTriggers}),n.lines)]}return null}_renderPointLayers(){let{pointType:e}=this.props,{layerProps:i,binary:n}=this.state,{highlightedObjectIndex:s$13}=this.props;!n&&Number.isFinite(s$13)&&(s$13=i.points.data.findIndex(c=>c.__source.index===s$13));let r$16=new Set(e.split(`+`)),a=[];for(let c of r$16){let f=`points-${c}`,d=Ee[c],u$1=d&&this.shouldRenderSubLayer(f,i.points?.data)&&this.getSubLayerClass(f,d.type);if(u$1){let p=rt(this,d.props),g=i.points;if(c===`text`&&n){let l=g.data.attributes,{rowIndexes:h}=l,v=u(l,[`rowIndexes`]);g=s(r({},g),{data:s(r({},g.data),{attributes:v})})}a.push(new u$1(p,this.getSubLayerProps({id:f,updateTriggers:p.updateTriggers,highlightedObjectIndex:s$13}),g))}}return a}renderLayers(){let{extruded:e}=this.props,i=this._renderPolygonLayer(),n=this._renderLineLayers(),s=this._renderPointLayers();return[!e&&i,n,s,e&&i]}getSubLayerAccessor(e){let{binary:i}=this.state;return!i||typeof e!=`function`?super.getSubLayerAccessor(e):(n,s)=>{let{data:r,index:a}=s;return e(xo(r,a),s)}}}return t.layerName=`GeoJsonLayer`,t.defaultProps=Lr,t})();export{xt as _,Xs as a,ce as c,fn as d,ut as f,xs as g,wt as h,Tn as i,de as l,wn as m,Nn as n,_e as o,we as p,St as r,br as s,At as t,en as u};
|
|
4336
|
+
//# debugId=19960610-36c8-5a0b-b972-26302dead612
|