fix #7955 add tmap8 app (#7966)

Author: moellep

sirepo/feature_config.py

@@ -37,6 +37,7 @@
         "radia",
         "shadow",
         "srw",
+        "tmap8",
     )
 )
 

sirepo/package_data/static/html/plot2d.html

@@ -29,7 +29,9 @@
           <text class="main-title" ng-attr-x="{{ width / 2 }}" ng-attr-y="-{{ margin.top / 2 }}"></text>
           <text class="sub-title" ng-attr-x="{{ width / 2 }}" y="0" dy="-.5em"></text>
           <text class="x-base" text-anchor="end" ng-attr-x="{{ width + margin.right - 5 }}" ng-attr-y="{{ height + 40 }}"></text>
-            <g ng-repeat="fp in focusPoints" class="focus" style="display: none;" data-focus-circle="" data-focus-point="fp"><circle r="6"></circle></g>
+            <g ng-repeat="fp in focusPoints">
+              <g ng-if="hasFocusPoint(plots[$index])" class="focus" style="display: none;" data-focus-circle="" data-focus-point="fp"><circle r="6"></circle></g>
+            </g>
           <svg class="plot-viewport" ng-attr-width="{{ width }}" ng-attr-height="{{ height }}">
             <rect style="fill: none; pointer-events: all;" ng-attr-width="{{ width }}" ng-attr-height="{{ height }}"></rect>
             <path class="line line-0"></path>

sirepo/package_data/static/html/tmap8-viz.html

@@ -0,0 +1,19 @@
+<div class="container-fluid">
+  <div class="row">
+    <div class="col-lg-6 col-xxl-4">
+        <div data-basic-editor-panel="" data-view-name="simulationSettings"></div>
+    </div>
+    <div class="col-lg-6 col-xxl-4" data-ng-if="appState.models.rpnVariables">
+      <div data-simple-panel="simulationStatus">
+        <div data-sim-status-panel="viz.simState" data-start-function="viz.startSimulation()"></div>
+      </div>
+    </div>
+    <div class="col-lg-6 col-xxl-4" data-ng-if="viz.simState.getFrameCount() > 0">
+      <div
+        data-report-panel="parameter"
+        data-model-name="plotAnimation"
+        data-panel-title="{{ viz.reportTitle }}"
+      ></div>
+    </div>
+  </div>
+</div>

sirepo/package_data/static/js/sirepo-lattice.js

@@ -592,6 +592,15 @@ SIREPO.app.service('rpnService', function(appState, requestSender, $rootScope) {
             });
     };
 
+    self.valueAsString = (value) => {
+        if (! angular.isDefined(value)) {
+            return value;
+        }
+        return value > 10**8
+             ? value.toExponential()
+             : value.toString();
+    };
+
     $rootScope.$on('rpnVariables.changed', clearBooleanValues);
     appState.whenModelsLoaded($rootScope, clearBooleanValues);
 });
@@ -2806,7 +2815,7 @@ SIREPO.app.directive('rpnStatic', function(rpnService) {
                 }
                 return $scope.isError
                     ? ''
-                    : rpnService.getRpnValueForField($scope.model, $scope.field);
+                    : rpnService.valueAsString(rpnService.getRpnValueForField($scope.model, $scope.field));
             };
         },
     };
@@ -2896,7 +2905,7 @@ SIREPO.app.directive('rpnValue', function(appState, rpnService, $timeout) {
                 if (ngModel.$isEmpty(value)) {
                     return value;
                 }
-                return value.toString();
+                return rpnService.valueAsString(value);
             });
 
             // handle programmatic changes - don't step on current parsing

sirepo/package_data/static/js/sirepo-plotting.js

@@ -685,6 +685,11 @@ SIREPO.app.factory('plotting', function(appState, frameCache, panelState, utilit
             return json.aspectRatio || defaultRatio || 1.0;
         },
 
+        hasFocusPoint: function(plot) {
+            // a "band" plot has no single focus value
+            return ! plot || plot.style !== 'band';
+        },
+
         initialHeight: function(scope) {
             return scope.isAnimation ? 1 : INITIAL_HEIGHT;
         },
@@ -1167,6 +1172,7 @@ SIREPO.app.service('plot2dService', function(appState, layoutService, panelState
         $.extend($scope, attrs);
         $scope.width = $scope.height = 0;
         $scope.dataCleared = true;
+        $scope.hasFocusPoint = plotting.hasFocusPoint;
         $scope.axes = {
             x: layoutService.plotAxis($scope.margin, 'x', 'bottom', refresh),
             y: layoutService.plotAxis($scope.margin, 'y', 'left', refresh),
@@ -2000,6 +2006,9 @@ SIREPO.app.directive('interactiveOverlay', function(focusPointService, keypressS
                     if (fpIndex === 0) {
                         fmtText = fmtText + fpt.xText + '\n';
                     }
+                    if (! plotting.hasFocusPoint(plotScope.plots && plotScope.plots[fpIndex])) {
+                        return;
+                    }
                     fmtText = fmtText + fpt.yText;
                     if (fpt.fwhmText) {
                         fmtText = fmtText + ', ' + fpt.fwhmText;
@@ -2259,11 +2268,12 @@ SIREPO.app.directive('popupReport', function(focusPointService, plotting) {
                 <div style="padding: 4px; white-space: nowrap">
                 <div style="height: 20px"><span data-text-with-math="focusPoints[0].config.xAxis.label"
                   data-is-dynamic="1"></span> = {{ pointText(0, true) }} {{ focusPoints[0].config.xAxis.units }}</div>
-                <div data-ng-style="{ opacity: opacity($index) }" style="height: 20px"
-                  data-ng-repeat="p in plots track by p._label + $index">
-                  <div style="display:inline" data-color-circle="p"></div>
-                  <span data-text-with-math="p._label"></span> = {{ pointText($index) }}
-                  <span data-text-with-math="p._units"></span>
+                <div data-ng-repeat="p in plots track by p._label + $index">
+                  <div data-ng-if="hasFocusPoint(p)" data-ng-style="{ opacity: opacity($index) }" style="height: 20px">
+                    <div style="display:inline" data-color-circle="p"></div>
+                    <span data-text-with-math="p._label"></span> = {{ pointText($index) }}
+                    <span data-text-with-math="p._units"></span>
+                  </div>
                 </div>
                 </div>
               </div>
@@ -2274,6 +2284,7 @@ SIREPO.app.directive('popupReport', function(focusPointService, plotting) {
 
             // prevent memory leak?
             $scope.focusPoints.allowClone = true;
+            $scope.hasFocusPoint = plotting.hasFocusPoint;
 
             function adjustBounds(bound, dim) {
                 if (bound < 1) {
@@ -3720,10 +3731,22 @@ SIREPO.app.directive('parameterPlot', function(appState, focusPointService, layo
             function setupPlots(json) {
                 const viewport = $scope.select('.plot-viewport');
                 viewport.selectAll('.line').remove();
+                viewport.selectAll('.band').remove();
                 viewport.selectAll('g.param-plot').remove();
                 json.plots.forEach(function(plot, ip) {
                     plot.strokeWidth = plot.strokeWidth || 2.0;
-                    if (plot.style === 'scatter') {
+                    if (plot.style === 'band') {
+                        // a shaded region between plot.pointsLower and plot.pointsUpper,
+                        // e.g. a confidence/uncertainty interval
+                        viewport.append('path')
+                            .attr('class', 'param-plot band')
+                            .attr('data-sr-index', ip)
+                            .style('fill', plot.color)
+                            .style('stroke', 'none')
+                            .style('opacity', plot.opacity || 0.25)
+                            .datum(plot.pointsUpper);
+                    }
+                    else if (plot.style === 'scatter') {
                         let clusterInfo;
                         let circleRadius = plot.circleRadius || 2;
                         if (json.clusters) {
@@ -3896,6 +3919,24 @@ SIREPO.app.directive('parameterPlot', function(appState, focusPointService, layo
                             return yaxis.scale(scaleFunction ? scaleFunction(d) : d);
                         });
                 };
+                // area generator for a "band" plot, filling between pointsLower and pointsUpper
+                $scope.plotGraphArea = function(plotIndex) {
+                    const p = ($scope.plots || [])[plotIndex] || {};
+                    const xPoints = p.x_points || $scope.axes.x.points;
+                    const yaxis = p._yaxis == 'right' ? $scope.axes.y2 : $scope.axes.y;
+                    return d3.svg.area()
+                        .x(function(d, i) {
+                            return $scope.axes.x.scale(xPoints[i]);
+                        })
+                        .y0(function(d, i) {
+                            const v = p.pointsLower[i];
+                            return yaxis.scale(scaleFunction ? scaleFunction(v) : v);
+                        })
+                        .y1(function(d, i) {
+                            const v = p.pointsUpper[i];
+                            return yaxis.scale(scaleFunction ? scaleFunction(v) : v);
+                        });
+                };
                 $scope.graphLine = d3.svg.line()
                     .x(function(d, i) {
                         return $scope.axes.x.scale($scope.axes.x.points[i]);
@@ -3951,19 +3992,22 @@ SIREPO.app.directive('parameterPlot', function(appState, focusPointService, layo
                         continue;
                     }
                     for (const p of plots) {
-                        const y = p.points[i];
+                        // a "band" plot has no single points[i] value -- use both edges
+                        const ys = p.style === 'band' ? [p.pointsLower[i], p.pointsUpper[i]] : [p.points[i]];
                         const ia = p._yaxis == 'left' ? 0 : 1;
-                        if (ydom[ia]) {
-                            if (y < ydom[ia][0]) {
-                                ydom[ia][0] = y;
+                        for (const y of ys) {
+                            if (ydom[ia]) {
+                                if (y < ydom[ia][0]) {
+                                    ydom[ia][0] = y;
+                                }
+                                else if (y > ydom[ia][1]) {
+                                    ydom[ia][1] = y;
+                                }
                             }
-                            else if (y > ydom[ia][1]) {
-                                ydom[ia][1] = y;
+                            else {
+                                ydom[ia] = [y, y];
                             }
                         }
-                        else {
-                            ydom[ia] = [y, y];
-                        }
                     }
                 }
                 ['left', 'right'].forEach((v, i) => {
@@ -4003,6 +4047,12 @@ SIREPO.app.directive('parameterPlot', function(appState, focusPointService, layo
                         d3.select(this).attr('d', $scope.plotGraphLine(ip));
                     });
 
+                $scope.select('.plot-viewport').selectAll('.band')
+                    .each(function (d) {
+                        var ip = parseInt(d3.select(this).attr('data-sr-index'));
+                        d3.select(this).attr('d', $scope.plotGraphArea(ip));
+                    });
+
                 $scope.select('.plot-viewport').selectAll('g.param-plot')
                     .each(function (d, ip) {
                         var sp = d3.select(this).selectAll('.scatter-point');