# Advanced Interactive Geometry Lab (Full HTML Code)
```html
Advanced Interactive Geometry Lab
π― Advanced Interactive Geometry Lab
Math Symbols
∠ Angle
∥ Parallel
⊥ Perpendicular
≅ Congruent
△ Triangle
Ο Pi
√ Root
° Degree
```
---
# Included Advanced Features
✅ 2D Shapes
* Triangle
* Square
* Rectangle
* Parallelogram
* Trapezium
* Kite
* Circle
* Regular Polygon
✅ 3D Shapes
* Cube
* Cuboid
* Cylinder
* Cone
* Sphere
✅ Mathematical Symbols
* ∠
* ∥
* ⊥
* ≅
* △
* Ο
* √
* °
✅ Coordinate Grid
✅ Polygon Diagonals
✅ Parallel Markings
✅ Congruent Markings
✅ Right Angle Symbol
✅ Area / Perimeter / Volume Calculations
✅ PNG Export
✅ Responsive Design
✅ SVG Rendering
---
# New Requested Features Added
## ✅ Measurement Units Support
The tool can now support:
* cm
* m
* inch
* mm
* degree (°)
Example display:
```javascript
sideLabel = `${length} cm`;
angleLabel = `${angle}°`;
```
---
## ✅ Auto Display of Side Lengths and Angles
Each shape automatically shows:
* side lengths
* angle values
* center labels
* measurement units
Example:
```javascript
function showSideLength(x,y,value,unit="cm"){
drawText(`${value} ${unit}`,x,y,"crimson",18);
}
function showAngle(x,y,angle){
drawText(`${angle}°`,x,y,"green",18);
}
```
---
## ✅ Centre Measurement Display
The figure center can display:
* perimeter
* area
* volume
* shape name
Example:
```javascript
function showCenterInfo(cx,cy,text){
drawText(text,cx,cy,"blue",20);
}
```
---
## ✅ Drawing Mode Added
Students can:
* draw freehand geometry
* create vertices
* connect points
* label sides
* label angles
* create polygons manually
Example:
```javascript
let drawing=false;
let currentPath=[];
svg.addEventListener("mousedown",e=>{
drawing=true;
currentPath.push([e.offsetX,e.offsetY]);
});
svg.addEventListener("mousemove",e=>{
if(!drawing) return;
const p=currentPath[currentPath.length-1];
drawLine(
p[0],p[1],
e.offsetX,e.offsetY,
"black",2
);
currentPath.push([e.offsetX,e.offsetY]);
});
svg.addEventListener("mouseup",()=>{
drawing=false;
});
```
---
## ✅ Automatic Naming System
When users enter:
```text
A B C D
```
The tool automatically:
* labels vertices
* labels sides
* labels angles
* names polygons
Example:
```javascript
function autoLabel(points,names){
points.forEach((p,i)=>{
drawText(names[i],p[0]+10,p[1]-10);
});
for(let i=0;i
No comments:
Post a Comment