【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
项目之八十九：GC9A01园屏之动态模拟三色百分比圆饼图
实验开源代码
/*
【Arduino】189种传感器模块系列实验（资料代码+仿真编程+图形编程）
实验二百四十九：1.28寸圆形彩色TFT显示屏 高清IPS 模块 240*240 SPI接口GC9A01驱动
项目之八十九：GC9A01园屏之动态模拟三色百分比圆饼图
*/
// GC9A01---------- ESP32
// RST ------------ NC（复位引脚，此处未连接）
// CS ------------- D4（片选引脚，连接到ESP32的D4引脚）
// DC ------------- D2（数据/命令选择引脚，连接到ESP32的D2引脚）
// SDA ------------ D23 (green)（主数据输出引脚，连接到ESP32的D23引脚，绿色线）
// SCL ------------ D18 (yellow)（时钟信号引脚，连接到ESP32的D18引脚，黄色线）
// GND ------------ GND（接地引脚，连接到ESP32的接地端）
// VCC -------------3V3（电源引脚，连接到ESP32的3.3V电源）
#include "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_GC9A01A.h"
#include "math.h"
#define TFT_CS 4
#define TFT_DC 2
#define TFT_RST -1
Adafruit_GC9A01A tft = Adafruit_GC9A01A(TFT_CS, TFT_DC, TFT_RST);
#define SCREEN_WIDTH 240
#define SCREEN_HEIGHT 240
#define CENTER_X SCREEN_WIDTH / 2
#define CENTER_Y SCREEN_HEIGHT / 2
#define RADIUS 80// **饼图半径**
#define SPEED 5// **数据变化速度**
int data1 = 40;// **数据块 1**
int data2 = 30;// **数据块 2**
int data3 = 30;// **数据块 3**
void drawSector(int startAngle, int endAngle, uint16_t color) {
for (int angle = startAngle; angle < endAngle; angle += 3) {
float radian1 = angle * M_PI / 180;
float radian2 = (angle + 3) * M_PI / 180;
int x1 = CENTER_X + RADIUS * cos(radian1);
int y1 = CENTER_Y + RADIUS * sin(radian1);
int x2 = CENTER_X + RADIUS * cos(radian2);
int y2 = CENTER_Y + RADIUS * sin(radian2);
tft.fillTriangle(CENTER_X, CENTER_Y, x1, y1, x2, y2, color);
}
}
void setup() {
Serial.begin(115200);
tft.begin();
tft.setRotation(2);
}
void loop() {
tft.fillScreen(tft.color565(0, 0, 0));
int total = data1 + data2 + data3;
int angle1 = (data1 * 360) / total;
int angle2 = (data2 * 360) / total;
int angle3 = (data3 * 360) / total;
drawSector(0, angle1, tft.color565(255, 0, 0));// **红色数据块**
drawSector(angle1, angle1 + angle2, tft.color565(0, 255, 0));// **绿色数据块**
drawSector(angle1 + angle2, 360, tft.color565(0, 0, 255));// **蓝色数据块**
// **显示数值**
tft.setTextColor(tft.color565(255, 255, 255));
tft.setTextSize(2);
tft.setCursor(CENTER_X - 30, CENTER_Y - 80);
tft.print((data1 * 100) / total);
tft.print("%");
tft.setCursor(CENTER_X - 80, CENTER_Y + 20);
tft.print((data2 * 100) / total);
tft.print("%");
tft.setCursor(CENTER_X + 40, CENTER_Y + 20);
tft.print((data3 * 100) / total);
tft.print("%");
// **更新数据**
data1 = random(20, 50);
data2 = random(20, 50);
data3 = random(20, 50);
delay(2000);
}
【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
这段代码的核心功能是 动态圆饼图，它会根据数据变化调整不同颜色的扇形区域，同时在图表上 显示百分比数值，形成动态的可视化效果。代码结构
1️⃣ 初始化屏幕
• 使用 Adafruit_GC9A01A 控制 TFT 显示屏，并设置黑色背景。
2️⃣ 绘制圆饼图扇形区域
• 使用 drawSector() 方法，利用 fillTriangle() 绘制 多个扇形块，形成完整的饼图。
• 通过 cos() 和 sin() 计算扇形角度，确保图形正确绘制。
3️⃣ 显示数值百分比
• print() 方法在每个扇形内显示 对应百分比数值，提高数据可视化效果。
4️⃣ 动态更新数据
• 每次循环 数据随机变化，影响扇形大小，使饼图不断更新。
• delay(2000); 让数据变化有明显视觉效果，并保持平滑动画。
最终效果
屏幕上显示红、绿、蓝三色圆饼图，不断变化，模拟动态数据更新
百分比实时显示，使数据更直观易懂
黑色背景 + 三色扇形块 + 白色数值，提高视觉清晰度
【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
实验场景图动态图【花雕学编程】Arduino动手做（249）--GC9A01模拟三色圆饼图
页:
[1]