From bbd49a91f8b427cbd7d2840076cca6e40dd3890e Mon Sep 17 00:00:00 2001 From: Mahesh Khanal Date: Fri, 2 Nov 2018 11:51:11 -1000 Subject: [PATCH 1/2] Changes on nodeFillColor Added option to make changes on node fill color --- src/CustomHover.js | 0 src/atlas3.js | 6 ++++-- src/css/JsonEditor.css | 0 src/css/Legend.css | 2 ++ src/css/MiniMap.css | 0 src/css/NetworkLayer.css | 0 src/css/TrafficLayer.css | 2 +- src/images/Colors-demo.gif | Bin src/images/atlas_logo.png | Bin src/images/atlas_logo_60o.png | Bin src/images/colors-1.png | Bin src/images/colors-2.png | Bin src/images/colors-3-1.png | Bin src/images/colors-3-2.png | Bin src/images/custom-hover-box-2.png | Bin src/images/custom-node-box.png | Bin src/images/example.png | Bin src/images/invert-legend.png | Bin src/images/invert-scheme.png | Bin src/images/json-editor.png | Bin src/images/layer-options-1.png | Bin src/images/layer-options-2.png | Bin src/images/line-color.png | Bin src/images/logical-map.png | Bin src/images/map-options-logical.png | Bin src/images/map-options.png | Bin src/images/network-map.png | Bin src/images/networkmap-main-1.png | Bin src/images/node-color.png | Bin src/images/opacity-1.png | Bin src/images/opacity-2.png | Bin src/images/opacity-colors.png | Bin src/images/opacity-scheme.png | Bin src/images/threshold-1.png | Bin src/images/threshold-2.png | Bin src/images/threshold-scheme.png | Bin src/images/tooltip-options-1.png | Bin src/images/tsds-query.png | Bin src/images/twin-tubes.png | Bin src/js/index/DataSource.js | 0 src/js/index/LeafletMap.js | 0 src/js/index/Legend.js | 0 src/js/map/BaseLayer.js | 0 src/js/map/BaseMap.js | 0 src/js/map/LeafletMap.js | 0 src/js/map/NetworkLayer.js | 0 src/js/map/SingleTubeLayer.js | 7 ++++--- src/js/map/TrafficLayer.js | 0 src/js/map/TwinTubeLayer.js | 7 ++++--- src/js/util/DataSource.js | 0 src/js/util/DataSourceFormatter.js | 0 src/js/util/Enums.js | 0 src/js/util/Functions.js | 0 src/js/util/Geometry.js | 0 src/js/util/Interval.js | 0 src/js/util/Topology.js | 0 src/js/util/UrlFormatter.js | 0 src/js/widget/InfoDiv.js | 2 +- src/js/widget/Legend.js | 0 src/module.js | 0 src/partials/display_editor.html | 6 ++++++ src/partials/editor.html | 0 src/partials/json_editor.html | 0 src/partials/module.html | 0 src/plugin.json | 0 src/scale.js | 5 +++++ 66 files changed, 27 insertions(+), 10 deletions(-) mode change 100644 => 100755 src/CustomHover.js mode change 100644 => 100755 src/atlas3.js mode change 100644 => 100755 src/css/JsonEditor.css mode change 100644 => 100755 src/css/Legend.css mode change 100644 => 100755 src/css/MiniMap.css mode change 100644 => 100755 src/css/NetworkLayer.css mode change 100644 => 100755 src/css/TrafficLayer.css mode change 100644 => 100755 src/images/Colors-demo.gif mode change 100644 => 100755 src/images/atlas_logo.png mode change 100644 => 100755 src/images/atlas_logo_60o.png mode change 100644 => 100755 src/images/colors-1.png mode change 100644 => 100755 src/images/colors-2.png mode change 100644 => 100755 src/images/colors-3-1.png mode change 100644 => 100755 src/images/colors-3-2.png mode change 100644 => 100755 src/images/custom-hover-box-2.png mode change 100644 => 100755 src/images/custom-node-box.png mode change 100644 => 100755 src/images/example.png mode change 100644 => 100755 src/images/invert-legend.png mode change 100644 => 100755 src/images/invert-scheme.png mode change 100644 => 100755 src/images/json-editor.png mode change 100644 => 100755 src/images/layer-options-1.png mode change 100644 => 100755 src/images/layer-options-2.png mode change 100644 => 100755 src/images/line-color.png mode change 100644 => 100755 src/images/logical-map.png mode change 100644 => 100755 src/images/map-options-logical.png mode change 100644 => 100755 src/images/map-options.png mode change 100644 => 100755 src/images/network-map.png mode change 100644 => 100755 src/images/networkmap-main-1.png mode change 100644 => 100755 src/images/node-color.png mode change 100644 => 100755 src/images/opacity-1.png mode change 100644 => 100755 src/images/opacity-2.png mode change 100644 => 100755 src/images/opacity-colors.png mode change 100644 => 100755 src/images/opacity-scheme.png mode change 100644 => 100755 src/images/threshold-1.png mode change 100644 => 100755 src/images/threshold-2.png mode change 100644 => 100755 src/images/threshold-scheme.png mode change 100644 => 100755 src/images/tooltip-options-1.png mode change 100644 => 100755 src/images/tsds-query.png mode change 100644 => 100755 src/images/twin-tubes.png mode change 100644 => 100755 src/js/index/DataSource.js mode change 100644 => 100755 src/js/index/LeafletMap.js mode change 100644 => 100755 src/js/index/Legend.js mode change 100644 => 100755 src/js/map/BaseLayer.js mode change 100644 => 100755 src/js/map/BaseMap.js mode change 100644 => 100755 src/js/map/LeafletMap.js mode change 100644 => 100755 src/js/map/NetworkLayer.js mode change 100644 => 100755 src/js/map/SingleTubeLayer.js mode change 100644 => 100755 src/js/map/TrafficLayer.js mode change 100644 => 100755 src/js/map/TwinTubeLayer.js mode change 100644 => 100755 src/js/util/DataSource.js mode change 100644 => 100755 src/js/util/DataSourceFormatter.js mode change 100644 => 100755 src/js/util/Enums.js mode change 100644 => 100755 src/js/util/Functions.js mode change 100644 => 100755 src/js/util/Geometry.js mode change 100644 => 100755 src/js/util/Interval.js mode change 100644 => 100755 src/js/util/Topology.js mode change 100644 => 100755 src/js/util/UrlFormatter.js mode change 100644 => 100755 src/js/widget/InfoDiv.js mode change 100644 => 100755 src/js/widget/Legend.js mode change 100644 => 100755 src/module.js mode change 100644 => 100755 src/partials/display_editor.html mode change 100644 => 100755 src/partials/editor.html mode change 100644 => 100755 src/partials/json_editor.html mode change 100644 => 100755 src/partials/module.html mode change 100644 => 100755 src/plugin.json mode change 100644 => 100755 src/scale.js diff --git a/src/CustomHover.js b/src/CustomHover.js old mode 100644 new mode 100755 diff --git a/src/atlas3.js b/src/atlas3.js old mode 100644 new mode 100755 index 51c0575f..713a22e2 --- a/src/atlas3.js +++ b/src/atlas3.js @@ -559,7 +559,8 @@ export class Atlas3 extends MetricsPanelCtrl { min: ctrl.panel.min[j], lineWidth: ctrl.panel.size[j], twin_tubes: ctrl.panel.twin_tubes, - mapSource: ctrl.panel.mapSrc[j] + mapSource: ctrl.panel.mapSrc[j], + endpointColor : ctrl.panel.nodeFillColor }); if(ctrl.panel.mapSrc[j] === null || ctrl.panel.mapSrc[j] === undefined || ctrl.panel.mapSrc[j] === "") { ctrl.layer_ids.push(''); @@ -658,7 +659,8 @@ export class Atlas3 extends MetricsPanelCtrl { min: ctrl.panel.min[i], twin_tubes: ctrl.panel.twin_tubes, lineWidth: ctrl.panel.size[i], - mapSource: ctrl.panel.mapSrc[i] + mapSource: ctrl.panel.mapSrc[i], + endpointColor : ctrl.panel.nodeFillColor, }); ctrl.layer_ids.push(networkLayer.layerId()); ctrl.panel.layers.push(networkLayer); diff --git a/src/css/JsonEditor.css b/src/css/JsonEditor.css old mode 100644 new mode 100755 diff --git a/src/css/Legend.css b/src/css/Legend.css old mode 100644 new mode 100755 index 64ad67ef..dff29e09 --- a/src/css/Legend.css +++ b/src/css/Legend.css @@ -113,10 +113,12 @@ limitations under the License. .atlas-legend.atlas-info-div.horizontal .numbers .scale-num.zero { text-align: left; + color: snow; } .atlas-legend.atlas-info-div.horizontal .numbers .scale-num.hundred { text-align: right; + color: snow; } /* infodiv style */ diff --git a/src/css/MiniMap.css b/src/css/MiniMap.css old mode 100644 new mode 100755 diff --git a/src/css/NetworkLayer.css b/src/css/NetworkLayer.css old mode 100644 new mode 100755 diff --git a/src/css/TrafficLayer.css b/src/css/TrafficLayer.css old mode 100644 new mode 100755 index 141f019b..c810e3fa --- a/src/css/TrafficLayer.css +++ b/src/css/TrafficLayer.css @@ -46,7 +46,7 @@ limitations under the License. .popHighlight{ stroke-width: 2px; - stroke: #ddd; + stroke: black; } .popHighlight:hover{ diff --git a/src/images/Colors-demo.gif b/src/images/Colors-demo.gif old mode 100644 new mode 100755 diff --git a/src/images/atlas_logo.png b/src/images/atlas_logo.png old mode 100644 new mode 100755 diff --git a/src/images/atlas_logo_60o.png b/src/images/atlas_logo_60o.png old mode 100644 new mode 100755 diff --git a/src/images/colors-1.png b/src/images/colors-1.png old mode 100644 new mode 100755 diff --git a/src/images/colors-2.png b/src/images/colors-2.png old mode 100644 new mode 100755 diff --git a/src/images/colors-3-1.png b/src/images/colors-3-1.png old mode 100644 new mode 100755 diff --git a/src/images/colors-3-2.png b/src/images/colors-3-2.png old mode 100644 new mode 100755 diff --git a/src/images/custom-hover-box-2.png b/src/images/custom-hover-box-2.png old mode 100644 new mode 100755 diff --git a/src/images/custom-node-box.png b/src/images/custom-node-box.png old mode 100644 new mode 100755 diff --git a/src/images/example.png b/src/images/example.png old mode 100644 new mode 100755 diff --git a/src/images/invert-legend.png b/src/images/invert-legend.png old mode 100644 new mode 100755 diff --git a/src/images/invert-scheme.png b/src/images/invert-scheme.png old mode 100644 new mode 100755 diff --git a/src/images/json-editor.png b/src/images/json-editor.png old mode 100644 new mode 100755 diff --git a/src/images/layer-options-1.png b/src/images/layer-options-1.png old mode 100644 new mode 100755 diff --git a/src/images/layer-options-2.png b/src/images/layer-options-2.png old mode 100644 new mode 100755 diff --git a/src/images/line-color.png b/src/images/line-color.png old mode 100644 new mode 100755 diff --git a/src/images/logical-map.png b/src/images/logical-map.png old mode 100644 new mode 100755 diff --git a/src/images/map-options-logical.png b/src/images/map-options-logical.png old mode 100644 new mode 100755 diff --git a/src/images/map-options.png b/src/images/map-options.png old mode 100644 new mode 100755 diff --git a/src/images/network-map.png b/src/images/network-map.png old mode 100644 new mode 100755 diff --git a/src/images/networkmap-main-1.png b/src/images/networkmap-main-1.png old mode 100644 new mode 100755 diff --git a/src/images/node-color.png b/src/images/node-color.png old mode 100644 new mode 100755 diff --git a/src/images/opacity-1.png b/src/images/opacity-1.png old mode 100644 new mode 100755 diff --git a/src/images/opacity-2.png b/src/images/opacity-2.png old mode 100644 new mode 100755 diff --git a/src/images/opacity-colors.png b/src/images/opacity-colors.png old mode 100644 new mode 100755 diff --git a/src/images/opacity-scheme.png b/src/images/opacity-scheme.png old mode 100644 new mode 100755 diff --git a/src/images/threshold-1.png b/src/images/threshold-1.png old mode 100644 new mode 100755 diff --git a/src/images/threshold-2.png b/src/images/threshold-2.png old mode 100644 new mode 100755 diff --git a/src/images/threshold-scheme.png b/src/images/threshold-scheme.png old mode 100644 new mode 100755 diff --git a/src/images/tooltip-options-1.png b/src/images/tooltip-options-1.png old mode 100644 new mode 100755 diff --git a/src/images/tsds-query.png b/src/images/tsds-query.png old mode 100644 new mode 100755 diff --git a/src/images/twin-tubes.png b/src/images/twin-tubes.png old mode 100644 new mode 100755 diff --git a/src/js/index/DataSource.js b/src/js/index/DataSource.js old mode 100644 new mode 100755 diff --git a/src/js/index/LeafletMap.js b/src/js/index/LeafletMap.js old mode 100644 new mode 100755 diff --git a/src/js/index/Legend.js b/src/js/index/Legend.js old mode 100644 new mode 100755 diff --git a/src/js/map/BaseLayer.js b/src/js/map/BaseLayer.js old mode 100644 new mode 100755 diff --git a/src/js/map/BaseMap.js b/src/js/map/BaseMap.js old mode 100644 new mode 100755 diff --git a/src/js/map/LeafletMap.js b/src/js/map/LeafletMap.js old mode 100644 new mode 100755 diff --git a/src/js/map/NetworkLayer.js b/src/js/map/NetworkLayer.js old mode 100644 new mode 100755 diff --git a/src/js/map/SingleTubeLayer.js b/src/js/map/SingleTubeLayer.js old mode 100644 new mode 100755 index db5ad4e7..bbcb8ca9 --- a/src/js/map/SingleTubeLayer.js +++ b/src/js/map/SingleTubeLayer.js @@ -428,9 +428,10 @@ var SingleTubeLayer = function(params){ //--- UPDATE -- Update any existing endpoints endpoints.select('.popHighlight') - .style("fill", function(d){ - return d.endpointColor = undefined ? layer.endpointColor() : d.endpointColor; - }) + //.style("fill", function(d){ + // return d.endpointColor = undefined ? layer.endpointColor() : d.endpointColor; + //}) + .style('fill',layer.endpointColor()||d.endpointColor) .attr("fill-opacity", function(d){ return d.endpointOpacity = undefined ? layer.endpointOpacity() : d.endpointOpacity; }); diff --git a/src/js/map/TrafficLayer.js b/src/js/map/TrafficLayer.js old mode 100644 new mode 100755 diff --git a/src/js/map/TwinTubeLayer.js b/src/js/map/TwinTubeLayer.js old mode 100644 new mode 100755 index 7e381a20..3b4da1e1 --- a/src/js/map/TwinTubeLayer.js +++ b/src/js/map/TwinTubeLayer.js @@ -679,9 +679,10 @@ var TwinTubeLayer = function(params){ //--- UPDATE -- Update any existing endpoints endpoints.select('.popHighlight') - .style("fill", function(d){ - return d.endpointColor = undefined ? layer.endpointColor() : d.endpointColor; - }) + //.style("fill", function(d){ + // return d.endpointColor = undefined ? layer.endpointColor() : d.endpointColor; + // }) + .style('fill',layer.endpointColor()||d.endpointColor) .attr("fill-opacity", function(d){ return d.endpointOpacity = undefined ? layer.endpointOpacity() : d.endpointOpacity; }); diff --git a/src/js/util/DataSource.js b/src/js/util/DataSource.js old mode 100644 new mode 100755 diff --git a/src/js/util/DataSourceFormatter.js b/src/js/util/DataSourceFormatter.js old mode 100644 new mode 100755 diff --git a/src/js/util/Enums.js b/src/js/util/Enums.js old mode 100644 new mode 100755 diff --git a/src/js/util/Functions.js b/src/js/util/Functions.js old mode 100644 new mode 100755 diff --git a/src/js/util/Geometry.js b/src/js/util/Geometry.js old mode 100644 new mode 100755 diff --git a/src/js/util/Interval.js b/src/js/util/Interval.js old mode 100644 new mode 100755 diff --git a/src/js/util/Topology.js b/src/js/util/Topology.js old mode 100644 new mode 100755 diff --git a/src/js/util/UrlFormatter.js b/src/js/util/UrlFormatter.js old mode 100644 new mode 100755 diff --git a/src/js/widget/InfoDiv.js b/src/js/widget/InfoDiv.js old mode 100644 new mode 100755 index 08212d8a..7a11c973 --- a/src/js/widget/InfoDiv.js +++ b/src/js/widget/InfoDiv.js @@ -59,7 +59,7 @@ var InfoDiv = function(params){ case 'bl': _infoDiv.style('position', 'relative') .style('bottom', '0px') - .style('left', '0px'); + .style('left', '20px'); break; case 'tr': _infoDiv.style('position', 'relative') diff --git a/src/js/widget/Legend.js b/src/js/widget/Legend.js old mode 100644 new mode 100755 diff --git a/src/module.js b/src/module.js old mode 100644 new mode 100755 diff --git a/src/partials/display_editor.html b/src/partials/display_editor.html old mode 100644 new mode 100755 index 44b55e62..4f9775ce --- a/src/partials/display_editor.html +++ b/src/partials/display_editor.html @@ -73,6 +73,12 @@
Colors
+
+ + + + +
diff --git a/src/partials/editor.html b/src/partials/editor.html old mode 100644 new mode 100755 diff --git a/src/partials/json_editor.html b/src/partials/json_editor.html old mode 100644 new mode 100755 diff --git a/src/partials/module.html b/src/partials/module.html old mode 100644 new mode 100755 diff --git a/src/plugin.json b/src/plugin.json old mode 100644 new mode 100755 diff --git a/src/scale.js b/src/scale.js old mode 100644 new mode 100755 index 21efa452..b027ef19 --- a/src/scale.js +++ b/src/scale.js @@ -18,6 +18,7 @@ import _ from "lodash"; import * as d3 from 'd3'; let colorSchemes = [ + {name: 'NetSage', value: 'NetSage', invert: 'dark'}, {name: 'RdYlGn', value: 'interpolateRdYlGn', invert: 'always'}, {name: 'Blues', value: 'interpolateBlues', invert: 'dark'}, {name: 'Greens', value: 'interpolateGreens', invert: 'dark'}, @@ -133,6 +134,10 @@ export class Scale { var b=0; switch(color) { + case 'NetSage': + this.calculate(251,174,96,-3,0,3); + break; + case 'interpolateRdYlGn': this.calculate(255,g,b,-3,5,0); break; From d48cf1e7044cd7fb38ed3f6f1c5eb2479d58539f Mon Sep 17 00:00:00 2001 From: MaheshKhanal <42851980+MaheshKhanal@users.noreply.github.com> Date: Wed, 7 Nov 2018 09:05:20 -1000 Subject: [PATCH 2/2] Update to scale.js Made netsage color name more generic. --- src/scale.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/scale.js b/src/scale.js index b027ef19..0c130845 100755 --- a/src/scale.js +++ b/src/scale.js @@ -18,7 +18,7 @@ import _ from "lodash"; import * as d3 from 'd3'; let colorSchemes = [ - {name: 'NetSage', value: 'NetSage', invert: 'dark'}, + {name: 'OrBu', value: 'interpolateOrBu', invert: 'dark'}, {name: 'RdYlGn', value: 'interpolateRdYlGn', invert: 'always'}, {name: 'Blues', value: 'interpolateBlues', invert: 'dark'}, {name: 'Greens', value: 'interpolateGreens', invert: 'dark'}, @@ -134,7 +134,7 @@ export class Scale { var b=0; switch(color) { - case 'NetSage': + case 'interpolateOrBu': this.calculate(251,174,96,-3,0,3); break;