diff options
| -rw-r--r-- | src/Map/Canvas.js | 10 | ||||
| -rw-r--r-- | src/Map/Shapes.js | 11 | ||||
| -rw-r--r-- | src/main.js | 3 |
3 files changed, 22 insertions, 2 deletions
diff --git a/src/Map/Canvas.js b/src/Map/Canvas.js index cbd6e9e..111063e 100644 --- a/src/Map/Canvas.js +++ b/src/Map/Canvas.js @@ -89,6 +89,10 @@ class Canvas { this.drawPolygon(shape); break; + case Shape.Text: + this.drawText(shape); + break; + default: break; } @@ -126,6 +130,12 @@ class Canvas { ct.stroke(); ct.fill(); } + + drawText(shape) { + console.log('yes'); + const ct = this.context; + ct.fillText(shape.text, shape.nodes[0].x, shape.nodes[0].y); + } } diff --git a/src/Map/Shapes.js b/src/Map/Shapes.js index 3443f73..e394b69 100644 --- a/src/Map/Shapes.js +++ b/src/Map/Shapes.js @@ -23,6 +23,7 @@ class Shape { static Point = new ShapeType('Point'); static Path = new ShapeType('Path'); static Polygon = new ShapeType('Polygon'); + static Text = new ShapeType('Text'); constructor(type, nodes) { this.type = type; @@ -67,6 +68,14 @@ class Polygon extends Shape { } } +class Text extends Shape { + constructor(node, text, fontSize) { + super(Shape.Text, [node]); + this.text = text; + this.fontSize = fontSize; + } +} + class ZoomLevel extends Enum { static Globe = new ZoomLevel('Globe'); @@ -110,4 +119,4 @@ class MapObject { } -export { Node, Shape, Point, Path, Polygon, ZoomLevel, MapObject }; +export { Node, Shape, Point, Path, Polygon, Text, ZoomLevel, MapObject }; diff --git a/src/main.js b/src/main.js index 5c6db59..7e4ab79 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,5 @@ import { Transform, Canvas } from './Map/Canvas.js'; -import { Node, Shape, Point, Path, Polygon } from './Map/Shapes.js'; +import { Node, Shape, Point, Path, Polygon, Text } from './Map/Shapes.js'; function point(x, y) { this.x = x; this.y = y; }; @@ -18,6 +18,7 @@ const shapes = [ new Node(200, 200), new Node(300, 200), ]), + new Text(new Node(10, 100), 'hello, world!'), ]; canvas.render(transform, shapes); |