Κεφάλαιο 3 - Ανάπτυξη και Υλοποίηση της Εφαρμογής
65
1.
if
(
signal_data
[
'length'
]==
1
){
2.
if
(
value
==
-
1
){
3. value
=
old_value
;
4.
}
5.
// fix the pulse height depending the value
6.
if
(
value
==
1
){
7. pulse_height
=-
10
;
8.
}
else
if
(
value
==
0
){
9. pulse_height
=
10
;
10.
}
else
if
(
value
==
'U'
){
11.
// unknown value pulse height : 0, color : red
12. pulse_height
=
0
;
13. ctx
.
strokeStyle
=
"#f00"
;
14.
}
15.
if
(
old_pulse_height
==
-
1
){
16. old_pulse_height
=
pulse_height
;
17.
}
18.
// create the horizontal pulse for this time frame
19. ctx
.
moveTo
(
x
,
y
+
pulse_height
);
20. ctx
.
lineTo
(
x
+
x_interval
,
y
+
pulse_height
);
21.
// create the vertical pulse for this time frame
22. ctx
.
moveTo
(
x
,
y
+
old_pulse_height
);
23. ctx
.
lineTo
(
x
,
y
+
pulse_height
);
Κώδικας 33: waveforms_viewer.js - Σχεδίαση παλμών για σήματα με μήκος ένα
Η σχεδίαση της κυματομορφής διαχωρίζεται σε σχεδίαση σήματος μήκους ενός ψηφίου και
σχεδίαση σήματος με μεγαλύτερο μήκος. Στην πρώτη περίπτωση, παίρνουμε την τωρινή τιμή
του σήματος και θέτουμε το ύψος παλμού αντίστοιχα με αυτή (Κώδικας 33, γραμμές 1-17).
Στην συνέχεια δημιουργούμε τον οριζόντιο παλμό και την κάθετη γραμμή που τον ενώνει με
τον προηγούμενο παλμό (Κώδικας 33, γραμμές 19-23).
Στην δεύτερη περίπτωση όπου έχουμε σήματα με μήκος μεγαλύτερο από ένα ο σχεδιασμός
διαφέρει σημαντικά. Αντί για παλμούς το σήμα αποτελείται από δύο οριζόντιες γραμμές που
πλαισιώνουν την ονομαστική τιμή του σήματος κατά την διάρκειά τους εάν υπάρχει χώρος για
την εμφάνισή του. Έτσι, ελέγχουμε αρχικά εάν υπάρχει αλλαγή τιμής και εάν δεν υπάρχει,
υπολογίζουμε τον διαθέσιμο χώρο και σχεδιάζουμε τις οριζόντιες γραμμές (Κώδικας 34,
γραμμές 1-3 και 31-38). Όταν υπάρξει αλλαγή τιμής μεταφράζουμε την τιμή στον τύπο που θα
εμφανιστεί και μετράμε το απαραίτητο μέγεθος για την εμφάνισή της σε pixel (Κώδικας 34,
γραμμές 6-19). Έπειτα, εάν υπάρχει χώρος, εμφανίζουμε την τιμή του σήματος,
επαναρχικοποιούμε τον διαθέσιμο χώρο και σχεδιάζουμε μία κάθετη γραμμή με έναν κύκλο
στο κέντρο της ώστε να σημειώσουμε οπτικά το σημείο όπου έγινε η αλλαγή (Κώδικας 34,
γραμμές 20-28). Αξίζει εδώ να σημειωθεί ότι σε κάθε αλλαγή εμφανίζουμε την παλιά τιμή,
πράγμα που μας επιτρέπει τον υπολογισμό του διαθέσιμου χώρου κι έτσι παρατηρούμε ότι
προσπερνάμε την πρώτη αλλαγή τιμής (Κώδικας 34, γραμμή 5) ενώ υπάρχει κώδικας στην
συνέχεια του αρχείου που αναλαμβάνει την εμφάνιση της τελευταίας τιμής του σήματος που
θα σχεδιαστεί.