trading-vue-js: RangeError: Maximum call stack size exceeded when using overlays

Description

The issue is related to a “RangeError: Maximum call stack size exceeded” message shown on console when using tvjs-overlays. The chart seems works fine however the error is displayed for some overlays.

Screenshot

image

Code (MVP)

<template>
    <trading-vue 
      :width="800"
      :height="600"
      titleTxt="Issue"
      :overlays="overlays"
      :data="chart"
      :index-based="true">
    </trading-vue>
</template>

<script>
import {TradingVue, DataCube} from 'trading-vue-js'
import Overlays from 'tvjs-overlays'

export default {
  name: 'App',
  components: { TradingVue },
  data() {
    return {
      chart: {},
      mock: [[1601287200000,45.91,45.97,45.75,45.88,78968.44669],[1601288100000,45.82,46.16,45.82,46.05,236920],[1601289000000,46.04,46.17,45.74,45.8,916660],[1601289900000,45.82,45.87,45.45,45.45,1406610],[1601290800000,45.46,45.54,45.27,45.53,1560240],[1601291700000,45.54,45.59,45.31,45.32,1300830],[1601292600000,45.31,45.45,44.96,45.01,1941410],[1601293500000,45.01,45.2,44.92,45.19,2551620],[1601294400000,45.21,45.35,45.18,45.24,2862530],[1601295300000,45.24,45.44,45.2,45.42,3283410],[1601296200000,45.42,45.59,45.42,45.57,4114910],[1601297100000,45.58,45.59,45.51,45.57,4863210],[1601298000000,45.56,45.81,45.5,45.52,3932140],[1601298900000,45.53,45.55,45.19,45.26,5851190],[1601299800000,45.26,45.32,45.03,45.25,5433800],[1601300700000,45.26,45.44,45.24,45.37,5421940],[1601301600000,45.37,45.37,44.91,44.96,11471390],[1601302500000,44.96,45,44.67,44.7,12080210],[1601303400000,44.7,44.84,44.61,44.76,14457810],[1601304300000,44.78,45.02,44.78,44.94,13551180],[1601305200000,44.93,44.99,44.87,44.98,12714810],[1601306100000,44.99,45.05,44.87,44.9,15204170],[1601307000000,44.89,45.12,44.88,45.05,18026960],[1601307900000,45.04,45.09,44.91,44.92,12786780],[1601308800000,44.92,44.96,44.82,44.93,11204630],[1601309700000,44.93,44.97,44.89,44.95,13959970],[1601310600000,44.98,44.98,44.7,44.74,17028270],[1601311500000,44.73,44.87,44.6,44.6,17846400],[1601312400000,44.65,44.65,44.65,44.65,85670],[1601314200000,44.65,44.65,44.65,44.65,599690],[1601315100000,44.65,44.65,44.65,44.65,342680],[1601373600000,44.63,44.68,44.32,44.63,24.77187],[1601374500000,44.62,44.84,44.56,44.71,162081.90988],[1601375400000,44.66,44.85,44.57,44.61,476990],[1601376300000,44.64,44.69,44.55,44.66,1035570],[1601377200000,44.66,44.99,44.66,44.97,1158130],[1601378100000,44.99,45.21,44.94,45.1,1709700],[1601379000000,45.1,45.15,44.99,44.99,2045350],[1601379900000,44.98,45.19,44.91,45.12,2322290],[1601380800000,45.12,45.17,44.75,44.77,3271480],[1601381700000,44.78,44.99,44.77,44.99,2426750],[1601382600000,45,45.14,44.82,44.82,3022190],[1601383500000,44.82,44.88,44.67,44.87,5392920],[1601384400000,44.87,44.9,44.67,44.68,6192020],[1601385300000,44.67,44.83,44.6,44.81,5007270],[1601386200000,44.82,44.87,44.64,44.64,5791410],[1601387100000,44.63,44.68,44.48,44.67,6624430],[1601388000000,44.67,44.71,44.47,44.47,7847600],[1601388900000,44.46,44.52,44.39,44.44,7975480],[1601389800000,44.44,44.57,44.39,44.5,8169370]],
      overlays: [ 
        Overlays['BB'], 
      ]
    }
  },
  mounted: function(){
    this.chart = new DataCube({
      ohlcv: this.mock,
      onchart: [
        {
          type: 'BB',
          name: 'BBL',
          data: []
        }
      ]
    })
  }
}
</script>

Data Sample

The data sample os on code above.

Console errors (if any)

Shown on image below.

Additional Info

Using: “trading-vue-js”: “^0.7.0”, “tvjs-overlays”: “^0.2.1”, “vue”: “^2.6.12”

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 1
  • Comments: 15

Commits related to this issue

Most upvoted comments

No worries bros, npm run dev should also work now. Some technical insides: the development config didn’t include DC, so it didn’t recompile WW.

@adsonvinicius I had the same issue. What I did was remove this part conf: { renderer: 'Spline' }, and copied the Spline code from Spline.vue file and paste it to draw() method on particular overlay file (2nd image). (Here I’m taking SMA.vue as an example) FYI @C451

I’ve no idea why it’s happening 😄 but just sharing here in case you want make it work until bug fix.

1st image - image

2st image - image

I see, I will clone the repo and redo step-by-step and check what’s going on. Thanks!

@akjcodes yep, this bug is a consequence of hacking vue.js. I use a dynamic mixin which isn’t actually allowed by the framework. Interesting, how well this will translate to Vue 3.