comparison client/src/components/gauge/Waterlevel.vue @ 5219:de86a96d55c3 new-fwa

linter
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 12 May 2020 10:04:06 +0200
parents 6b054b91d9b2
children
comparison
equal deleted inserted replaced
5218:7dbb7cc6dbfa 5219:de86a96d55c3
463 const diagram = svg 463 const diagram = svg
464 .append("g") 464 .append("g")
465 .attr("class", "main") 465 .attr("class", "main")
466 .attr( 466 .attr(
467 "transform", 467 "transform",
468 `translate(${dimensions.mainMargin.left}, ${ 468 `translate(${dimensions.mainMargin.left}, ${dimensions.mainMargin.top})`
469 dimensions.mainMargin.top
470 })`
471 ); 469 );
472 470
473 // create container for navigation diagram 471 // create container for navigation diagram
474 const navigation = svg 472 const navigation = svg
475 .append("g") 473 .append("g")
529 .attr("class", "zoom") 527 .attr("class", "zoom")
530 .attr("width", dimensions.width) 528 .attr("width", dimensions.width)
531 .attr("height", dimensions.mainHeight) 529 .attr("height", dimensions.mainHeight)
532 .attr( 530 .attr(
533 "transform", 531 "transform",
534 `translate(${dimensions.mainMargin.left}, ${ 532 `translate(${dimensions.mainMargin.left}, ${dimensions.mainMargin.top})`
535 dimensions.mainMargin.top
536 })`
537 ); 533 );
538 534
539 this.createZoom({ 535 this.createZoom({
540 updaters, 536 updaters,
541 eventRect, 537 eventRect,
849 .call(nowLabel); 845 .call(nowLabel);
850 846
851 // draw in nav 847 // draw in nav
852 navigation 848 navigation
853 .append("path") 849 .append("path")
854 .datum([{ x: new Date(), y: hi + dy }, { x: new Date(), y: lo - dy }]) 850 .datum([
851 { x: new Date(), y: hi + dy },
852 { x: new Date(), y: lo - dy }
853 ])
855 .attr("class", "now-line") 854 .attr("class", "now-line")
856 .attr( 855 .attr(
857 "d", 856 "d",
858 d3 857 d3
859 .line() 858 .line()
1031 zoomLevel 1030 zoomLevel
1032 }) { 1031 }) {
1033 const brush = d3 1032 const brush = d3
1034 .brushX() 1033 .brushX()
1035 .handleSize(4) 1034 .handleSize(4)
1036 .extent([[0, 0], [dimensions.width, dimensions.navHeight]]); 1035 .extent([
1036 [0, 0],
1037 [dimensions.width, dimensions.navHeight]
1038 ]);
1037 1039
1038 const zoom = d3 1040 const zoom = d3
1039 .zoom() 1041 .zoom()
1040 .scaleExtent([1, Infinity]) 1042 .scaleExtent([1, Infinity])
1041 .translateExtent([[0, 0], [dimensions.width, dimensions.mainHeight]]) 1043 .translateExtent([
1042 .extent([[0, 0], [dimensions.width, dimensions.mainHeight]]); 1044 [0, 0],
1045 [dimensions.width, dimensions.mainHeight]
1046 ])
1047 .extent([
1048 [0, 0],
1049 [dimensions.width, dimensions.mainHeight]
1050 ]);
1043 1051
1044 brush.on("brush end", () => { 1052 brush.on("brush end", () => {
1045 if (d3.event.sourceEvent && d3.event.sourceEvent.type === "zoom") 1053 if (d3.event.sourceEvent && d3.event.sourceEvent.type === "zoom")
1046 return; // ignore brush-by-zoom 1054 return; // ignore brush-by-zoom
1047 let s = d3.event.selection || scale.x2.range(); 1055 let s = d3.event.selection || scale.x2.range();