Skip to content

Instantly share code, notes, and snippets.

@bojanv55

bojanv55/index.html

Last active September 9, 2021 13:29
Show Gist options
  • Save bojanv55/a2abfe532192121a25343c99aad7e76f to your computer and use it in GitHub Desktop.
Save bojanv55/a2abfe532192121a25343c99aad7e76f to your computer and use it in GitHub Desktop.
Download ZIP
chart.js
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dumber Gist</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
</head>
<!--
Dumber Gist uses dumber bundler, the default bundle file
is /dist/entry-bundle.js.
The starting module is pointed to "index" (data-main attribute on script)
which is your src/index.ts.
-->
<body>
<div id="root"></div>
<script src="/dist/entry-bundle.js" data-main="index"></script>
</body>
</html>
Raw
package.json
{
"dependencies": {
"svelte": "latest",
"chart.js": "^3.5.1",
"chartjs-chart-matrix": "^1.1.0"
}
}
Raw
src\App.svelte
<script lang="ts">
import Mapa3 from './Mapa3.svelte';
export let name: string;
</script>
<main>
<h1>Hello Maps!</h1>
<Mapa3></Mapa3>
</main>
<!--
To use scss: <style lang="scss"> or <style type="text/scss">
To use sass: <style lang="sass"> or <style type="text/sass">
To use less: <style lang="less"> or <style type="text/less">
-->
<style>
h1 {
color: #ff3e00;
}
</style>
Raw
src\data.json
[
{
"x": 1,
"y": 1,
"v": 0
},
{
"x": 1,
"y": 2,
"v": -37.78
},
{
"x": 1,
"y": 3,
"v": 0.66
},
{
"x": 1,
"y": 4,
"v": 0.01
},
{
"x": 1,
"y": 5,
"v": 43.31
},
{
"x": 1,
"y": 6,
"v": 1.91
},
{
"x": 1,
"y": 7,
"v": 40.61
},
{
"x": 1,
"y": 8,
"v": 0
},
{
"x": 1,
"y": 9,
"v": -0.04
},
{
"x": 1,
"y": 10,
"v": 4.33
},
{
"x": 1,
"y": 11,
"v": 0
},
{
"x": 1,
"y": 12,
"v": 0.2
},
{
"x": 1,
"y": 13,
"v": -9.83
},
{
"x": 1,
"y": 14,
"v": 0.25
},
{
"x": 1,
"y": 15,
"v": 1.53
},
{
"x": 1,
"y": 16,
"v": 0
},
{
"x": 1,
"y": 17,
"v": 0
},
{
"x": 1,
"y": 18,
"v": 0.9
},
{
"x": 1,
"y": 19,
"v": 0.79
},
{
"x": 1,
"y": 20,
"v": 0.2
},
{
"x": 1,
"y": 21,
"v": 0
},
{
"x": 1,
"y": 22,
"v": 0
},
{
"x": 1,
"y": 23,
"v": 0
},
{
"x": 2,
"y": 1,
"v": 0
},
{
"x": 2,
"y": 2,
"v": -37.88
},
{
"x": 2,
"y": 3,
"v": 0.88
},
{
"x": 2,
"y": 4,
"v": 0.01
},
{
"x": 2,
"y": 5,
"v": 43.1
},
{
"x": 2,
"y": 6,
"v": 2.18
},
{
"x": 2,
"y": 7,
"v": 36.48
},
{
"x": 2,
"y": 8,
"v": 0
},
{
"x": 2,
"y": 9,
"v": -0.02
},
{
"x": 2,
"y": 10,
"v": 4.4
},
{
"x": 2,
"y": 11,
"v": -0.01
},
{
"x": 2,
"y": 12,
"v": 0.15
},
{
"x": 2,
"y": 13,
"v": -9.99
},
{
"x": 2,
"y": 14,
"v": 0.36
},
{
"x": 2,
"y": 15,
"v": 1.39
},
{
"x": 2,
"y": 16,
"v": 0
},
{
"x": 2,
"y": 17,
"v": 0
},
{
"x": 2,
"y": 18,
"v": 1.05
},
{
"x": 2,
"y": 19,
"v": 0.75
},
{
"x": 2,
"y": 20,
"v": 0.34
},
{
"x": 2,
"y": 21,
"v": 0
},
{
"x": 2,
"y": 22,
"v": 0
},
{
"x": 2,
"y": 23,
"v": 0
},
{
"x": 3,
"y": 1,
"v": 0
},
{
"x": 3,
"y": 2,
"v": -37.23
},
{
"x": 3,
"y": 3,
"v": 1.01
},
{
"x": 3,
"y": 4,
"v": 0.01
},
{
"x": 3,
"y": 5,
"v": 41.91
},
{
"x": 3,
"y": 6,
"v": 2.28
},
{
"x": 3,
"y": 7,
"v": 23.27
},
{
"x": 3,
"y": 8,
"v": 0
},
{
"x": 3,
"y": 9,
"v": -0.03
},
{
"x": 3,
"y": 10,
"v": 5.88
},
{
"x": 3,
"y": 11,
"v": 0
},
{
"x": 3,
"y": 12,
"v": 0.15
},
{
"x": 3,
"y": 13,
"v": -10.03
},
{
"x": 3,
"y": 14,
"v": 0.48
},
{
"x": 3,
"y": 15,
"v": 1.36
},
{
"x": 3,
"y": 16,
"v": 0
},
{
"x": 3,
"y": 17,
"v": -0.01
},
{
"x": 3,
"y": 18,
"v": 1.02
},
{
"x": 3,
"y": 19,
"v": 0.96
},
{
"x": 3,
"y": 20,
"v": 1.57
},
{
"x": 3,
"y": 21,
"v": 0
},
{
"x": 3,
"y": 22,
"v": 0
},
{
"x": 3,
"y": 23,
"v": 0
},
{
"x": 4,
"y": 1,
"v": 0
},
{
"x": 4,
"y": 2,
"v": -31.93
},
{
"x": 4,
"y": 3,
"v": 0.98
},
{
"x": 4,
"y": 4,
"v": 0.01
},
{
"x": 4,
"y": 5,
"v": 38.6
},
{
"x": 4,
"y": 6,
"v": 1.59
},
{
"x": 4,
"y": 7,
"v": 36.04
},
{
"x": 4,
"y": 8,
"v": 0
},
{
"x": 4,
"y": 9,
"v": -0.03
},
{
"x": 4,
"y": 10,
"v": 5.09
},
{
"x": 4,
"y": 11,
"v": 0
},
{
"x": 4,
"y": 12,
"v": 0.15
},
{
"x": 4,
"y": 13,
"v": -9.54
},
{
"x": 4,
"y": 14,
"v": 0.43
},
{
"x": 4,
"y": 15,
"v": 1.16
},
{
"x": 4,
"y": 16,
"v": 0
},
{
"x": 4,
"y": 17,
"v": -0.01
},
{
"x": 4,
"y": 18,
"v": 1.07
},
{
"x": 4,
"y": 19,
"v": 0.93
},
{
"x": 4,
"y": 20,
"v": 2.08
},
{
"x": 4,
"y": 21,
"v": 0
},
{
"x": 4,
"y": 22,
"v": 0
},
{
"x": 4,
"y": 23,
"v": 0
},
{
"x": 5,
"y": 1,
"v": 0
},
{
"x": 5,
"y": 2,
"v": -27.59
},
{
"x": 5,
"y": 3,
"v": 1.04
},
{
"x": 5,
"y": 4,
"v": 0.01
},
{
"x": 5,
"y": 5,
"v": 38.86
},
{
"x": 5,
"y": 6,
"v": 2.08
},
{
"x": 5,
"y": 7,
"v": 31.47
},
{
"x": 5,
"y": 8,
"v": 0
},
{
"x": 5,
"y": 9,
"v": -0.04
},
{
"x": 5,
"y": 10,
"v": 5
},
{
"x": 5,
"y": 11,
"v": 0
},
{
"x": 5,
"y": 12,
"v": 0.15
},
{
"x": 5,
"y": 13,
"v": -11.36
},
{
"x": 5,
"y": 14,
"v": 0.26
},
{
"x": 5,
"y": 15,
"v": 1.37
},
{
"x": 5,
"y": 16,
"v": 0
},
{
"x": 5,
"y": 17,
"v": -0.01
},
{
"x": 5,
"y": 18,
"v": 1.07
},
{
"x": 5,
"y": 19,
"v": 0.72
},
{
"x": 5,
"y": 20,
"v": 1.82
},
{
"x": 5,
"y": 21,
"v": 0
},
{
"x": 5,
"y": 22,
"v": 0
},
{
"x": 5,
"y": 23,
"v": 0
},
{
"x": 6,
"y": 1,
"v": 0
},
{
"x": 6,
"y": 2,
"v": 31.29
},
{
"x": 6,
"y": 3,
"v": 1.05
},
{
"x": 6,
"y": 4,
"v": 0.01
},
{
"x": 6,
"y": 5,
"v": 39.51
},
{
"x": 6,
"y": 6,
"v": 1.95
},
{
"x": 6,
"y": 7,
"v": 39.49
},
{
"x": 6,
"y": 8,
"v": 0
},
{
"x": 6,
"y": 9,
"v": -0.05
},
{
"x": 6,
"y": 10,
"v": 5.18
},
{
"x": 6,
"y": 11,
"v": 0
},
{
"x": 6,
"y": 12,
"v": 0.2
},
{
"x": 6,
"y": 13,
"v": -9.73
},
{
"x": 6,
"y": 14,
"v": 0.05
},
{
"x": 6,
"y": 15,
"v": 1.83
},
{
"x": 6,
"y": 16,
"v": 0
},
{
"x": 6,
"y": 17,
"v": -0.01
},
{
"x": 6,
"y": 18,
"v": 1.04
},
{
"x": 6,
"y": 19,
"v": 0.82
},
{
"x": 6,
"y": 20,
"v": 1.27
},
{
"x": 6,
"y": 21,
"v": 0
},
{
"x": 6,
"y": 22,
"v": 0
},
{
"x": 6,
"y": 23,
"v": 0
},
{
"x": 7,
"y": 1,
"v": 0
},
{
"x": 7,
"y": 2,
"v": 11.78
},
{
"x": 7,
"y": 3,
"v": 0.92
},
{
"x": 7,
"y": 4,
"v": 0.01
},
{
"x": 7,
"y": 5,
"v": 48.86
},
{
"x": 7,
"y": 6,
"v": 2.04
},
{
"x": 7,
"y": 7,
"v": 27.93
},
{
"x": 7,
"y": 8,
"v": 0
},
{
"x": 7,
"y": 9,
"v": 0
},
{
"x": 7,
"y": 10,
"v": 3.78
},
{
"x": 7,
"y": 11,
"v": 0
},
{
"x": 7,
"y": 12,
"v": 0.19
},
{
"x": 7,
"y": 13,
"v": -5.51
},
{
"x": 7,
"y": 14,
"v": 0.01
},
{
"x": 7,
"y": 15,
"v": 2.72
},
{
"x": 7,
"y": 16,
"v": 0
},
{
"x": 7,
"y": 17,
"v": -0.03
},
{
"x": 7,
"y": 18,
"v": 0.93
},
{
"x": 7,
"y": 19,
"v": 1
},
{
"x": 7,
"y": 20,
"v": 4.1
},
{
"x": 7,
"y": 21,
"v": 0
},
{
"x": 7,
"y": 22,
"v": 0
},
{
"x": 7,
"y": 23,
"v": 0
},
{
"x": 8,
"y": 1,
"v": 0
},
{
"x": 8,
"y": 2,
"v": 71.98
},
{
"x": 8,
"y": 3,
"v": 0.69
},
{
"x": 8,
"y": 4,
"v": 0.01
},
{
"x": 8,
"y": 5,
"v": 47.27
},
{
"x": 8,
"y": 6,
"v": 2.24
},
{
"x": 8,
"y": 7,
"v": 50
},
{
"x": 8,
"y": 8,
"v": 0
},
{
"x": 8,
"y": 9,
"v": -0.03
},
{
"x": 8,
"y": 10,
"v": 2.68
},
{
"x": 8,
"y": 11,
"v": 0
},
{
"x": 8,
"y": 12,
"v": 0.35
},
{
"x": 8,
"y": 13,
"v": -3.78
},
{
"x": 8,
"y": 14,
"v": -0.26
},
{
"x": 8,
"y": 15,
"v": 2.54
},
{
"x": 8,
"y": 16,
"v": 0
},
{
"x": 8,
"y": 17,
"v": 0.08
},
{
"x": 8,
"y": 18,
"v": 1.41
},
{
"x": 8,
"y": 19,
"v": 0.77
},
{
"x": 8,
"y": 20,
"v": 0.4
},
{
"x": 8,
"y": 21,
"v": 0
},
{
"x": 8,
"y": 22,
"v": 0
},
{
"x": 8,
"y": 23,
"v": 0
},
{
"x": 9,
"y": 1,
"v": 0
},
{
"x": 9,
"y": 2,
"v": 74.88
},
{
"x": 9,
"y": 3,
"v": 0.65
},
{
"x": 9,
"y": 4,
"v": 0
},
{
"x": 9,
"y": 5,
"v": 44.44
},
{
"x": 9,
"y": 6,
"v": 2.19
},
{
"x": 9,
"y": 7,
"v": 67.4
},
{
"x": 9,
"y": 8,
"v": 0
},
{
"x": 9,
"y": 9,
"v": -0.07
},
{
"x": 9,
"y": 10,
"v": 1.75
},
{
"x": 9,
"y": 11,
"v": 0
},
{
"x": 9,
"y": 12,
"v": 0.27
},
{
"x": 9,
"y": 13,
"v": -5.83
},
{
"x": 9,
"y": 14,
"v": -0.47
},
{
"x": 9,
"y": 15,
"v": 1.9
},
{
"x": 9,
"y": 16,
"v": 0
},
{
"x": 9,
"y": 17,
"v": 0
},
{
"x": 9,
"y": 18,
"v": 1.49
},
{
"x": 9,
"y": 19,
"v": 0.54
},
{
"x": 9,
"y": 20,
"v": 0.14
},
{
"x": 9,
"y": 21,
"v": 0
},
{
"x": 9,
"y": 22,
"v": 0
},
{
"x": 9,
"y": 23,
"v": 0
},
{
"x": 10,
"y": 1,
"v": 0
},
{
"x": 10,
"y": 2,
"v": 66.27
},
{
"x": 10,
"y": 3,
"v": 0.69
},
{
"x": 10,
"y": 4,
"v": 0
},
{
"x": 10,
"y": 5,
"v": 44.99
},
{
"x": 10,
"y": 6,
"v": 2.1
},
{
"x": 10,
"y": 7,
"v": 87.91
},
{
"x": 10,
"y": 8,
"v": 0
},
{
"x": 10,
"y": 9,
"v": -0.03
},
{
"x": 10,
"y": 10,
"v": 2.54
},
{
"x": 10,
"y": 11,
"v": 0
},
{
"x": 10,
"y": 12,
"v": 0.26
},
{
"x": 10,
"y": 13,
"v": -3.41
},
{
"x": 10,
"y": 14,
"v": -0.45
},
{
"x": 10,
"y": 15,
"v": 2.29
},
{
"x": 10,
"y": 16,
"v": 0
},
{
"x": 10,
"y": 17,
"v": 0
},
{
"x": 10,
"y": 18,
"v": 1.44
},
{
"x": 10,
"y": 19,
"v": 0.76
},
{
"x": 10,
"y": 20,
"v": 0.12
},
{
"x": 10,
"y": 21,
"v": 0
},
{
"x": 10,
"y": 22,
"v": 0
},
{
"x": 10,
"y": 23,
"v": 0
},
{
"x": 11,
"y": 1,
"v": 0
},
{
"x": 11,
"y": 2,
"v": 67.65
},
{
"x": 11,
"y": 3,
"v": 0.72
},
{
"x": 11,
"y": 4,
"v": 0
},
{
"x": 11,
"y": 5,
"v": 42.52
},
{
"x": 11,
"y": 6,
"v": 1.98
},
{
"x": 11,
"y": 7,
"v": 94.38
},
{
"x": 11,
"y": 8,
"v": 0
},
{
"x": 11,
"y": 9,
"v": 0.03
},
{
"x": 11,
"y": 10,
"v": 2.66
},
{
"x": 11,
"y": 11,
"v": 0
},
{
"x": 11,
"y": 12,
"v": 0.27
},
{
"x": 11,
"y": 13,
"v": 1.31
},
{
"x": 11,
"y": 14,
"v": -0.23
},
{
"x": 11,
"y": 15,
"v": 2.33
},
{
"x": 11,
"y": 16,
"v": 0
},
{
"x": 11,
"y": 17,
"v": -0.01
},
{
"x": 11,
"y": 18,
"v": 1.25
},
{
"x": 11,
"y": 19,
"v": 0.92
},
{
"x": 11,
"y": 20,
"v": 0.12
},
{
"x": 11,
"y": 21,
"v": 0
},
{
"x": 11,
"y": 22,
"v": 0
},
{
"x": 11,
"y": 23,
"v": 0
},
{
"x": 12,
"y": 1,
"v": 0
},
{
"x": 12,
"y": 2,
"v": 68.4
},
{
"x": 12,
"y": 3,
"v": 0.66
},
{
"x": 12,
"y": 4,
"v": 0
},
{
"x": 12,
"y": 5,
"v": 44.04
},
{
"x": 12,
"y": 6,
"v": 2.03
},
{
"x": 12,
"y": 7,
"v": 119.2
},
{
"x": 12,
"y": 8,
"v": 0
},
{
"x": 12,
"y": 9,
"v": 0.03
},
{
"x": 12,
"y": 10,
"v": 3.06
},
{
"x": 12,
"y": 11,
"v": 0
},
{
"x": 12,
"y": 12,
"v": 0.27
},
{
"x": 12,
"y": 13,
"v": 3.6
},
{
"x": 12,
"y": 14,
"v": -0.47
},
{
"x": 12,
"y": 15,
"v": 2.36
},
{
"x": 12,
"y": 16,
"v": 0
},
{
"x": 12,
"y": 17,
"v": -0.01
},
{
"x": 12,
"y": 18,
"v": 1.26
},
{
"x": 12,
"y": 19,
"v": 0.97
},
{
"x": 12,
"y": 20,
"v": 0.12
},
{
"x": 12,
"y": 21,
"v": 0
},
{
"x": 12,
"y": 22,
"v": 0
},
{
"x": 12,
"y": 23,
"v": 0
},
{
"x": 13,
"y": 1,
"v": 0
},
{
"x": 13,
"y": 2,
"v": 52.39
},
{
"x": 13,
"y": 3,
"v": 0.66
},
{
"x": 13,
"y": 4,
"v": 0.01
},
{
"x": 13,
"y": 5,
"v": 43.86
},
{
"x": 13,
"y": 6,
"v": 2.05
},
{
"x": 13,
"y": 7,
"v": 128.08
},
{
"x": 13,
"y": 8,
"v": 0
},
{
"x": 13,
"y": 9,
"v": 0.06
},
{
"x": 13,
"y": 10,
"v": 3.32
},
{
"x": 13,
"y": 11,
"v": 0
},
{
"x": 13,
"y": 12,
"v": 0.27
},
{
"x": 13,
"y": 13,
"v": 11.89
},
{
"x": 13,
"y": 14,
"v": -0.07
},
{
"x": 13,
"y": 15,
"v": 2.56
},
{
"x": 13,
"y": 16,
"v": 0
},
{
"x": 13,
"y": 17,
"v": 0
},
{
"x": 13,
"y": 18,
"v": 1.28
},
{
"x": 13,
"y": 19,
"v": 0.91
},
{
"x": 13,
"y": 20,
"v": 0.12
},
{
"x": 13,
"y": 21,
"v": 0
},
{
"x": 13,
"y": 22,
"v": 0
},
{
"x": 13,
"y": 23,
"v": 0
},
{
"x": 14,
"y": 1,
"v": 0
},
{
"x": 14,
"y": 2,
"v": 59.52
},
{
"x": 14,
"y": 3,
"v": 0.65
},
{
"x": 14,
"y": 4,
"v": 0.01
},
{
"x": 14,
"y": 5,
"v": 44.18
},
{
"x": 14,
"y": 6,
"v": 2.11
},
{
"x": 14,
"y": 7,
"v": 122.62
},
{
"x": 14,
"y": 8,
"v": 0
},
{
"x": 14,
"y": 9,
"v": 0.08
},
{
"x": 14,
"y": 10,
"v": 3.37
},
{
"x": 14,
"y": 11,
"v": 0.01
},
{
"x": 14,
"y": 12,
"v": 0.27
},
{
"x": 14,
"y": 13,
"v": 10.37
},
{
"x": 14,
"y": 14,
"v": 0.27
},
{
"x": 14,
"y": 15,
"v": 2.45
},
{
"x": 14,
"y": 16,
"v": 0
},
{
"x": 14,
"y": 17,
"v": -0.01
},
{
"x": 14,
"y": 18,
"v": 1.35
},
{
"x": 14,
"y": 19,
"v": 0.95
},
{
"x": 14,
"y": 20,
"v": 0.12
},
{
"x": 14,
"y": 21,
"v": 0
},
{
"x": 14,
"y": 22,
"v": 0
},
{
"x": 14,
"y": 23,
"v": 0
},
{
"x": 15,
"y": 1,
"v": 0
},
{
"x": 15,
"y": 2,
"v": 62.28
},
{
"x": 15,
"y": 3,
"v": 0.59
},
{
"x": 15,
"y": 4,
"v": 0.01
},
{
"x": 15,
"y": 5,
"v": 50.13
},
{
"x": 15,
"y": 6,
"v": 2.44
},
{
"x": 15,
"y": 7,
"v": 119.68
},
{
"x": 15,
"y": 8,
"v": 0
},
{
"x": 15,
"y": 9,
"v": 0.08
},
{
"x": 15,
"y": 10,
"v": 3.59
},
{
"x": 15,
"y": 11,
"v": 0.01
},
{
"x": 15,
"y": 12,
"v": 0.26
},
{
"x": 15,
"y": 13,
"v": 8.06
},
{
"x": 15,
"y": 14,
"v": 0.22
},
{
"x": 15,
"y": 15,
"v": 1.89
},
{
"x": 15,
"y": 16,
"v": 0
},
{
"x": 15,
"y": 17,
"v": 0
},
{
"x": 15,
"y": 18,
"v": 1.26
},
{
"x": 15,
"y": 19,
"v": 0.92
},
{
"x": 15,
"y": 20,
"v": 0.11
},
{
"x": 15,
"y": 21,
"v": 0
},
{
"x": 15,
"y": 22,
"v": 0
},
{
"x": 15,
"y": 23,
"v": 0
},
{
"x": 16,
"y": 1,
"v": -0.01
},
{
"x": 16,
"y": 2,
"v": 72.88
},
{
"x": 16,
"y": 3,
"v": 0.66
},
{
"x": 16,
"y": 4,
"v": 0.01
},
{
"x": 16,
"y": 5,
"v": 52.1
},
{
"x": 16,
"y": 6,
"v": 2.45
},
{
"x": 16,
"y": 7,
"v": 101.12
},
{
"x": 16,
"y": 8,
"v": 0
},
{
"x": 16,
"y": 9,
"v": 0.08
},
{
"x": 16,
"y": 10,
"v": 3.16
},
{
"x": 16,
"y": 11,
"v": 0.01
},
{
"x": 16,
"y": 12,
"v": 0.2
},
{
"x": 16,
"y": 13,
"v": 9.16
},
{
"x": 16,
"y": 14,
"v": -0.11
},
{
"x": 16,
"y": 15,
"v": 1.93
},
{
"x": 16,
"y": 16,
"v": 0
},
{
"x": 16,
"y": 17,
"v": -0.13
},
{
"x": 16,
"y": 18,
"v": 0.99
},
{
"x": 16,
"y": 19,
"v": 0.89
},
{
"x": 16,
"y": 20,
"v": 0.17
},
{
"x": 16,
"y": 21,
"v": 0
},
{
"x": 16,
"y": 22,
"v": 0
},
{
"x": 16,
"y": 23,
"v": 0
},
{
"x": 17,
"y": 1,
"v": 0
},
{
"x": 17,
"y": 2,
"v": 69.8
},
{
"x": 17,
"y": 3,
"v": 0.92
},
{
"x": 17,
"y": 4,
"v": 0.01
},
{
"x": 17,
"y": 5,
"v": 49.43
},
{
"x": 17,
"y": 6,
"v": 2.55
},
{
"x": 17,
"y": 7,
"v": 98.29
},
{
"x": 17,
"y": 8,
"v": 0
},
{
"x": 17,
"y": 9,
"v": 0.08
},
{
"x": 17,
"y": 10,
"v": 2.84
},
{
"x": 17,
"y": 11,
"v": 0.01
},
{
"x": 17,
"y": 12,
"v": 0.2
},
{
"x": 17,
"y": 13,
"v": 7.47
},
{
"x": 17,
"y": 14,
"v": 0.3
},
{
"x": 17,
"y": 15,
"v": 1.59
},
{
"x": 17,
"y": 16,
"v": 0
},
{
"x": 17,
"y": 17,
"v": -0.05
},
{
"x": 17,
"y": 18,
"v": 0.93
},
{
"x": 17,
"y": 19,
"v": 0.93
},
{
"x": 17,
"y": 20,
"v": 0.15
},
{
"x": 17,
"y": 21,
"v": 0
},
{
"x": 17,
"y": 22,
"v": 0
},
{
"x": 17,
"y": 23,
"v": 0
},
{
"x": 18,
"y": 1,
"v": -0.01
},
{
"x": 18,
"y": 2,
"v": 79.65
},
{
"x": 18,
"y": 3,
"v": 0.95
},
{
"x": 18,
"y": 4,
"v": 0.01
},
{
"x": 18,
"y": 5,
"v": 34.34
},
{
"x": 18,
"y": 6,
"v": 2.65
},
{
"x": 18,
"y": 7,
"v": 86.23
},
{
"x": 18,
"y": 8,
"v": 0
},
{
"x": 18,
"y": 9,
"v": 0.08
},
{
"x": 18,
"y": 10,
"v": 2.23
},
{
"x": 18,
"y": 11,
"v": 0
},
{
"x": 18,
"y": 12,
"v": 0.15
},
{
"x": 18,
"y": 13,
"v": -1.2
},
{
"x": 18,
"y": 14,
"v": 0.23
},
{
"x": 18,
"y": 15,
"v": 1.68
},
{
"x": 18,
"y": 16,
"v": 0
},
{
"x": 18,
"y": 17,
"v": -0.08
},
{
"x": 18,
"y": 18,
"v": 1
},
{
"x": 18,
"y": 19,
"v": 0.79
},
{
"x": 18,
"y": 20,
"v": 0.19
},
{
"x": 18,
"y": 21,
"v": 0
},
{
"x": 18,
"y": 22,
"v": 0
},
{
"x": 18,
"y": 23,
"v": 0
},
{
"x": 19,
"y": 1,
"v": 0
},
{
"x": 19,
"y": 2,
"v": 84.06
},
{
"x": 19,
"y": 3,
"v": 0.94
},
{
"x": 19,
"y": 4,
"v": 0
},
{
"x": 19,
"y": 5,
"v": 36.42
},
{
"x": 19,
"y": 6,
"v": 2.6
},
{
"x": 19,
"y": 7,
"v": 50.34
},
{
"x": 19,
"y": 8,
"v": 0
},
{
"x": 19,
"y": 9,
"v": 0.08
},
{
"x": 19,
"y": 10,
"v": 3.52
},
{
"x": 19,
"y": 11,
"v": 0
},
{
"x": 19,
"y": 12,
"v": 0.21
},
{
"x": 19,
"y": 13,
"v": -4.94
},
{
"x": 19,
"y": 14,
"v": -0.06
},
{
"x": 19,
"y": 15,
"v": 2
},
{
"x": 19,
"y": 16,
"v": 0
},
{
"x": 19,
"y": 17,
"v": -0.05
},
{
"x": 19,
"y": 18,
"v": 0.65
},
{
"x": 19,
"y": 19,
"v": 0.64
},
{
"x": 19,
"y": 20,
"v": 0.23
},
{
"x": 19,
"y": 21,
"v": 0
},
{
"x": 19,
"y": 22,
"v": 0
},
{
"x": 19,
"y": 23,
"v": 0
},
{
"x": 20,
"y": 1,
"v": 0
},
{
"x": 20,
"y": 2,
"v": 92.8
},
{
"x": 20,
"y": 3,
"v": 0.96
},
{
"x": 20,
"y": 4,
"v": 0
},
{
"x": 20,
"y": 5,
"v": 36.02
},
{
"x": 20,
"y": 6,
"v": 2.92
},
{
"x": 20,
"y": 7,
"v": 61.08
},
{
"x": 20,
"y": 8,
"v": 0
},
{
"x": 20,
"y": 9,
"v": 0.05
},
{
"x": 20,
"y": 10,
"v": 3.56
},
{
"x": 20,
"y": 11,
"v": 0
},
{
"x": 20,
"y": 12,
"v": 0.21
},
{
"x": 20,
"y": 13,
"v": -7.06
},
{
"x": 20,
"y": 14,
"v": -0.12
},
{
"x": 20,
"y": 15,
"v": 2.41
},
{
"x": 20,
"y": 16,
"v": 0
},
{
"x": 20,
"y": 17,
"v": -0.04
},
{
"x": 20,
"y": 18,
"v": 0.67
},
{
"x": 20,
"y": 19,
"v": 0.49
},
{
"x": 20,
"y": 20,
"v": 0.25
},
{
"x": 20,
"y": 21,
"v": 0
},
{
"x": 20,
"y": 22,
"v": 0
},
{
"x": 20,
"y": 23,
"v": 0
},
{
"x": 21,
"y": 1,
"v": 0
},
{
"x": 21,
"y": 2,
"v": 84.4
},
{
"x": 21,
"y": 3,
"v": 1
},
{
"x": 21,
"y": 4,
"v": 0
},
{
"x": 21,
"y": 5,
"v": 40.38
},
{
"x": 21,
"y": 6,
"v": 2.69
},
{
"x": 21,
"y": 7,
"v": 56.24
},
{
"x": 21,
"y": 8,
"v": 0
},
{
"x": 21,
"y": 9,
"v": -0.01
},
{
"x": 21,
"y": 10,
"v": 4.12
},
{
"x": 21,
"y": 11,
"v": 0
},
{
"x": 21,
"y": 12,
"v": 0.21
},
{
"x": 21,
"y": 13,
"v": -4.94
},
{
"x": 21,
"y": 14,
"v": -0.48
},
{
"x": 21,
"y": 15,
"v": 2.65
},
{
"x": 21,
"y": 16,
"v": 0.01
},
{
"x": 21,
"y": 17,
"v": -0.04
},
{
"x": 21,
"y": 18,
"v": 0.79
},
{
"x": 21,
"y": 19,
"v": 0.55
},
{
"x": 21,
"y": 20,
"v": 0.25
},
{
"x": 21,
"y": 21,
"v": 0
},
{
"x": 21,
"y": 22,
"v": 0
},
{
"x": 21,
"y": 23,
"v": 0
},
{
"x": 22,
"y": 1,
"v": 0
},
{
"x": 22,
"y": 2,
"v": 65.98
},
{
"x": 22,
"y": 3,
"v": 1.13
},
{
"x": 22,
"y": 4,
"v": 0
},
{
"x": 22,
"y": 5,
"v": 34.43
},
{
"x": 22,
"y": 6,
"v": 2.8
},
{
"x": 22,
"y": 7,
"v": 32.88
},
{
"x": 22,
"y": 8,
"v": 0
},
{
"x": 22,
"y": 9,
"v": 0
},
{
"x": 22,
"y": 10,
"v": 5.11
},
{
"x": 22,
"y": 11,
"v": 0
},
{
"x": 22,
"y": 12,
"v": 0.22
},
{
"x": 22,
"y": 13,
"v": -6.35
},
{
"x": 22,
"y": 14,
"v": -0.55
},
{
"x": 22,
"y": 15,
"v": 2.46
},
{
"x": 22,
"y": 16,
"v": 0.01
},
{
"x": 22,
"y": 17,
"v": -0.04
},
{
"x": 22,
"y": 18,
"v": 1
},
{
"x": 22,
"y": 19,
"v": 0.72
},
{
"x": 22,
"y": 20,
"v": 0.25
},
{
"x": 22,
"y": 21,
"v": 0
},
{
"x": 22,
"y": 22,
"v": 0
},
{
"x": 22,
"y": 23,
"v": 0
},
{
"x": 23,
"y": 1,
"v": 0
},
{
"x": 23,
"y": 2,
"v": 45.46
},
{
"x": 23,
"y": 3,
"v": 1.07
},
{
"x": 23,
"y": 4,
"v": 0.01
},
{
"x": 23,
"y": 5,
"v": 49.41
},
{
"x": 23,
"y": 6,
"v": 2.48
},
{
"x": 23,
"y": 7,
"v": 43.96
},
{
"x": 23,
"y": 8,
"v": 0
},
{
"x": 23,
"y": 9,
"v": -0.06
},
{
"x": 23,
"y": 10,
"v": 4.12
},
{
"x": 23,
"y": 11,
"v": 0
},
{
"x": 23,
"y": 12,
"v": 0.22
},
{
"x": 23,
"y": 13,
"v": -4.41
},
{
"x": 23,
"y": 14,
"v": -0.57
},
{
"x": 23,
"y": 15,
"v": 2.74
},
{
"x": 23,
"y": 16,
"v": 0.01
},
{
"x": 23,
"y": 17,
"v": -0.02
},
{
"x": 23,
"y": 18,
"v": 1.24
},
{
"x": 23,
"y": 19,
"v": 0.9
},
{
"x": 23,
"y": 20,
"v": 0.23
},
{
"x": 23,
"y": 21,
"v": 0
},
{
"x": 23,
"y": 22,
"v": 0
},
{
"x": 23,
"y": 23,
"v": 0
},
{
"x": 24,
"y": 1,
"v": 0
},
{
"x": 24,
"y": 2,
"v": 46.79
},
{
"x": 24,
"y": 3,
"v": 0.97
},
{
"x": 24,
"y": 4,
"v": 0.01
},
{
"x": 24,
"y": 5,
"v": 47.88
},
{
"x": 24,
"y": 6,
"v": 2.44
},
{
"x": 24,
"y": 7,
"v": 53.48
},
{
"x": 24,
"y": 8,
"v": 0
},
{
"x": 24,
"y": 9,
"v": -0.03
},
{
"x": 24,
"y": 10,
"v": 5.77
},
{
"x": 24,
"y": 11,
"v": 0.01
},
{
"x": 24,
"y": 12,
"v": 0.22
},
{
"x": 24,
"y": 13,
"v": -7.18
},
{
"x": 24,
"y": 14,
"v": -0.55
},
{
"x": 24,
"y": 15,
"v": 1.82
},
{
"x": 24,
"y": 16,
"v": 0
},
{
"x": 24,
"y": 17,
"v": -0.01
},
{
"x": 24,
"y": 18,
"v": 1.23
},
{
"x": 24,
"y": 19,
"v": 0.89
},
{
"x": 24,
"y": 20,
"v": 0.28
},
{
"x": 24,
"y": 21,
"v": 0
},
{
"x": 24,
"y": 22,
"v": 0
},
{
"x": 24,
"y": 23,
"v": 0
}
]
Raw
src\index.ts
import App from './App.svelte';
import Mapa3 from './Mapa3.svelte';
const app = new Mapa3({
target: document.getElementById('root'),
props: {
name: 'Svelte'
}
});
export default app;
Raw
src\Mapa3.svelte
<script lang="ts">
import {fade, slide, fly} from "svelte/transition";
import dataS from './data.json';
import {
Chart,
CategoryScale,
LinearScale,
BarController,
BarElement,
Legend,
Tooltip, Scale
} from "chart.js";
import {MatrixController,MatrixElement} from "chartjs-chart-matrix";
import {afterUpdate, createEventDispatcher, onMount} from "svelte";
let myChart2 : Chart;
const config2 = {
type: 'matrix',
data: {
datasets: [
{
label: 'IF',
data: dataS,
borderWidth: 0,
borderColor: 'rgba(0,0,0,0.5)',
backgroundColor: 'rgba(200,200,0,0.3)',
width: ({chart}) => (chart.chartArea || {}).width / 24 - 1,
height: ({chart}) => (chart.chartArea || {}).height / 23 - 1,
},
{
hidden: true,
label: 'LF',
data: dataS,
borderWidth: 0,
borderColor: 'rgba(0,0,0,0.5)',
backgroundColor: function(ctx) {
var value = ctx.dataset.data[ctx.dataIndex].v;
var alpha = (value - 5) / 40;
return `rgba(0, 255, 0, ${alpha})`; //alpha is value between 0 and 1; 0 - invisible
},
width: ({chart}) => (chart.chartArea || {}).width / 24 - 1,
height: ({chart}) => (chart.chartArea || {}).height / 23 - 1,
}],
},
options: {
plugins: {
legend: {
onClick: function (e, legendItem) {
var index = legendItem.datasetIndex;
var ci = this.chart;
//var alreadyHidden = (ci.getDatasetMeta(index).hidden === null) ? false : ci.getDatasetMeta(index).hidden;
var alreadyHidden = (legendItem.hidden === null) ? false : legendItem.hidden;
ci.data.datasets.forEach(function (e, i) {
var meta = ci.getDatasetMeta(i);
if(i===index){
//meta.hidden = !alreadyHidden;
e.hidden = !alreadyHidden;
}
else{
//meta.hidden = true;
e.hidden = true;
}
// if (i !== index) {
// if (!alreadyHidden) {
// meta.hidden = meta.hidden === null ? !meta.hidden : null;
// } else if (meta.hidden === null) {
// meta.hidden = true;
// }
// } else if (i === index) {
// meta.hidden = null;
// }
});
ci.update();
},
},
},
scales: {
x: {
grid: {
display: false,
},
display: true,
min: 0.5,
max: 24.5, //kad je x max 5 odje je 5.5
offset: false,
//stepSize: 1,
ticks: {
precision: 0,
stepSize: 1,
// Include a dollar sign in the ticks
callback: function(value, index, values) {
if(value>24){
return "";
}
if(index%2!=0){
return null;
}
return '$' + value;
}
}
},
y: {
grid: {
display: false,
},
display: true,
min: 0.5,
max: 23.5, //kad je x max 3 odje je 3.5
ticks: {
precision: 0,
stepSize: 1,
// Include a dollar sign in the ticks
callback: function(value, index, values) {
// if(value>23){
// return null;
// }
/*if(index%2==0){
return null;
}*/
let s = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "Z"].reverse();
return s[index];
}
},
}
}
}
};
onMount(() => {
Chart.register(CategoryScale, LinearScale, BarController, BarElement, Legend, Tooltip, MatrixController, MatrixElement);
myChart2 = new Chart(
document.getElementById('map2'),
config2
);
});
</script>
<div class="mapa2">
<canvas id="map2"></canvas>
</div>
<style>
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment