charted - npm Package Compare versions

Comparing version 0.0.26 to 0.0.27

examples/simple/index.js

@@ -16,3 +16,3 @@ var _ = require('underscore'), Backbone = require('backbone');
     x_key: 'time',
-    x_axis_formatter: 'time',
+    x_formatter: 'time',
     multi_y: false
@@ -19,0 +19,0 @@ });

lib/ChartModel.js

@@ -10,2 +10,3 @@ /**
 var Data = require('./Data');
+var x_formats = require('./x_formatters');
 var ChartModel = Backbone.Model.extend({
@@ -25,2 +26,4 @@
         x_key: "",
+        x_formatter: "",
+        x_formatter_fn: undefined,
         x_ascending: true, 
@@ -37,5 +40,4 @@ draw_guides: true,
         // Check for predefined x formatters
-        if (typeof attrs.x_axis_formatter === "string") {
-            var x_formats = require('./x_formatters');
-            if (x_formats[attrs.x_axis_formatter]) this.set('x_axis_formatter',x_formats[attrs.x_axis_formatter]);
+        if (attrs.x_formatter) {
+            this.setXFormatter(attrs.x_formatter);
         }
@@ -49,2 +51,16 @@
     
+    x_formats: x_formats,
+    
+    setXFormatter: function(formatter) {
+        if (typeof formatter !== 'function') {
+            
+            if (this.x_formats[formatter] === undefined) {
+                throw new Error('X formatter string not found in this charted version');
+            }
+            
+            formatter = this.x_formats[formatter];
+        }
+        this.set('x_formatter_fn', formatter);
+    },
+    
     // Some sensible default validation
@@ -62,2 +78,3 @@ validate: function(attrs) {
         json['plots'] = this.plots.toJSON();
+        delete json['x_formatter_fn'];
         return json;
@@ -64,0 +81,0 @@ },

lib/Plots.js

@@ -95,4 +95,4 @@ /**
         // ... then
-        var paddingAmtLeft = paddingLeft * range || 1;
-        var paddingAmtRight = paddingRight * range || 1;
+        var paddingAmtLeft = Math.max(paddingLeft * range, 0.01);
+        var paddingAmtRight = Math.max(paddingRight * range, 0.01);
         
@@ -99,0 +99,0 @@ // Make the padding adjustments.

lib/PointView.js

@@ -28,3 +28,3 @@ var _ = require('underscore');
         var y_val = this.model.get(y_key);
-        var x_formatter = this.chart.get('x_axis_formatter');
+        var x_formatter = this.chart.get('x_formatter_fn');
         
@@ -31,0 +31,0 @@ var json = {

lib/ResizerView.js

@@ -22,2 +22,3 @@ var Backbone = require('backbone');
         
+        // Set up initial mouse position
         var initialX = evt.clientX;
@@ -28,3 +29,13 @@ var initialY = evt.clientY;
         
-        var resize = function(evt) {
+        // Set up marquee object for resizing
+        var vpOffset = this.rootView.$('.chart-viewport').offset();
+        var $marq = $('<div class="charted-resize-marquee"></div>')
+            .css({
+                left: vpOffset.left,
+                top: vpOffset.top
+            })
+            .appendTo($('body'));
+        
+        // Calculates new dimensions at current mouse position
+        function getNewDims(evt) {
             evt.preventDefault();
@@ -36,12 +47,32 @@ evt.originalEvent.preventDefault();
             var newHeight = +initialHeight + +deltaY;
-            this.setWidth(newWidth);
-            this.setHeight(newHeight);
+            return {
+                width: newWidth,
+                height: newHeight
+            };
+        }
+        
+        // When the mouse is released
+        var release = function release(evt) {
+            var dims = getNewDims(evt);
+            this.setWidth(dims.width);
+            this.setHeight(dims.height);
+            $(window).off('mousemove', resize);
+            $marq.remove();
+            this.rootView.model.set('no_render', false);
         }.bind(this);
         
-        var release = function(evt) {
-            $(window).off('mousemove', resize);
+        function resize(evt) {
+            var dims = getNewDims(evt);
+            dims.width += 'px';
+            dims.height += 'px';
+            $marq.css(dims);
         }
         
+        // Stop rendering
+        this.rootView.model.set('no_render', true);
+        
+        // $(window).one('mouseup', release);
+        // $(window).on('mousemove', resize);
+        $(window).on('mousemove', resize);
         $(window).one('mouseup', release);
-        $(window).on('mousemove', resize);
     },
@@ -48,0 +79,0 @@

lib/util.js

@@ -51,3 +51,3 @@ exports.convertToRange = function(value, lower, upper, newRange) {
     // Round number with magnitude, then cast as string
-    rounded = Math.round( number * mag ) / mag;
+    rounded = mag < 1 ? Math.round(number) : Math.round( number * mag ) / mag;
     rounded = rounded + '';
@@ -54,0 +54,0 @@

lib/x_formatters.js

@@ -0,3 +1,16 @@
+var bormat = require('bormat');
 exports.time = function(timestamp) {
     return (new Date(timestamp)).toLocaleTimeString();
+}
+exports.date = function(timestamp) {
+    return (new Date(timestamp)).toLocaleDateString();
+}
+exports.datetime = function(timestamp) {
+    return (new Date(timestamp)).toString();
+}
+exports.gmt = function(timestamp) {
+    return (new Date(timestamp)).toGMTString();
+}
+exports.grouped = function(number) {
+    return bormat.commaGroups(number);
 }

lib/XaxisView.js

@@ -16,3 +16,3 @@ /**
        
-       this.listenTo(this.model, 'change:vp_width', this.render);
+       this.listenTo(this.model, 'change:vp_width change:x_formatter_fn', this.render);
        
@@ -46,3 +46,3 @@ },
         var value_increments = range / num_markers;
-        var x_formatter = this.model.get('x_axis_formatter');
+        var x_formatter = this.model.get('x_formatter_fn');
         var use_formatter = "function" === typeof x_formatter;
@@ -49,0 +49,0 @@

lib/YaxesView.js

@@ -64,4 +64,7 @@ /**
         
-        if (this.model.get('multi_y')) return this.renderMulti();
-        else return this.renderSingle();
+        if (this.model.get('multi_y')) this.renderMulti();
+        else this.renderSingle();
+        
+        this.model.trigger('yaxes_rendered');
+        
         return this;
@@ -68,0 +71,0 @@ },

package.json

 {
   "name": "charted",
-  "version": "0.0.26",
+  "version": "0.0.27",
   "description": "Charts an entire collection of data. Single or multiple y-axes. Support for 64-bit integers. Auto-resizing axes.",
@@ -5,0 +5,0 @@ "main": "index.js",

test/suite.js

@@ -22,3 +22,3 @@ var assert = require('assert');
                 x_key: 'time',
-                x_axis_formatter: 'time',
+                x_formatter: 'time',
                 multi_y: false
@@ -25,0 +25,0 @@ });

No alert changes

Improved metrics

Total package byte prevSize

632473

increased by0.39%

Lines of code

18406

increased by0.36%

No dependency changes