signalk-polar-performance-plugin 0.0.17 → 0.0.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/plugin/index.js +15 -3
- package/public/index.html +69 -6
package/package.json
CHANGED
package/plugin/index.js
CHANGED
|
@@ -544,7 +544,19 @@ module.exports = function (app) {
|
|
|
544
544
|
}
|
|
545
545
|
|
|
546
546
|
function getChartData () {
|
|
547
|
-
|
|
547
|
+
var backgroundColor = []
|
|
548
|
+
var borderColor = []
|
|
549
|
+
for (let c = 0; c < 8; c++) {
|
|
550
|
+
let r = 0 + (c*10)
|
|
551
|
+
let g = 130 + (c*20 % 100)
|
|
552
|
+
let b = 80 + (c*30 % 120)
|
|
553
|
+
let color = r + ', ' + g + ', ' + b
|
|
554
|
+
backgroundColor.push('rgba(' + color + ', 1)')
|
|
555
|
+
borderColor.push('rgba(' + color + ', 0.8)')
|
|
556
|
+
}
|
|
557
|
+
app.debug(backgroundColor)
|
|
558
|
+
app.debug(borderColor)
|
|
559
|
+
|
|
548
560
|
|
|
549
561
|
var data = {
|
|
550
562
|
labels: [],
|
|
@@ -560,9 +572,9 @@ module.exports = function (app) {
|
|
|
560
572
|
data.datasets[index] = {
|
|
561
573
|
data: [],
|
|
562
574
|
pointRadius: [],
|
|
563
|
-
|
|
575
|
+
backgroundColor: backgroundColor[index],
|
|
576
|
+
borderColor: borderColor[index],
|
|
564
577
|
fill: false,
|
|
565
|
-
parsing: false,
|
|
566
578
|
label: tws + ' kts'
|
|
567
579
|
}
|
|
568
580
|
for (let twaIndex = 0; twaIndex <= twaArray.length-1; twaIndex++) {
|
package/public/index.html
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<script type='text/javascript' src="./Chart.min.js"></script>
|
|
4
4
|
<script type='text/javascript' src='/jquery/dist/jquery.min.js'></script>
|
|
5
5
|
<title>Polar performance</title>
|
|
6
|
-
<body>
|
|
6
|
+
<body style="background-color:#020202;">
|
|
7
7
|
|
|
8
8
|
<canvas id="myChart" style="width:100%;max-width:1200px"></canvas>
|
|
9
9
|
|
|
@@ -14,32 +14,95 @@ $.getJSON("/plugins/signalk-polar-performance-plugin/chartData", function(json)
|
|
|
14
14
|
|
|
15
15
|
function showChart (data) {
|
|
16
16
|
console.log(data)
|
|
17
|
-
|
|
18
17
|
new Chart("myChart", {
|
|
19
18
|
type: "scatter",
|
|
20
19
|
data: data,
|
|
21
20
|
options: {
|
|
22
|
-
legend: {
|
|
21
|
+
legend: {
|
|
22
|
+
display: true,
|
|
23
|
+
labels: {
|
|
24
|
+
fontSize: 16,
|
|
25
|
+
fontColor: 'white'
|
|
26
|
+
}
|
|
27
|
+
},
|
|
23
28
|
spanGaps: true,
|
|
24
29
|
scales: {
|
|
25
30
|
x: {
|
|
26
|
-
type: 'linear'
|
|
31
|
+
type: 'linear',
|
|
32
|
+
ticks: {
|
|
33
|
+
color: 'white',
|
|
34
|
+
font: {
|
|
35
|
+
size: 14
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
y: {
|
|
40
|
+
type: 'linear',
|
|
41
|
+
ticks: {
|
|
42
|
+
color: 'white',
|
|
43
|
+
font: {
|
|
44
|
+
size: 14
|
|
45
|
+
}
|
|
46
|
+
}
|
|
27
47
|
},
|
|
28
48
|
xAxes: [{
|
|
29
49
|
scaleLabel: {
|
|
30
50
|
display: true,
|
|
31
|
-
labelString: 'True wind angle (TWA)'
|
|
51
|
+
labelString: 'True wind angle (TWA)',
|
|
52
|
+
fontColor: 'white',
|
|
53
|
+
fontSize: 16
|
|
54
|
+
},
|
|
55
|
+
ticks: {
|
|
56
|
+
display: true,
|
|
57
|
+
fontColor: 'white',
|
|
58
|
+
fontSize: 16,
|
|
59
|
+
},
|
|
60
|
+
gridLines: {
|
|
61
|
+
color: 'rgba(180,180,180,0.7)',
|
|
62
|
+
lineWidth: 1
|
|
32
63
|
}
|
|
33
64
|
}],
|
|
34
65
|
yAxes: [{
|
|
35
66
|
scaleLabel: {
|
|
36
67
|
display: true,
|
|
37
|
-
labelString: 'Target boat speed (POL SPD)'
|
|
68
|
+
labelString: 'Target boat speed (POL SPD)',
|
|
69
|
+
fontColor: 'white',
|
|
70
|
+
fontSize: 14
|
|
71
|
+
},
|
|
72
|
+
ticks: {
|
|
73
|
+
display: true,
|
|
74
|
+
fontColor: 'white',
|
|
75
|
+
fontSize: 14,
|
|
76
|
+
},
|
|
77
|
+
gridLines: {
|
|
78
|
+
color: 'rgba(180,180,180,0.7)',
|
|
79
|
+
lineWidth: 1
|
|
38
80
|
}
|
|
39
81
|
}],
|
|
82
|
+
},
|
|
83
|
+
tooltips: {
|
|
84
|
+
enabled: true,
|
|
85
|
+
callbacks: {
|
|
86
|
+
label: function (tooltipItems, data) {
|
|
87
|
+
console.log("tooltipItems: " + JSON.stringify(tooltipItems))
|
|
88
|
+
console.log("data: " + data)
|
|
89
|
+
let label = tooltipItems.xLabel + "° " + tooltipItems.yLabel + " kts"
|
|
90
|
+
return label
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
backgroundColor: '#666',
|
|
94
|
+
titleFontSize: 18,
|
|
95
|
+
titleFontColor: '#0066ff',
|
|
96
|
+
bodyFontColor: '#ddd',
|
|
97
|
+
bodyFontSize: 18,
|
|
98
|
+
displayColors: false
|
|
40
99
|
}
|
|
41
100
|
}
|
|
42
101
|
})
|
|
102
|
+
|
|
103
|
+
var ctx = document.getElementById("myChart")
|
|
104
|
+
ctx.style.backgroundColor = 'rgba(0,0,0,0.8)'
|
|
105
|
+
ctx.style.fontColor = 'white'
|
|
43
106
|
}
|
|
44
107
|
</script>
|
|
45
108
|
|