Skip to content

Commit 6a5fc8b

Browse files
committed
feat: implement multi-expression plotting with Desmos-style UI
- Add Expression struct for managing multiple expressions with custom colors - Implement Desmos-style collapsible sidebar with numbered slots - Add dark top bar with Save button and branding - Support all expression types: regular, polar, parametric, implicit, inequalities - Add fine grid system with axis labels and zoom controls - Fix color picker positioning to prevent overlap with text inputs - Add /bigobj compiler flag for MSVC builds Resolves #15
1 parent 42684fc commit 6a5fc8b

File tree

4 files changed

+861
-314
lines changed

4 files changed

+861
-314
lines changed

DESMOS_FEATURES.md

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
# 🎨 ImGraph - Desmos-Style Features
2+
3+
## New Desmos-Like Interface
4+
5+
### ✨ Key Features Implemented
6+
7+
#### 1. **Beautiful Expression Cards**
8+
- Each expression is displayed in a rounded card (like Desmos)
9+
- Clean, modern design with proper spacing
10+
- Light gray background for better readability
11+
12+
#### 2. **Color-Coded Graphs**
13+
- **10 Beautiful Preset Colors** that cycle automatically:
14+
- 🔴 Red (#C74643)
15+
- 🔵 Blue (#4080C7)
16+
- 🟢 Green (#45A145)
17+
- 🟣 Purple (#9749A3)
18+
- 🟠 Orange (#ED7D2E)
19+
- 🔷 Cyan (#26AEAE)
20+
- 🌸 Pink (#E33E96)
21+
- 🟤 Brown (#785447)
22+
- ⚫ Dark Gray (#333333)
23+
- 💚 Teal (#008040)
24+
25+
#### 3. **Color Picker**
26+
- Click the colored circle next to each expression
27+
- Customize with any color you want
28+
- Color instantly updates on the graph
29+
30+
#### 4. **Grid System**
31+
- Light gray grid lines (like Desmos)
32+
- Major grid lines every 5 units (darker)
33+
- Minor grid lines every 1 unit (lighter)
34+
- Grid automatically scales with zoom
35+
36+
#### 5. **Axis Labels**
37+
- Numeric labels on both axes
38+
- Shows coordinate values
39+
- Labels positioned clearly away from axes
40+
- Gray color for subtlety
41+
42+
#### 6. **Expression Controls**
43+
- ☑️ **Checkbox**: Show/hide individual graphs
44+
- 🎨 **Color Circle**: Click to change color
45+
-**Delete Button**: Remove unwanted expressions
46+
- 📝 **Large Input Box**: More space for complex equations
47+
48+
#### 7. **Smart UI Layout**
49+
- Left panel: 30% width (expressions)
50+
- Right panel: 70% width (graph)
51+
- Proper padding and spacing
52+
- Rounded corners on all elements
53+
54+
#### 8. **Enhanced Add Button**
55+
- Large, prominent "+ Add Expression" button
56+
- Blue color (Desmos style)
57+
- Hover effects for better UX
58+
59+
#### 9. **Zoom Control**
60+
- Clean slider at bottom of left panel
61+
- Range: 10-500 units
62+
- Smooth zooming
63+
64+
---
65+
66+
## How It Looks Different from Before
67+
68+
### Before (Old UI):
69+
- Basic text input
70+
- Single expression only
71+
- Fixed colors
72+
- No grid
73+
- Plain interface
74+
- Small text boxes
75+
76+
### After (Desmos-Style):
77+
- ✅ Multiple expressions with individual cards
78+
- ✅ Color picker for each expression
79+
- ✅ Beautiful grid system with labels
80+
- ✅ Show/hide toggle for each expression
81+
- ✅ Modern, polished interface
82+
- ✅ Large, easy-to-use input boxes
83+
- ✅ Preset color palette
84+
- ✅ Smooth, professional design
85+
86+
---
87+
88+
## Example Usage
89+
90+
### Try These Cool Examples:
91+
92+
**Example 1: Multiple Trigonometric Functions**
93+
1. Add Expression 1: `sin(x)` (Red)
94+
2. Add Expression 2: `cos(x)` (Blue)
95+
3. Add Expression 3: `tan(x)` (Green)
96+
97+
**Example 2: Polar Roses**
98+
1. Add Expression 1: `r = cos(2*theta)` (Red)
99+
2. Add Expression 2: `r = cos(3*theta)` (Blue)
100+
3. Add Expression 3: `r = cos(4*theta)` (Green)
101+
102+
**Example 3: Circles and Parabolas**
103+
1. Add Expression 1: `x^2 + y^2 = 4` (Red - circle)
104+
2. Add Expression 2: `y = x^2` (Blue - parabola)
105+
3. Add Expression 3: `x^2 + y^2 < 9` (Green - filled circle)
106+
107+
**Example 4: Parametric Heart**
108+
1. Add Expression 1: `(16*sin(t)^3, 13*cos(t) - 5*cos(2*t) - 2*cos(3*t) - cos(4*t))` (Pink ❤️)
109+
110+
**Example 5: Complex Implicit Functions**
111+
1. Add Expression 1: `(x^2 + y^2 - 1)^3 = x^2*y^3` (Purple - Heart curve)
112+
2. Add Expression 2: `x^2 - y^2 = 1` (Orange - Hyperbola)
113+
114+
---
115+
116+
## Tips for Best Experience
117+
118+
1. **Use the Grid**: The grid helps visualize coordinates and scale
119+
2. **Toggle Visibility**: Hide expressions you don't need at the moment
120+
3. **Color Code**: Use different colors for different types of functions
121+
4. **Zoom Levels**:
122+
- 50-100: Good for most functions
123+
- 100-200: Detailed view
124+
- 200-500: Very zoomed in
125+
5. **Multi-line Input**: Use Shift+Enter for longer expressions
126+
6. **Organize**: Keep similar expressions together in the list
127+
128+
---
129+
130+
## Keyboard Shortcuts (ImGui Default)
131+
132+
- **Tab**: Move between input fields
133+
- **Shift+Enter**: New line in expression input
134+
- **Click & Drag**: Interact with sliders
135+
136+
---
137+
138+
Enjoy creating beautiful graphs with your new Desmos-style calculator! 🎉📊✨

src/core/CMakeLists.txt

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,12 @@ endif ()
2323

2424
target_include_directories(${NAME} PUBLIC ${CMAKE_CURRENT_SOURCE_DIR})
2525
target_compile_features(${NAME} PRIVATE cxx_std_20)
26+
27+
# Add /bigobj flag for MSVC to handle large object files
28+
if(MSVC)
29+
target_compile_options(${NAME} PRIVATE /bigobj)
30+
endif()
31+
2632
target_link_libraries(${NAME}
2733
PRIVATE project_warnings
2834
PUBLIC fmt spdlog exprtk SDL2::SDL2 imgui Settings)

0 commit comments

Comments
 (0)