Browse Source

feat(profiling): disable measurement charts from changing Y axis on spans and flamechart (#55487)

Measurement charts cannot pan vertically, however, the matrix transform
still includes the Y transform when the mouse moves (zoom/pan), which
can cause the flamechart and spans view to jump positions.

I could opt to ensure the Y translation on the dispatched matrix is
always set to 0, but I prefer handling this in the onTransformConfigView
so that we keep our options open in the future when/if we need charts to
have this behavior.
Jonas 1 year ago
parent
commit
cfff3acbd1
1 changed files with 32 additions and 6 deletions
  1. 32 6
      static/app/components/profiling/flamegraph/flamegraph.tsx

+ 32 - 6
static/app/components/profiling/flamegraph/flamegraph.tsx

@@ -829,12 +829,7 @@ function Flamegraph(): ReactElement {
       mat: mat3,
       sourceTransformConfigView: CanvasView<any>
     ) => {
-      if (
-        sourceTransformConfigView === flamegraphView ||
-        sourceTransformConfigView === uiFramesView ||
-        sourceTransformConfigView === cpuChartView ||
-        sourceTransformConfigView === memoryChartView
-      ) {
+      if (sourceTransformConfigView === flamegraphView) {
         flamegraphView.transformConfigView(mat);
         if (spansView) {
           const beforeY = spansView.configView.y;
@@ -874,6 +869,37 @@ function Flamegraph(): ReactElement {
         }
       }
 
+      if (
+        sourceTransformConfigView === uiFramesView ||
+        sourceTransformConfigView === cpuChartView ||
+        sourceTransformConfigView === memoryChartView ||
+        sourceTransformConfigView === batteryChartView
+      ) {
+        if (flamegraphView) {
+          const beforeY = flamegraphView.configView.y;
+          flamegraphView.transformConfigView(mat);
+          flamegraphView.setConfigView(flamegraphView.configView.withY(beforeY));
+        }
+
+        if (spansView) {
+          const beforeY = spansView.configView.y;
+          spansView.transformConfigView(mat);
+          spansView.setConfigView(spansView.configView.withY(beforeY));
+        }
+        if (uiFramesView) {
+          uiFramesView.transformConfigView(mat);
+        }
+        if (batteryChartView) {
+          batteryChartView.transformConfigView(mat);
+        }
+        if (cpuChartView) {
+          cpuChartView.transformConfigView(mat);
+        }
+        if (memoryChartView) {
+          memoryChartView.transformConfigView(mat);
+        }
+      }
+
       canvasPoolManager.draw();
     };