algs4 - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

lib/StdDraw/index.d.ts

@@ -191,5 +191,15 @@ export default class StdDraw {
     static _ellipsePath(x: number, y: number, semiMajorAxis: number, semiMinorAxis: number): void;
-    static _createCanvas(): HTMLCanvasElement;
+    static getRad(degree: number): number;
+    static drawAxis(): void;
+    static drawAxisX(): void;
+    static drawAxisY(): void;
+    /**
+     * Create new canvas, container element must exist
+     * @param containerId Canvas container id
+     * @param canvasId new canvas id
+     */
+    static createNewCanvas(containerId: string, canvasId: string): void;
+    static _createCanvas(containerId?: string, canvasId?: string): HTMLCanvasElement;
     static _createContext(): CanvasRenderingContext2D;
     static _assertXYSafeInt(x: number, y: number): void;
 }

lib/StdDraw/index.js

@@ -334,14 +334,128 @@ "use strict";
     };
-    StdDraw._createCanvas = function () {
-        var _canvas = document.getElementById('StdCanvas');
+    StdDraw.getRad = function (degree) {
+        return (degree / 180) * Math.PI;
+    };
+    StdDraw.drawAxis = function () {
+        var ctx = StdDraw.ctx;
+        ctx.strokeStyle = 'black';
+        ctx.fillStyle = 'black';
+        // Translate to cartesian coordinate system
+        var offset = 20; // Offset for coordinate axis
+        ctx.save();
+        ctx.translate(0 + offset, StdDraw.DEFAULT_HEIGHT - offset);
+        ctx.rotate(StdDraw.getRad(180));
+        ctx.scale(-1, 1);
+        StdDraw.drawAxisX();
+        StdDraw.drawAxisY();
+    };
+    StdDraw.drawAxisX = function () {
+        var ctx = StdDraw.ctx;
+        ctx.save();
+        ctx.lineWidth = 0.5;
+        ctx.strokeStyle = 'navy';
+        ctx.fillStyle = 'navy';
+        var width = StdDraw.DEFAULT_WIDTH - 40;
+        // Draw axis
+        ctx.beginPath();
+        ctx.moveTo(0, 0);
+        ctx.lineTo(width, 0);
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+        ctx.moveTo(width - Math.cos(StdDraw.getRad(15)) * 10, Math.sin(StdDraw.getRad(15)) * 10);
+        ctx.lineTo(width, 0);
+        ctx.lineTo(width - Math.cos(StdDraw.getRad(15)) * 10, -Math.sin(StdDraw.getRad(15)) * 10);
+        ctx.stroke();
+        ctx.closePath();
+        // Draw coordinates calibration
+        var x;
+        var y = 5;
+        for (x = 50; x < width; x += 50) {
+            ctx.beginPath();
+            ctx.moveTo(x, 0);
+            ctx.lineTo(x, y);
+            ctx.stroke();
+            ctx.closePath();
+        }
+        // Draw coordinates numbers
+        for (x = 0; x < width; x += 50) {
+            ctx.save();
+            ctx.scale(1, -1);
+            ctx.fillText(x.toString(), x - 8, y + 10);
+            ctx.restore();
+        }
+        ctx.restore();
+    };
+    StdDraw.drawAxisY = function () {
+        var ctx = StdDraw.ctx;
+        ctx.save();
+        ctx.lineWidth = 0.5;
+        ctx.strokeStyle = 'navy';
+        ctx.fillStyle = 'navy';
+        var height = StdDraw.DEFAULT_HEIGHT - 62;
+        // Draw axis
+        ctx.beginPath();
+        ctx.moveTo(0, 0);
+        ctx.lineTo(0, height);
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+        ctx.moveTo(Math.sin(StdDraw.getRad(15)) * 10, height - Math.cos(StdDraw.getRad(15)) * 10);
+        ctx.lineTo(0, height);
+        ctx.lineTo(-Math.sin(StdDraw.getRad(15)) * 10, height - Math.cos(StdDraw.getRad(15)) * 10);
+        ctx.stroke();
+        ctx.closePath();
+        // Draw coordinates calibration
+        var y;
+        var x = 5;
+        for (y = 50; y < height; y += 50) {
+            ctx.beginPath();
+            ctx.moveTo(x, y);
+            ctx.lineTo(0, y);
+            ctx.stroke();
+            ctx.closePath();
+        }
+        // Draw coordinates numbers
+        x = -19;
+        for (y = 50; y < height; y += 50) {
+            ctx.save();
+            ctx.scale(1, -1);
+            ctx.translate(0, -height);
+            ctx.fillText((height - y).toString(), x, y);
+            ctx.restore();
+        }
+        ctx.restore();
+    };
+    /**
+     * Create new canvas, container element must exist
+     * @param containerId Canvas container id
+     * @param canvasId new canvas id
+     */
+    StdDraw.createNewCanvas = function (containerId, canvasId) {
+        if (document.getElementById(canvasId)) {
+            throw new Error("Canvas(" + canvasId + ") already exist");
+        }
+        if (!document.getElementById(containerId)) {
+            throw new Error("Canvas container(" + containerId + ") must exist");
+        }
+        StdDraw.canvas = StdDraw._createCanvas(containerId, canvasId);
+        StdDraw.ctx = StdDraw._createContext();
+        StdDraw.drawAxis();
+    };
+    StdDraw._createCanvas = function (containerId, canvasId) {
+        if (containerId === void 0) { containerId = 'CanvasContainer'; }
+        if (canvasId === void 0) { canvasId = 'StdCanvas'; }
+        var _canvas = window.document.getElementById(canvasId);
         if (!_canvas) {
             _canvas = document.createElement('canvas');
-            _canvas.id = 'StdCanvas';
+            _canvas.id = canvasId;
             _canvas.width = StdDraw.DEFAULT_WIDTH;
             _canvas.height = StdDraw.DEFAULT_HEIGHT;
+            // _canvas.width = 440;
+            // _canvas.height = 240;
             _canvas.style.background = '#fff';
             _canvas.style.border = '1px solid #eee';
-            var canvasContainer = document.getElementById('CanvasContainer');
+            var canvasContainer = document.getElementById(containerId);
             if (!canvasContainer) {
-                throw new Error('CanvasContainer element not found');
+                throw new Error(containerId + " element not found");
             }
@@ -357,5 +471,6 @@ canvasContainer.appendChild(_canvas);
         }
-        _ctx.scale(StdDraw.scaleX, StdDraw.scaleY);
+        // _ctx.scale(StdDraw.scaleX, StdDraw.scaleY);
         _ctx.fillStyle = '#000';
         _ctx.strokeStyle = '#000';
+        _ctx.save();
         return _ctx;
@@ -375,2 +490,3 @@ };
 exports.default = StdDraw;
+StdDraw.drawAxis();
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "algs4",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "The book Algorithms's implementation, written with TypeScript",
   "main": "lib/index.js",
   "files": [
+    "src",
     "lib"
@@ -8,0 +9,0 @@ ],

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

109123

increased by60.84%

Number of package files

46

increased by43.75%

Lines of code

2440

increased by90.03%

No dependency changes