canvas-linechart - npm Package Compare versions

Comparing version 1.3.3 to 1.3.4

index.js

@@ -9,13 +9,19 @@ module.exports = canvasLineChart;
 
-function canvasLineChart(c, width, data, base, marker, step) {
-  width = width * 2;
-  var height = 30 * 2;
-  var chartHeight = 18 * 2;
+function canvasLineChart(c, height, width, data, base, marker, step, stepSize, min, max, scaleFactor) {
+  var stepSize = stepSize || 1;
+  var min = min || 0;
+  var max = max || 20;
+  var scaleFactor = scaleFactor || 1;
+  width = width * scaleFactor;
+  var height = height * scaleFactor;
+  var margin = 12 * scaleFactor;
+  var chartHeight = height - (margin * scaleFactor);
   c.width = width;
   c.height = height;
-  c.style.width = width/2 + 'px';
-  c.style.height = height/2 + 'px';
+  c.style.width = width / scaleFactor + 'px';
+  c.style.height = height / scaleFactor + 'px';
+  var textOffset = margin;
+  var markerOffset = 10 * scaleFactor;
+  var fontSize = 10 * scaleFactor;
 
-  var margin = 10;
-
   var ctx = c.getContext('2d');
@@ -25,6 +31,6 @@ ctx.fillStyle = 'transparent';
 
-  // draw 20 x axis ticks
+  // draw [steps] axis ticks
   ctx.fillStyle = 'rgba(0,0,0,0.1)';
-  for (var i = 0; i < 21; i++) {
-    ctx.fillRect(xScale(i), 0, 4, chartHeight + margin);
+  for (var i = min; i <= max; i += stepSize) {
+    ctx.fillRect(xScale(i), 0, 2 * scaleFactor, chartHeight + margin);
   }
@@ -40,4 +46,4 @@
     return function(_) {
-      var scaled = (_ - yMin) / ((yMax - yMin) || 1);
-      return (chartHeight - (scaled * (chartHeight - margin)));
+      var scaled = (_ - (yMin - margin/2)) / (((yMax + margin/2) - (yMin - margin/2)) || 1);
+      return (chartHeight - (scaled * chartHeight));
     };
@@ -47,3 +53,3 @@ })();
   function xScale(_) {
-    return ~~(((_ / 20) * (width - margin*2)) + margin);
+    return ~~(((_ / max) * (width - margin)) + margin/2);
   }
@@ -77,3 +83,3 @@
   ctx.strokeStyle = '#222';
-  ctx.lineWidth = 5;
+  ctx.lineWidth = 2 * scaleFactor;
 
@@ -96,3 +102,3 @@ data.forEach(function(d, i) {
     ctx.fillStyle = '#ddd';
-    ctx.fillRect(xScale(marker[0]), 0, 3, chartHeight + margin);
+    ctx.fillRect(xScale(marker[0]), 0, 1.5 * scaleFactor, chartHeight + margin);
   }
@@ -105,9 +111,9 @@
     ctx.beginPath();
-    ctx.lineWidth = 2;
-    var r = 5;
+    ctx.lineWidth = 2 * scaleFactor;
+    var r = 3 * scaleFactor;
     if (data[2] && data[2].focus) {
-      ctx.lineWidth = 6;
-      r = 9;
+      ctx.lineWidth = 3 * scaleFactor;
+      r = 5 * scaleFactor;
     }
-    if (!data[2] || !data[2].end) ctx.arc(xScale(data[0]), yScale(data[1]), r, 0, 2 * Math.PI, false);
+    if (!data[2] || !data[2].end) ctx.arc(xScale(data[0]), yScale(data[1]), r, 0, (2 * Math.PI) * scaleFactor, false);
     ctx.fill();
@@ -118,5 +124,5 @@ ctx.stroke();
     ctx.fillStyle = '#ddd';
-    ctx.font = '20px Menlo, monospace';
+    ctx.font = fontSize + 'px Menlo, monospace';
     ctx.textAlign = 'center';
-    if (!data[2] || !data[2].end) ctx.fillText(data[0], xScale(data[0]), chartHeight + 24);
+    if (!data[2] || !data[2].end) ctx.fillText(data[0], xScale(data[0]), chartHeight + textOffset);
   });
@@ -127,9 +133,9 @@
     var xAnchor = xScale(marker[0]);
-    if (xAnchor < 20) xAnchor = 20;
-    if (xAnchor > (width - 20)) xAnchor = width - 20;
+    if (xAnchor < max) xAnchor = max;
+    if (xAnchor > (width - max)) xAnchor = width - max;
     ctx.fillStyle = '#ddd';
-    ctx.font = 'bold 20px monospace';
+    ctx.font = 'bold' + fontSize + 'px Menlo, monospace';
     ctx.textAlign = 'center';
-    ctx.fillText('' + marker[1], xAnchor, chartHeight + 22);
+    ctx.fillText('' + marker[1], xAnchor, chartHeight + markerOffset);
   }
 }

package.json

 {
   "name": "canvas-linechart",
-  "version": "1.3.3",
+  "version": "1.3.4",
   "description": "simple, dependency-free canvas chart",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5018

increased by12.46%

Lines of code

116

increased by6.42%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes