Κεφάλαιο 3 - Ανάπτυξη και Υλοποίηση της Εφαρμογής
63
ανάλογα του αποτελέσματος (Κώδικας 30). Τέλος ο πίνακας μεταφράζεται σε μορφή JSON
εάν δεν έχουμε πάρει τα δεδομένα από το ενδιάμεσο αρχείο και επιστρέφεται ως απάντηση στο
AJAX που εκτέλεσε το σενάριο. Έτσι το πρόγραμμα JavaScript που θα εκτελέσει τις
λειτουργίες του εργαλείου, έχει πλέον τα αποτελέσματα σε μία εύκολα κατανοητή και
επεξεργάσιμη μορφή γι’ αυτό.
3.4.2 Ανάλυση Τεχνικής Σχεδίασης Κυματομορφών
Η κύρια λειτουργία του εργαλείου σχεδίασης κυματομορφών είναι η εμφάνιση των
σημάτων ως κυματομορφές. Η σχεδίαση αυτή γίνεται με την χρήση του στοιχείου ‘canvas’ που
εισάγει η HTML5. Το στοιχείο αυτό μας δίνει την δυνατότητα να σχεδιάσουμε πάνω του
γραφικά μέσω ενός προγράμματος JavaScript. Αξίζει να αναφέρουμε ότι παρόμοιες
δυνατότητες προσφέρει το στοιχείο SVG το οποίο θα είχαμε προτιμήσει εάν δεν χρειαζόμασταν
τις επιπλέον λειτουργίες για την ανάλυση των αποτελεσμάτων. Παρόλα αυτά, καθώς
αποσκοπούμε σε ένα αρκετά δυναμικό εργαλείο του οποίου τα στοιχεία που εμφανίζονται
μπορεί να υποστούν αρκετές αλλαγές κατά την αλληλεπίδρασή τους με τον χρήστη,
καταλήξαμε τελικά στην χρήση του στοιχείου ‘canvas’.
Η εμφάνιση των κυματομορφών χωρίζεται σε δύο μέρη. Στο πρώτο μέρος έχουμε τους
γενικούς υπολογισμούς και την αρχικοποίηση του στοιχείου ‘canvas’ αλλά και τον εξωτερικό
συντονισμό του δεύτερου μέρους όπου προχωράμε στην σχεδίαση κάθε επιλεγμένου κύματος
ξεχωριστά.
1.
var
time_interval
=
1
;
2.
var
x_multi_intervals
=
0
;
3.
var
first_timeframe
=
1
;
4.
var
time_frame
=
signal_data
[
'time_info'
][
'duration'
]
/
(
sig-
nal_data
[
'time_info'
][
'intervals'
]-
1
);
5.
var
second_divisions
=
[
"ds"
,
"cs"
,
"ms"
,
"µs"
,
"ns"
,
"ps"
,
"fs"
,
"as"
,
"zs"
,
"yz"
];
6.
var
second_div_index
=
second_divisions
.
indexOf
(
signal_data
[
'time_in-
fo'
][
'timescale'
]);
7.
var
sub
=
scale_time_subdivisions
(
time_frame
,
0
);
8.
var
second_unit
=
second_divisions
[
second_div_index
-
sub
];
9. max_limit
=
low_limit
+
Math
.
round
(
signal_data
[
'time_info'
][
'inter-
vals'
]*(
$
(
"#simulation_zoom"
).
val
()/
100
)
);
10.
if
(
max_limit
>
signal_data
[
'time_info'
][
'intervals'
]){
11. low_limit
=
low_limit
-
(
max_limit
-
signal_data
[
'time_info'
][
'inter-
vals'
]);
12. max_limit
=
signal_data
[
'time_info'
][
'intervals'
];
13.
}
14.
15. time_interval
=
max_limit
-
low_limit
;
16.
if
(
time_interval
>
9
){
17. time_interval
=
Math
.
round
(
time_interval
/
9
);
18.
}
else
{
19. time_interval
=
1
;
20.
}
Κώδικας 31: waveforms_viewer.js - Αρχικοποιήσεις και υπολογισμοί μεταβλητών για την σχεδίαση των κυματομορφών