-
Notifications
You must be signed in to change notification settings - Fork 0
/
plotly_bubble.js
95 lines (90 loc) · 1.9 KB
/
plotly_bubble.js
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
83
84
85
86
87
88
89
90
91
92
93
94
95
// Deklarasi method bubble
BUBBLE = document.getElementById("bubble");
// Penambahan nilai pada variable trace serta menambahkan mode, warna, dan opacity
var trace1 = {
x: [
"Denmark",
"United Kingdom",
"Saudi Arabia",
"Brazil",
"Kazakhstan",
"Mauritius",
"Argentina",
"Philippines",
"Moldova",
"Hong Kong S.A.R. of China",
"Bulgaria",
"Libya*",
"Liberia*",
"Congo",
"Georgia",
"Venezuela",
"Kenya",
"Myanmar",
"Chad*",
"Lebanon",
],
y: [
"7,636",
"6,943",
"6,523",
"6,293",
"6,234",
"6,071",
"5,967",
"5,904",
"5,857",
"5,425",
"5,371",
"5,33",
"5,122",
"5,075",
"4,973",
"4,925",
"4,543",
"4,394",
"4,251",
"2,955",
],
mode: "markers",
marker: {
color: [
"rgb(93, 164, 214)",
"rgb(255, 144, 14)",
"rgb(44, 160, 101)",
"rgb(255, 65, 54)",
"rgb(93, 164, 214)",
"rgb(255, 144, 14)",
"rgb(44, 160, 101)",
"rgb(255, 65, 54)",
"rgb(93, 164, 214)",
"rgb(255, 144, 14)",
"rgb(44, 160, 101)",
"rgb(255, 65, 54)",
"rgb(93, 164, 214)",
"rgb(255, 144, 14)",
"rgb(44, 160, 101)",
"rgb(255, 65, 54)",
"rgb(93, 164, 214)",
"rgb(255, 144, 14)",
"rgb(44, 160, 101)",
"rgb(255, 65, 54)",
],
opacity: [1, 0.8, 0.6, 0],
size: [
35, 40, 60, 80, 100, 35, 40, 60, 80, 100, 35, 40, 60, 80, 100, 35, 40, 60,
80, 100,
],
},
};
var data = [trace1];
var layout = {
title: "Happiness Score",
showlegend: false,
height: 700,
width: 1400,
};
var config = { responsive: true };
// Deklarasi Javascript dengan menggunakan method dengan passing elemen
// DIV DOM, data array, layout, dan config hash
Plotly.newPlot(BUBBLE, data, layout, config);