SVG navaid improvements
#CTCTOWALTZ-900
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import _ from 'lodash';
-import angular from 'angular';
+import _ from "lodash";
+import angular from "angular";
+import {select} from "d3-selection";
-function resize(elem) {
- const width = elem.parent()[0].clientWidth || 1024;
- elem.find('svg').attr('width', width);
- elem.find('svg').attr('height', width * 0.6);
+function resize(elem, win) {
+
+ const width = win.innerWidth * 0.7 || 1024;
+
+ select(elem[0])
+ .select('svg')
+ .attr('width', `${width}px`)
+ .attr('height', `${width*0.8}px`);
}
@@ -33,18 +38,17 @@ function controller($element, $window) {
vm.$onInit = () => angular
.element($window)
- .on('resize', () => resize($element));
+ .on('resize', () => resize($element, $window));
vm.$onDestroy = () => angular
.element($window)
- .off('resize', () => resize($element));
+ .off('resize', () => resize($element, $window));
vm.$onChanges = () => {
if (!vm.diagram) return;
+ const svg = $element.append(vm.diagram.svg);
- const svg = $element.html(vm.diagram.svg);
-
- $window.setTimeout(() => resize(svg), 100);
+ resize($element, $window);
const dataProp = 'data-' + vm.diagram.keyProperty;
const dataBlocks = svg.querySelectorAll('[' + dataProp + ']');
