search

equinor / webviz-subsurface-components

Custom subsurface visualizations for use in Webviz and/or Dash.
https://github.com/orgs/equinor/projects/24
Mozilla Public License 2.0
33 stars 40 forks source link

Error message "trailing garbage translate (0, NaN)" in WellLogViewer #1337

Open SteffenEq opened 1 year ago

SteffenEq commented 1 year ago

Hi,

I get a problem when trying to populate The WellLogViewer:

attr.js?f872:31 Error: attribute transform: Trailing garbage, "translate(0,NaN)".

How to reproduce:

  1. Translate example from static storybook to python
  2. Change welllogs to the following
[{"header": {"name": "Test name", "well": "Wellbore 1", "operator": "Test operator", "source": "STAT", "startIndex": 1, "endIndex": 5, "step": 1}, "curves": [{"name": "DEPT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "DVER", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "VSH", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}, {"name": "PHIT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}], "data": [[1.0, 2.0, 3.0, 4.0], [2.0, 3.0, 3.0, 4.0], [3.0, 4.0, 4.0, 5.0], [4.0, 5.0, 5.0, 6.0], [5.0, 6.0, 6.0, 7.0]]}, {"header": {"name": "Test name", "well": "Wellbore 2", "operator": "Test operator", "source": "STAT", "startIndex": 1, "endIndex": 5, "step": 1}, "curves": [{"name": "DEPT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "DVER", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "VSH", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}, {"name": "PHIT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}], "data": [[1.0, 2.0, 3.0, 4.0], [2.0, 3.0, 3.0, 4.0], [3.0, 4.0, 4.0, 5.0], [4.0, 5.0, 5.0, 6.0], [5.0, 6.0, 6.0, 7.0]]}, {"header": {"name": "Test name", "well": "Wellbore 3", "operator": "Test operator", "source": "STAT", "startIndex": 1, "endIndex": 5, "step": 1}, "curves": [{"name": "DEPT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "DVER", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimensions": 1}, {"name": "VSH", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}, {"name": "PHIT", "description": null, "quantity": null, "unit": "M", "valueType": "float", "dimension": 1}], "data": [[1.0, 2.0, 3.0, 4.0], [2.0, 3.0, 3.0, 4.0], [3.0, 4.0, 4.0, 5.0], [4.0, 5.0, 5.0, 6.0], [5.0, 6.0, 6.0, 7.0]]}]

Full stack trace:

eval | @ | attr.js?f872:31
-- | -- | --
  | __WEBPACK_DEFAULT_EXPORT__ | @ | each.js?cefe:5
  | __WEBPACK_DEFAULT_EXPORT__ | @ | attr.js?f872:53
  | renderTicks | @ | index.js?60ef:16
  | __WEBPACK_DEFAULT_EXPORT__ | @ | call.js?0add:4
  | DualScaleTrack.createMeasures | @ | index.js?60ef:16
  | DualScaleTrack.plot | @ | index.js?60ef:16
  | DualScaleTrack.onUpdate | @ | index.js?60ef:16
  | eval | @ | index.js?60ef:16
  | LogController.postUpdateTracks | @ | index.js?60ef:16
  | eval | @ | index.js?60ef:16
  | Promise.finally (async) |   |  
  | LogController._trackEnter | @ | index.js?60ef:16
  | __WEBPACK_DEFAULT_EXPORT__ | @ | call.js?0add:4
  | LogController.updateTracks | @ | index.js?60ef:16
  | LogController.setTracks | @ | index.js?60ef:16
  | setTracksToController | @ | WellLogView.tsx?f2c0:573
  | setTracks | @ | WellLogView.tsx?f2c0:1215
  | componentDidMount | @ | WellLogView.tsx?f2c0:1044
  | commitLifeCycles | @ | react-dom@16.v2_7_0m…12934.14.0.js:19949
  | commitLayoutEffects | @ | react-dom@16.v2_7_0m…12934.14.0.js:22938
  | callCallback | @ | react-dom@16.v2_7_0m…7812934.14.0.js:182
  | invokeGuardedCallbackDev | @ | react-dom@16.v2_7_0m…7812934.14.0.js:231
  | invokeGuardedCallback | @ | react-dom@16.v2_7_0m…7812934.14.0.js:286
  | commitRootImpl | @ | react-dom@16.v2_7_0m…12934.14.0.js:22676
  | unstable_runWithPriority | @ | react@16.v2_7_0m1667812934.14.0.js:2685
  | runWithPriority$1 | @ | react-dom@16.v2_7_0m…12934.14.0.js:11174
  | commitRoot | @ | react-dom@16.v2_7_0m…12934.14.0.js:22516
  | finishSyncRender | @ | react-dom@16.v2_7_0m…12934.14.0.js:21942
  | performSyncWorkOnRoot | @ | react-dom@16.v2_7_0m…12934.14.0.js:21928
  | (anonymous) | @ | react-dom@16.v2_7_0m…12934.14.0.js:11224
  | unstable_runWithPriority | @ | react@16.v2_7_0m1667812934.14.0.js:2685
  | runWithPriority$1 | @ | react-dom@16.v2_7_0m…12934.14.0.js:11174
  | flushSyncCallbackQueueImpl | @ | react-dom@16.v2_7_0m…12934.14.0.js:11219
  | flushSyncCallbackQueue | @ | react-dom@16.v2_7_0m…12934.14.0.js:11207
  | batchedUpdates$1 | @ | react-dom@16.v2_7_0m…12934.14.0.js:21997
  | notify | @ | Subscription.js:16
  | notifyNestedSubs | @ | Subscription.js:88
  | handleChangeWrapper | @ | Subscription.js:93
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | applyProps | @ | executedCallbacks.ts:24
  | (anonymous) | @ | executedCallbacks.ts:45
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | executedCallbacks.ts:41
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | observer | @ | executedCallbacks.ts:33
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | executingCallbacks.ts:31
  | tryCatch | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:40
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | observer | @ | executingCallbacks.ts:15
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee2$ | @ | prioritizedCallbacks.ts:43
  | tryCatch | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | asyncGeneratorStep | @ | prioritizedCallbacks.ts:2
  | _next | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | observer | @ | prioritizedCallbacks.ts:76
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | requestedCallbacks.ts:179
  | tryCatch | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | observer | @ | requestedCallbacks.ts:206
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | requestedCallbacks.ts:179
  | tryCatch | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | observer | @ | requestedCallbacks.ts:206
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | observer | @ | executedCallbacks.ts:118
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | executingCallbacks.ts:31
  | tryCatch | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:40
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | observer | @ | executingCallbacks.ts:15
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee2$ | @ | prioritizedCallbacks.ts:43
  | tryCatch | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | asyncGeneratorStep | @ | prioritizedCallbacks.ts:2
  | _next | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | observer | @ | prioritizedCallbacks.ts:76
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | requestedCallbacks.ts:179
  | tryCatch | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | observer | @ | requestedCallbacks.ts:206
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | observer | @ | executedCallbacks.ts:118
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | executingCallbacks.ts:31
  | tryCatch | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | executingCallbacks.ts:2
  | _next | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:2
  | (anonymous) | @ | executingCallbacks.ts:40
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | observer | @ | executingCallbacks.ts:15
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee2$ | @ | prioritizedCallbacks.ts:43
  | tryCatch | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | asyncGeneratorStep | @ | prioritizedCallbacks.ts:2
  | _next | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | (anonymous) | @ | prioritizedCallbacks.ts:2
  | observer | @ | prioritizedCallbacks.ts:76
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | _callee$ | @ | requestedCallbacks.ts:179
  | tryCatch | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | Promise.then (async) |   |  
  | asyncGeneratorStep | @ | requestedCallbacks.ts:2
  | _next | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | (anonymous) | @ | requestedCallbacks.ts:2
  | observer | @ | requestedCallbacks.ts:206
  | (anonymous) | @ | StoreObserver.ts:49
  | forEach | @ | forEach.js:47
  | (anonymous) | @ | _checkForMethod.js:22
  | f2 | @ | _curry2.js:28
  | (anonymous) | @ | StoreObserver.ts:47
  | dispatch | @ | redux.js:297
  | (anonymous) | @ | index.js:20
  | dispatch | @ | redux.js:691
  | triggerDefaultState | @ | index.js:70
  | (anonymous) | @ | index.js:33
  | (anonymous) | @ | index.js:16
  | storeEffect | @ | APIController.react.js:170
  | commitHookEffectListMount | @ | react-dom@16.v2_7_0m…12934.14.0.js:19866
  | commitPassiveHookEffects | @ | react-dom@16.v2_7_0m…12934.14.0.js:19904
  | callCallback | @ | react-dom@16.v2_7_0m…7812934.14.0.js:182
  | invokeGuardedCallbackDev | @ | react-dom@16.v2_7_0m…7812934.14.0.js:231
  | invokeGuardedCallback | @ | react-dom@16.v2_7_0m…7812934.14.0.js:286
  | flushPassiveEffectsImpl | @ | react-dom@16.v2_7_0m…12934.14.0.js:22988
  | unstable_runWithPriority | @ | react@16.v2_7_0m1667812934.14.0.js:2685
  | runWithPriority$1 | @ | react-dom@16.v2_7_0m…12934.14.0.js:11174
  | flushPassiveEffects | @ | react-dom@16.v2_7_0m…12934.14.0.js:22955
  | (anonymous) | @ | react-dom@16.v2_7_0m…12934.14.0.js:22834
  | workLoop | @ | react@16.v2_7_0m1667812934.14.0.js:2629
  | flushWork | @ | react@16.v2_7_0m1667812934.14.0.js:2584
  | performWorkUntilDeadline | @ | react@16.v2_7_0m1667812934.14.0.js:2196

Thank you!

Vladimir-Kokin commented 1 year ago

@SteffenEq "trailing garbage translate (0, NaN)" message could appear when WellLogViewer has no data to display. In case of your welllogs data WellLogViewer can not find any data mentioned in a template data (prop template) So to populate WellLogViewer you should change a template. For example: { "scale": { "primary": "md", "allowSecondary": true }, "tracks": [ { "plots": [ { "name": "PHIT" } ] } ] } In addition in "VSH", "PHIT" curves you generate wrong value name "dimension" instead of "dimensions".

SteffenEq commented 1 year ago

@Vladimir-Kokin I've also changed the template accordingly, forgot to mention this. Thank you very much for finding the typo. This fixed many of my trailing garbage-errors. Would it be possible to add error messages to faulty input like this (and others)? I've had trailing garbage following me around for some time. Again, thanks!