Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -31,3 +31,4 @@ cities.html
assets
atlas.sh
tmp.csv
newtiles
63 changes: 63 additions & 0 deletions dev/Everyone.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<script>
import { Deeptable, Scatterplot } from '../src/deepscatter';
import { onMount } from 'svelte';
import SwitchPositions from './svelte/SwitchPositions.svelte';
import ColorChange from './svelte/ColorChange.svelte';
import SizeSlider from './svelte/SizeSlider.svelte';
import PositionScales from './svelte/PositionScales.svelte';
import SelectPoints from './svelte/SelectPoints.svelte';
const startSize = 0.8;
const prefs = {
max_points: 100000,
alpha: 35, // Target saturation for the full page.
zoom_balance: 0.05, // Rate at which points increase size. https://observablehq.com/@bmschmidt/zoom-strategies-for-huge-scatterplots-with-three-js
point_size: startSize, // Default point size before application of size scaling
background_color: '#EEEDDE',
duration: 100,
encoding: {
x: {
field: 'x',
transform: 'literal',
},
y: {
field: 'y',
transform: 'literal',
},
},
};

let scatterplot = null;
onMount(async () => {
const tb = await Deeptable.fromQuadfeather({
baseUrl: 'http://localhost:8080/everyone',
});
window.tb = tb;
scatterplot = new Scatterplot({ selector: '#deepscatter', deeptable: tb });
window.scatterplot = scatterplot;
scatterplot.plotAPI(prefs);
});
</script>

<div id="overlay">
<!-- <SwitchPositions {scatterplot}></SwitchPositions>
<ColorChange {scatterplot}></ColorChange>
<SizeSlider size={startSize} {scatterplot}></SizeSlider>
<PositionScales {scatterplot} />
<SelectPoints {scatterplot}></SelectPoints> -->
</div>

<div id="deepscatter"></div>

<style>
#overlay {
position: fixed;
z-index: 10;
left: 40px;
top: 40px;
}
#deepscatter {
z-index: 0;
width: 100vw;
height: 100vh;
}
</style>
4 changes: 2 additions & 2 deletions dev/FourClasses.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
import SelectPoints from './svelte/SelectPoints.svelte';
const startSize = 2;
const prefs = {
source_url: '/tiles',
max_points: 1000000,
source_url: '/newtiles',
max_points: 10,
alpha: 35, // Target saturation for the full page.
zoom_balance: 0.22, // Rate at which points increase size. https://observablehq.com/@bmschmidt/zoom-strategies-for-huge-scatterplots-with-three-js
point_size: startSize, // Default point size before application of size scaling
Expand Down
2 changes: 2 additions & 0 deletions dev/Main.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,14 @@

import FourClasses from './FourClasses.svelte';
import SinglePoint from './SinglePoint.svelte';
import Everyone from './Everyone.svelte';
import LabelMaker from './submodules/LabelMaker.svelte';

const modes = {
FourClasses,
SinglePoint,
LabelMaker,
Everyone,
};

$: mode = '';
Expand Down
2 changes: 0 additions & 2 deletions integers.html
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,6 @@
const batch = make_batch(i * SIZE, SIZE);
batches.push(batch);
window.b = batch;
console.log(i);
}
const table = new Table([batches]);
return table;
Expand Down Expand Up @@ -175,7 +174,6 @@
op: 'gt',
a: 0,
};
console.log(JSON.stringify(encoding, null, 2));
plot.plotAPI({
encoding,
});
Expand Down
Loading