/
cartesian.ts
82 lines (69 loc) · 2.07 KB
/
cartesian.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
import { DrawCommand } from "regl";
import { Vector2 } from "../common";
import { CoordinateSystem, Kind } from "./coordinate-system";
import { LinearScale } from "../scales/linear";
import { LogScale } from "../scales/log";
import { CandyGraph } from "../candygraph";
interface Props {
xdomain: Vector2;
ydomain: Vector2;
xrange: Vector2;
yrange: Vector2;
}
export class CartesianCoordinateSystem extends CoordinateSystem {
/** @internal */
public readonly glsl: string;
/** @internal */
public readonly kind = Kind.Cartesian;
/** @internal */
public readonly scope: DrawCommand;
constructor(
cg: CandyGraph,
public readonly xscale: LinearScale | LogScale,
public readonly yscale: LinearScale | LogScale
) {
super();
this.scope = cg.regl({
uniforms: {
xdomain: cg.regl.prop<Props, "xdomain">("xdomain"),
ydomain: cg.regl.prop<Props, "ydomain">("ydomain"),
xrange: cg.regl.prop<Props, "xrange">("xrange"),
yrange: cg.regl.prop<Props, "yrange">("yrange"),
},
});
const xglsl = xscale.glsl.replace("toDomain", "toXDomain").replace("toRange", "toXRange");
const yglsl = yscale.glsl.replace("toDomain", "toYDomain").replace("toRange", "toYRange");
this.glsl = `
uniform vec2 xdomain, ydomain;
uniform vec2 xrange, yrange;
${xglsl}
${yglsl}
vec2 toRange(vec2 v) {
return vec2(
toXRange(v.x, xdomain, xrange),
toYRange(v.y, ydomain, yrange)
);
}
vec2 toDomain(vec2 v) {
return vec2(
toXDomain(v.x, xdomain, xrange),
toYDomain(v.y, ydomain, yrange)
);
}`;
}
public toRange(v: Vector2): Vector2 {
return [this.xscale.toRange(v[0]), this.yscale.toRange(v[1])];
}
public toDomain(v: Vector2): Vector2 {
return [this.xscale.toDomain(v[0]), this.yscale.toDomain(v[1])];
}
/** @internal */
public props(): Props {
return {
xdomain: this.xscale.domain,
ydomain: this.yscale.domain,
xrange: this.xscale.range,
yrange: this.yscale.range,
};
}
}