Skip to content

Instantly share code, notes, and snippets.

@domoritz

domoritz/.block

Last active November 26, 2019 20:13
Show Gist options
  • Save domoritz/cfdc1c68553a7b942ad3055a63995dd3 to your computer and use it in GitHub Desktop.
Save domoritz/cfdc1c68553a7b942ad3055a63995dd3 to your computer and use it in GitHub Desktop.
Download ZIP
Memory leak
Raw
.block
license: mit
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<script src="https://cdn.jsdelivr.net/npm/vega@5"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-lite@4.0.0-beta.12"></script>
<script src="https://cdn.jsdelivr.net/npm/vega-embed@6"></script>
</head>
<body>
<div id="vis"></div>
<script>
const spec1 = vegaLite.compile({
$schema: "https://vega.github.io/schema/vega-lite/v4.json",
width: 360,
data: {
values: [
{ a: "A", b: 28 },
{ a: "B", b: 55 },
{ a: "C", b: 43 },
{ a: "D", b: 91 },
{ a: "E", b: 81 },
{ a: "F", b: 53 },
{ a: "G", b: 19 },
{ a: "H", b: 87 },
{ a: "I", b: 52 }
]
},
mark: "bar",
encoding: {
x: { field: "a", type: "ordinal" },
y: { field: "b", type: "quantitative" },
tooltip: { field: "b", type: "quantitative" }
}
}).spec;
const spec2 = vegaLite.compile({
$schema: "https://vega.github.io/schema/vega-lite/v4.json",
description: "A simple bar chart with embedded data.",
width: 500,
data: {
values: [
{ a: "A", b: 33 },
{ a: "B", b: 32 },
{ a: "C", b: 16 },
{ a: "D", b: 28 },
{ a: "E", b: 35 },
{ a: "F", b: 81 },
{ a: "G", b: 90 },
{ a: "H", b: 10 },
{ a: "I", b: 5 }
]
},
mark: "bar",
encoding: {
x: { field: "a", type: "ordinal" },
y: { field: "b", type: "quantitative" },
tooltip: { field: "b", type: "quantitative" }
}
}).spec;
let spec = spec1;
let view;
function myFunction() {
setInterval(function() {
if (spec === spec1) spec = spec2;
else spec = spec1;
if (view) {
view.finalize();
}
view = new vega.View(vega.parse(spec), {
container: '#vis'
});
view.runAsync()
// vegaEmbed("#vis", spec)
// .then(function(result) {
// // save view so we can finalize it
// view = result.view;
// })
// .catch(console.warn);
}, 400);
}
</script>
<button onclick="myFunction()">Update</button>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment