0
# Real-time Visualization
1

2
The PanamaHitek_Arduino library provides comprehensive real-time visualization components using JFreeChart. It includes dial charts, thermometer displays, and time-series plots that can automatically follow Arduino data streams or be updated manually.
3

4
## Chart Type Constants
5

6
```java { .api }
7
// Single dial chart types
8
public static final int ROUND_DIAL_CHART = 1;
9
public static final int HORIZONTAL_DIAL_CHART = 2;
10
public static final int VERTICAL_DIAL_CHART = 3;
11

12
// Dual dial positions
13
public static final int OUTER_DIAL = 1;
14
public static final int INNER_DIAL = 2;
15
public static final int LEFT_DIAL = 1;
16
public static final int RIGHT_DIAL = 2;
17

18
// Thermometer plot types
19
public static final int ROUND_DIAL_PLOT = 1;
20
public static final int HORIZONTAL_DIAL_PLOT = 2;
21
public static final int VERTICAL_DIAL_PLOT = 3;
22
```
23

24
## Single Dial Chart
25

26
The `PanamaHitek_SingleDialChart` class provides single-dial gauge visualization with multiple display modes and color zones.
27

28
### Constructor
29

30
```java { .api }
31
public class PanamaHitek_SingleDialChart {
32
    public PanamaHitek_SingleDialChart(int chartType);
33
    public PanamaHitek_SingleDialChart(int chartType, String chartTitle);
34
    public PanamaHitek_SingleDialChart(int chartType, String chartTitle, String variableName);
35
}
36
```
37

38
**Parameters:**
39
- `chartType` - Type of dial chart (ROUND_DIAL_CHART, HORIZONTAL_DIAL_CHART, or VERTICAL_DIAL_CHART)
40
- `chartTitle` - Title displayed on the chart
41
- `variableName` - Name of the variable being displayed
42

43
### Configuration Methods
44

45
```java { .api }
46
public void setChartTitle(String title);
47
public void setChartVariableName(String variableName);
48
public void setChartLimitValues(int minValue, int maxValue);
49
public void setChartMajorDivisions(int majorDivisions);
50
public void setChartMinorDivisions(int minorDivisions);
51
public void setColorDistribuition(int firstArea, int secondArea, int thirdArea) throws Exception;
52
```
53

54
**Color Distribution:**
55
- Three color zones that must total 100%
56
- `firstArea` - Percentage for first color zone (typically green/good)
57
- `secondArea` - Percentage for second color zone (typically yellow/warning)
58
- `thirdArea` - Percentage for third color zone (typically red/critical)
59

60
### Data Updates
61

62
```java { .api }
63
public void setValue(double value);
64
```
65

66
Updates the dial value in real-time.
67

68
### Display Methods
69

70
```java { .api }
71
public JPanel getChartPanel();
72
public void insertToPanel(JPanel panel);
73
```
74

75
### Arduino Integration
76

77
```java { .api }
78
public void createArduinoFollowUp(String PORT_NAME, int DATA_RATE) throws ArduinoException, SerialPortException;
79
public void stopArduinoFollowUp() throws ArduinoException;
80
```
81

82
**Usage Example:**
83

84
```java
85
import com.panamahitek.liveinterfaces.PanamaHitek_SingleDialChart;
86
import javax.swing.*;
87

88
public class SingleDialExample extends JFrame {
89

90
    private PanamaHitek_SingleDialChart speedDial;
91

92
    public void setupSpeedometer() {
93
        // Create round dial speedometer
94
        speedDial = new PanamaHitek_SingleDialChart(
95
            PanamaHitek_SingleDialChart.ROUND_DIAL_CHART,
96
            "Vehicle Speed",
97
            "Speed (km/h)"
98
        );
99

100
        try {
101
            // Configure dial settings
102
            speedDial.setChartLimitValues(0, 200);
103
            speedDial.setChartMajorDivisions(10);
104
            speedDial.setChartMinorDivisions(5);
105

106
            // Set color zones: 60% green, 25% yellow, 15% red
107
            speedDial.setColorDistribuition(60, 25, 15);
108

109
            // Add to GUI
110
            JPanel mainPanel = new JPanel();
111
            speedDial.insertToPanel(mainPanel);
112
            add(mainPanel);
113

114
            // Start automatic Arduino following
115
            speedDial.createArduinoFollowUp("COM3", 9600);
116

117
        } catch (Exception ex) {
118
            System.err.println("Speedometer setup error: " + ex.getMessage());
119
        }
120
    }
121

122
    // Manual update example
123
    public void updateSpeed(double newSpeed) {
124
        speedDial.setValue(newSpeed);
125
    }
126
}
127
```
128

129
## Dual Dial Chart
130

131
The `PanamaHitek_DualDialChart` class displays two gauge dials simultaneously, perfect for showing related measurements.
132

133
### Constructor
134

135
```java { .api }
136
public class PanamaHitek_DualDialChart {
137
    public PanamaHitek_DualDialChart();
138
    public PanamaHitek_DualDialChart(String chartTitle);
139
    public PanamaHitek_DualDialChart(String chartTitle, String variableName);
140
}
141
```
142

143
### Configuration Methods
144

145
```java { .api }
146
public void setPlotTitle(String title);
147
public void setChartVariableName(String variableName);
148
public void setChartTopLimitValues(int topValue1, int topValue2);
149
public void setChartBottonLimitValues(int topValue1, int topValue2);
150
public void setChartMajorDivisions(int valueChart1, int valueChart2);
151
public void setChartMinorDivisions(int valueChart1, int valueChart2);
152
```
153

154
### Data Updates
155

156
```java { .api }
157
public void setValue(double value1, double value2);
158
```
159

160
Updates both dials simultaneously.
161

162
### Display and Arduino Integration
163

164
```java { .api }
165
public JPanel getChartPanel();
166
public void insertToPanel(JPanel panel);
167
public void createArduinoFollowUp(String PORT_NAME, int DATA_RATE) throws ArduinoException, SerialPortException;
168
public void stopArduinoFollowUp() throws ArduinoException;
169
```
170

171
**Usage Example:**
172

173
```java
174
import com.panamahitek.liveinterfaces.PanamaHitek_DualDialChart;
175

176
public class DualDialExample {
177

178
    public void setupTemperatureHumidity() {
179
        PanamaHitek_DualDialChart climate = new PanamaHitek_DualDialChart(
180
            "Climate Monitor", "Temperature & Humidity");
181

182
        // Configure ranges for temperature (-10 to 50°C) and humidity (0 to 100%)
183
        climate.setChartTopLimitValues(50, 100);
184
        climate.setChartBottonLimitValues(-10, 0);
185
        climate.setChartMajorDivisions(6, 10);
186
        climate.setChartMinorDivisions(2, 2);
187

188
        try {
189
            // Start Arduino data following (expects 2 values per message)
190
            climate.createArduinoFollowUp("COM3", 9600);
191

192
            // Manual update example
193
            climate.setValue(23.5, 65.2); // 23.5°C, 65.2% humidity
194

195
        } catch (Exception ex) {
196
            System.err.println("Climate monitor error: " + ex.getMessage());
197
        }
198
    }
199
}
200
```
201

202
## Thermometer Chart
203

204
The `PanamaHitek_ThermometerChart` class provides thermometer-style visualization with temperature unit support.
205

206
### Constructor
207

208
```java { .api }
209
public class PanamaHitek_ThermometerChart {
210
    public PanamaHitek_ThermometerChart();
211
    public PanamaHitek_ThermometerChart(String plotTitle);
212
}
213
```
214

215
### Configuration Methods
216

217
```java { .api }
218
public void setChartLimitValues(int minValue, int maxValue);
219
public void setColorDistribuition(int firstArea, int secondArea, int thirdArea) throws Exception;
220
public void setThermometerUnit(int unit);
221
```
222

223
**Temperature Units:**
224
- CELSIUS, FAHRENHEIT, KELVIN, NONE (constants from JFreeChart)
225

226
### Data and Display Methods
227

228
```java { .api }
229
public void setValue(double value);
230
public JPanel getPlotPanel();
231
public void insertToPanel(JPanel panel);
232
public void createArduinoFollowUp(String PORT_NAME, int DATA_RATE) throws ArduinoException, SerialPortException;
233
public void stopArduinoFollowUp() throws ArduinoException;
234
```
235

236
**Usage Example:**
237

238
```java
239
import com.panamahitek.liveinterfaces.PanamaHitek_ThermometerChart;
240
import org.jfree.chart.plot.ThermometerPlot;
241

242
public class ThermometerExample {
243

244
    public void setupTemperatureMonitor() {
245
        PanamaHitek_ThermometerChart tempChart = new PanamaHitek_ThermometerChart("Room Temperature");
246

247
        try {
248
            // Configure temperature range (0-50°C)
249
            tempChart.setChartLimitValues(0, 50);
250

251
            // Set color zones: 40% blue (cold), 40% green (normal), 20% red (hot)
252
            tempChart.setColorDistribuition(40, 40, 20);
253

254
            // Set temperature unit to Celsius
255
            tempChart.setThermometerUnit(ThermometerPlot.UNITS_CELSIUS);
256

257
            // Start automatic updates from Arduino
258
            tempChart.createArduinoFollowUp("COM3", 9600);
259

260
        } catch (Exception ex) {
261
            System.err.println("Temperature monitor error: " + ex.getMessage());
262
        }
263
    }
264
}
265
```
266

267
## Time-Series Chart
268

269
The `PanamaHitek_TimeLineChart` class creates time-series line plots that can display multiple data series from a data buffer.
270

271
### Constructor
272

273
```java { .api }
274
public class PanamaHitek_TimeLineChart {
275
    public PanamaHitek_TimeLineChart();
276
}
277
```
278

279
### Data Buffer Configuration
280

281
```java { .api }
282
public void setDataBuffer(PanamaHitek_DataBuffer buffer) throws Exception;
283
public void setDataBuffer(PanamaHitek_DataBuffer buffer, int index) throws Exception;
284
public void setDataBuffer(PanamaHitek_DataBuffer buffer, Integer[] bufferIndexes) throws Exception;
285
```
286

287
**Parameters:**
288
- `buffer` - Data buffer containing time-series data
289
- `index` - Single column index to plot
290
- `bufferIndexes` - Array of column indexes to plot multiple series
291

292
### Chart Configuration
293

294
```java { .api }
295
public void setChartTitle(String title);
296
public void setAxisTitle(String titleAxisX, String titleAxisY);
297
public void setTimeAxisFormat(SimpleDateFormat format);
298
public void setDateAxisVerticalLabel(boolean flag);
299
public void setMaximumItemCount(int itemCount) throws Exception;
300
```
301

302
### Appearance Methods
303

304
```java { .api }
305
public void setLineColor(int serieIndex, Color color) throws Exception;
306
public void setLineThickness(int serieIndex, int thickness) throws Exception;
307
public void setLineStroke(int serieIndex, Stroke stroke) throws Exception;
308
public void setBackgroundColor(Color color);
309
public void setGridLinesColor(Color color);
310
public void setGridLinesVisible(boolean visible);
311
public void setLinesMarksVisible(boolean visible);
312
```
313

314
### Range and Display Methods
315

316
```java { .api }
317
public void setHorizontalAxisRange(double lower, double upper);
318
public void setVerticalAxisRange(double lower, double upper);
319
public JPanel getChartPanel();
320
public void insertToPanel(JPanel panel);
321
public JFreeChart getChartObject();
322
public void cleanDataSeries();
323
```
324

325
**Complete Usage Example:**
326

327
```java
328
import com.panamahitek.liveinterfaces.PanamaHitek_TimeLineChart;
329
import com.panamahitek.PanamaHitek_DataBuffer;
330
import java.awt.Color;
331
import java.text.SimpleDateFormat;
332

333
public class TimeLineExample extends JFrame {
334

335
    private PanamaHitek_TimeLineChart timeChart;
336
    private PanamaHitek_DataBuffer dataBuffer;
337

338
    public void setupTimeSeriesChart() {
339
        // Setup data buffer
340
        dataBuffer = new PanamaHitek_DataBuffer();
341
        dataBuffer.setDateFormat("HH:mm:ss");
342

343
        try {
344
            // Define data structure
345
            dataBuffer.addTimeColumn(0, "Time");
346
            dataBuffer.addColumn(1, "Temperature", Double.class);
347
            dataBuffer.addColumn(2, "Pressure", Double.class);
348
            dataBuffer.addColumn(3, "Humidity", Double.class);
349

350
            // Create time-series chart
351
            timeChart = new PanamaHitek_TimeLineChart();
352

353
            // Configure chart appearance
354
            timeChart.setChartTitle("Environmental Monitoring");
355
            timeChart.setAxisTitle("Time", "Values");
356
            timeChart.setTimeAxisFormat(new SimpleDateFormat("HH:mm:ss"));
357

358
            // Set data buffer to plot columns 1, 2, 3 (temperature, pressure, humidity)
359
            timeChart.setDataBuffer(dataBuffer, new Integer[]{1, 2, 3});
360

361
            // Customize line appearance
362
            timeChart.setLineColor(0, Color.RED);     // Temperature - red
363
            timeChart.setLineColor(1, Color.BLUE);    // Pressure - blue
364
            timeChart.setLineColor(2, Color.GREEN);   // Humidity - green
365

366
            timeChart.setLineThickness(0, 2);
367
            timeChart.setLineThickness(1, 2);
368
            timeChart.setLineThickness(2, 2);
369

370
            // Configure display options
371
            timeChart.setGridLinesVisible(true);
372
            timeChart.setLinesMarksVisible(true);
373
            timeChart.setMaximumItemCount(100); // Keep last 100 points
374

375
            // Add to GUI
376
            JPanel chartPanel = new JPanel();
377
            timeChart.insertToPanel(chartPanel);
378
            add(chartPanel);
379

380
            // Start data collection simulation
381
            startDataCollection();
382

383
        } catch (Exception ex) {
384
            System.err.println("Time chart setup error: " + ex.getMessage());
385
        }
386
    }
387

388
    private void startDataCollection() {
389
        // Simulate real-time data collection
390
        new Thread(() -> {
391
            try {
392
                while (true) {
393
                    // Add simulated sensor data
394
                    double temp = 20 + Math.random() * 10;      // 20-30°C
395
                    double pressure = 1000 + Math.random() * 50; // 1000-1050 hPa
396
                    double humidity = 50 + Math.random() * 30;   // 50-80%
397

398
                    dataBuffer.addValue(1, temp);
399
                    dataBuffer.addValue(2, pressure);
400
                    dataBuffer.addValue(3, humidity);
401
                    dataBuffer.printRow();
402

403
                    Thread.sleep(1000); // Update every second
404
                }
405
            } catch (Exception ex) {
406
                System.err.println("Data collection error: " + ex.getMessage());
407
            }
408
        }).start();
409
    }
410
}
411
```
412

413
## Arduino Data Integration Example
414

415
```java
416
import com.panamahitek.PanamaHitek_Arduino;
417
import com.panamahitek.liveinterfaces.*;
418
import jssc.*;
419

420
public class ComprehensiveVisualizationExample {
421

422
    private PanamaHitek_Arduino arduino;
423
    private PanamaHitek_SingleDialChart temperatureGauge;
424
    private PanamaHitek_DualDialChart pressureHumidityDials;
425
    private PanamaHitek_TimeLineChart trendChart;
426

427
    public void setupCompleteVisualization() {
428
        try {
429
            // Setup Arduino connection
430
            arduino = new PanamaHitek_Arduino();
431
            arduino.arduinoRX("COM3", 9600, new SerialPortEventListener() {
432
                @Override
433
                public void serialEvent(SerialPortEvent event) {
434
                    processArduinoData();
435
                }
436
            });
437

438
            // Setup temperature gauge
439
            temperatureGauge = new PanamaHitek_SingleDialChart(
440
                PanamaHitek_SingleDialChart.ROUND_DIAL_CHART,
441
                "Temperature", "°C"
442
            );
443
            temperatureGauge.setChartLimitValues(-10, 50);
444
            temperatureGauge.setColorDistribuition(60, 30, 10);
445

446
            // Setup pressure/humidity dual dial
447
            pressureHumidityDials = new PanamaHitek_DualDialChart(
448
                "Pressure & Humidity", "Environmental"
449
            );
450
            pressureHumidityDials.setChartTopLimitValues(1100, 100);
451
            pressureHumidityDials.setChartBottonLimitValues(900, 0);
452

453
            // Setup trend chart with data buffer
454
            setupTrendChart();
455

456
        } catch (Exception ex) {
457
            System.err.println("Visualization setup error: " + ex.getMessage());
458
        }
459
    }
460

461
    private void processArduinoData() {
462
        try {
463
            if (arduino.isMessageAvailable()) {
464
                String data = arduino.printMessage();
465
                // Parse: "TEMP:25.3,PRESS:1013.2,HUM:65.4"
466
                updateVisualizations(parseData(data));
467
            }
468
        } catch (Exception ex) {
469
            System.err.println("Data processing error: " + ex.getMessage());
470
        }
471
    }
472

473
    private void updateVisualizations(SensorData data) {
474
        // Update individual gauges
475
        temperatureGauge.setValue(data.temperature);
476
        pressureHumidityDials.setValue(data.pressure, data.humidity);
477

478
        // Add to trend chart data buffer
479
        // (Implementation depends on your specific data buffer setup)
480
    }
481

482
    // Helper class for sensor data
483
    private static class SensorData {
484
        double temperature, pressure, humidity;
485
    }
486

487
    private SensorData parseData(String rawData) {
488
        // Implementation for parsing Arduino data format
489
        SensorData data = new SensorData();
490
        // ... parsing logic
491
        return data;
492
    }
493
}
494
```
495

496
## Best Practices
497

498
1. **Configure chart ranges** before adding data to ensure proper scaling
499
2. **Use appropriate chart types** for your data (gauge for current values, timeline for trends)
500
3. **Set reasonable maximum item counts** for timeline charts to prevent memory issues
501
4. **Handle Arduino disconnections** gracefully using try-catch blocks
502
5. **Update charts on the EDT** when integrating with Swing applications
503
6. **Stop Arduino follow-up** properly when closing applications
504
7. **Use color coding** effectively to convey data meaning (green=good, red=warning)
505
8. **Consider chart refresh rates** to balance responsiveness with performance