0.10.0-beta.17

New: - Split size legend items by square root, reduced count. - Changed legend Reset button style.
TargetProcess · Feb 8, 2017 · c0441c8 · c0441c8
1 parent 308d04e
commit c0441c8
Show file tree

Hide file tree

Showing 11 changed files with 56 additions and 78 deletions.
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "taucharts",
-  "version": "0.10.0-beta.16",
+  "version": "0.10.0-beta.17",
   "homepage": "https://github.com/TargetProcess/tauCharts",
   "description": "D3 based data-focused charting library",
   "keywords": [

diff --git a/build/development/plugins/tauCharts.legend.css b/build/development/plugins/tauCharts.legend.css
@@ -25,41 +25,28 @@
   font-size: 13px;
 }
 .graphical-report__legend__reset {
-  background-color: #fff;
+  background-color: rgba(255, 255, 255, 0.9);
   border: 1px solid #b3b3b3;
-  border-radius: 12px;
-  box-sizing: content-box;
+  border-radius: 4px;
+  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.005);
+  box-sizing: border-box;
   color: #b3b3b3;
   cursor: pointer;
   font-size: 13px;
-  height: 1em;
-  line-height: 1em;
   margin-top: -4px;
-  padding: 4px;
+  padding: 4px 6px;
   position: absolute;
   right: 0;
   top: 0;
-  z-index: 2;
+  z-index: 1;
 }
 .graphical-report__legend__reset:hover {
-  border-color: #333;
+  border-color: #999999;
   color: #333;
 }
 .graphical-report__legend__reset.disabled {
   display: none;
 }
-.graphical-report__legend__reset::before {
-  border: 2px solid #fff;
-  border-radius: 14px;
-  content: "";
-  display: block;
-  height: calc(100% + 2px);
-  left: -3px;
-  position: absolute;
-  top: -3px;
-  width: calc(100% + 2px);
-  z-index: 1;
-}
 .graphical-report__legend__item {
   padding: 10px 20px 8px 40px;
   position: relative;

diff --git a/build/development/plugins/tauCharts.legend.dark.css b/build/development/plugins/tauCharts.legend.dark.css
@@ -25,41 +25,28 @@
   font-size: 13px;
 }
 .graphical-report__legend__reset {
-  background-color: #000;
+  background-color: rgba(0, 0, 0, 0.9);
   border: 1px solid #606060;
-  border-radius: 12px;
-  box-sizing: content-box;
+  border-radius: 4px;
+  box-shadow: 0 1px 4px 0 rgba(255, 255, 255, 0.2), 0 0 0 1px rgba(255, 255, 255, 0.005);
+  box-sizing: border-box;
   color: #606060;
   cursor: pointer;
   font-size: 13px;
-  height: 1em;
-  line-height: 1em;
   margin-top: -4px;
-  padding: 4px;
+  padding: 4px 6px;
   position: absolute;
   right: 0;
   top: 0;
-  z-index: 2;
+  z-index: 1;
 }
 .graphical-report__legend__reset:hover {
-  border-color: #fff;
+  border-color: #808080;
   color: #fff;
 }
 .graphical-report__legend__reset.disabled {
   display: none;
 }
-.graphical-report__legend__reset::before {
-  border: 2px solid #000;
-  border-radius: 14px;
-  content: "";
-  display: block;
-  height: calc(100% + 2px);
-  left: -3px;
-  position: absolute;
-  top: -3px;
-  width: calc(100% + 2px);
-  z-index: 1;
-}
 .graphical-report__legend__item {
   padding: 10px 20px 8px 40px;
   position: relative;

diff --git a/build/development/plugins/tauCharts.legend.default.css b/build/development/plugins/tauCharts.legend.default.css
@@ -25,41 +25,28 @@
   font-size: 13px;
 }
 .graphical-report__legend__reset {
-  background-color: #fff;
+  background-color: rgba(255, 255, 255, 0.9);
   border: 1px solid #b3b3b3;
-  border-radius: 12px;
-  box-sizing: content-box;
+  border-radius: 4px;
+  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.005);
+  box-sizing: border-box;
   color: #b3b3b3;
   cursor: pointer;
   font-size: 13px;
-  height: 1em;
-  line-height: 1em;
   margin-top: -4px;
-  padding: 4px;
+  padding: 4px 6px;
   position: absolute;
   right: 0;
   top: 0;
-  z-index: 2;
+  z-index: 1;
 }
 .graphical-report__legend__reset:hover {
-  border-color: #333;
+  border-color: #999999;
   color: #333;
 }
 .graphical-report__legend__reset.disabled {
   display: none;
 }
-.graphical-report__legend__reset::before {
-  border: 2px solid #fff;
-  border-radius: 14px;
-  content: "";
-  display: block;
-  height: calc(100% + 2px);
-  left: -3px;
-  position: absolute;
-  top: -3px;
-  width: calc(100% + 2px);
-  z-index: 1;
-}
 .graphical-report__legend__item {
   padding: 10px 20px 8px 40px;
   position: relative;

diff --git a/build/development/plugins/tauCharts.legend.js b/build/development/plugins/tauCharts.legend.js
@@ -15,6 +15,7 @@
     var RESET_SELECTOR = '.graphical-report__legend__reset';
     var COLOR_ITEM_SELECTOR = '.graphical-report__legend__item-color';
     var COLOR_TOGGLE_SELECTOR = '.graphical-report__legend__guide--color__overlay';
+    var SIZE_TICKS_COUNT = 4;
 
     var counter = 0;
     var getId = function () {
@@ -31,12 +32,25 @@
         return [min].concat(chunks).concat(max);
     };
 
-    var splitRealValuesEvenly = function (values, count) {
+    var splitRealValuesEvenly = function (values, count, funcType) {
 
         if (values.length < 3) {
             return values.slice(0);
         }
+        if (count < 3) {
+            return [values[0], values[values.length - 1]];
+        }
 
+        var repeat = function (x) {
+            return x;
+        };
+        var square = function (x) {
+            return Math.pow(x, 2);
+        };
+        var input = (funcType === 'sqrt' ? Math.sqrt : repeat);
+        var ouput = (funcType === 'sqrt' ? square : repeat);
+
+        values = values.map(input);
         var result = [values[0]];
         var length = (values[values.length - 1] - values[0]);
         var halfStep = (0.5 * length / (count - 1));
@@ -94,6 +108,8 @@
 
         result.push(values[values.length - 1]);
 
+        result = result.map(ouput);
+
         return result;
     };
 
@@ -470,7 +486,7 @@
                                 .sort(function (a, b) {
                                     return (a - b);
                                 });
-                            var steps = splitRealValuesEvenly(realValues, 5);
+                            var steps = splitRealValuesEvenly(realValues, SIZE_TICKS_COUNT, sizeScale.funcType);
 
                             values = utils.unique(steps
                                 .map(function (x) {

diff --git a/build/development/tauCharts.js b/build/development/tauCharts.js
@@ -1,4 +1,4 @@
-/*! taucharts - v0.10.0-beta.16 - 2017-02-08
+/*! taucharts - v0.10.0-beta.17 - 2017-02-08
 * https://github.com/TargetProcess/tauCharts
 * Copyright (c) 2017 Taucraft Limited; Licensed Apache License 2.0 */
 (function webpackUniversalModuleDefinition(root, factory) {
@@ -348,7 +348,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	}]));
 
 	/* global VERSION:false */
-	var version = ("0.10.0-beta.16");
+	var version = ("0.10.0-beta.17");
 	exports.GPL = _tau.GPL;
 	exports.Plot = _tau2.Plot;
 	exports.Chart = _tau3.Chart;
@@ -16904,6 +16904,7 @@ return /******/ (function(modules) { // webpackBootstrap
 	        _this.vars = [Math.min.apply(Math, _toConsumableArray([min, vars[0]].filter(Number.isFinite))), Math.max.apply(Math, _toConsumableArray([max, vars[1]].filter(Number.isFinite)))];
 
 	        _this.addField('scaleType', 'size');
+	        _this.addField('funcType', scaleConfig.func || 'sqrt');
 	        return _this;
 	    }
 

diff --git a/build/production/tauCharts.dark.min.css b/build/production/tauCharts.dark.min.css
diff --git a/build/production/tauCharts.default.min.css b/build/production/tauCharts.default.min.css
diff --git a/build/production/tauCharts.min.css b/build/production/tauCharts.min.css
diff --git a/build/production/tauCharts.min.js b/build/production/tauCharts.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "taucharts",
-  "version": "0.10.0-beta.16",
+  "version": "0.10.0-beta.17",
   "homepage": "https://github.com/TargetProcess/tauCharts",
   "description": "D3 based data-focused charting library",
   "author": {