More DX of clipping issues

QutEcoacoustics · Jan 23, 2015 · 21491ab · 21491ab
1 parent 08e6763
commit 21491ab
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 12 deletions.
diff --git a/src/app/app.js b/src/app/app.js
@@ -191,7 +191,7 @@ var app = angular.module('baw',
                                });
 
                  // location config
-                 $locationProvider.html5Mode(true);
+                 //$locationProvider.html5Mode(true);
 
                  // http default configuration
                  $httpProvider.defaults.withCredentials = true;

diff --git a/src/app/d3Bindings/eventDistribution/_eventDistribution.scss b/src/app/d3Bindings/eventDistribution/_eventDistribution.scss
@@ -12,7 +12,7 @@ event-distribution-overview, event-distribution-detail {
     fill: black;
 
     & * {
-      shape-rendering: crispEdges;
+      //shape-rendering: crispEdges;
     }
   }
 

diff --git a/src/app/d3Bindings/eventDistribution/distributionDetail.js b/src/app/d3Bindings/eventDistribution/distributionDetail.js
@@ -70,35 +70,40 @@ angular
                     updateScales();
 
                     extentUpdateMain();
+
+
+
                 }
 
                 // other functions
                 function create() {
 
 
                     createChart();
-
-                    mainClip = chart.append("defs")
+                    chart
+                        .attr("height", 0)
+                        .append("defs")
                         .append("clipPath")
-                        .attr("id", "mainClipPath" + uniqueId)
+                        .attr("id", "clip")
                         .append("rect")
                         .attr({
-                            x: 0,
-                            y: 0,
-                            width: 500,
-                            height: 200
-                        });
+                                  width: 500,
+                                  height: 200
+                              });
 
                     updateDimensions();
 
                     createMain();
 
 
+
                 }
 
                 function createChart() {
                     chart = container.append("svg")
-                        .classed("chart", true);
+                        .classed("chart", true)
+                        .attr("width", mainWidth)
+                        .attr("height", mainHeight);
 
 
                 }
@@ -119,6 +124,9 @@ angular
                 function createMain() {
                     // create main surface
                     main = chart.append("g")
+                        .attr("width", mainWidth)
+                        .attr("height", mainHeight)
+                        .classed("main", true)
                         .translate([margin.left, margin.top]);
 
                     // group for separator lines between lanes/categories
@@ -129,7 +137,7 @@ angular
 
                     // group for rects painted in lanes
                     mainItemsGroup = main.append("g")
-                        .attr("clip-path", "url(#mainClipPath" + uniqueId + ")")
+                        .attr("clip-path", "url(#clip)")
                         .classed("mainItemsGroup", true);
 
                     xAxis = new TimeAxis(main, xScale, {position: [0, mainHeight]})
-Original file line number
+Diff line change
@@ Expand Up / @@ -12,7 +12,7 @@ event-distribution-overview, event-distribution-detail { @@
         fill: black;
         & * {
-          shape-rendering: crispEdges;
+          //shape-rendering: crispEdges;
         }
       }
@@ Expand Down @@