d3 selectAll不是具有Vue和AudioContext的函数

我有一个带有html5音频代码的vue.js应用程序（用于跟踪AudioContext）。有趣的是，它在没有Vue的情况下工作（使用完全相同的代码）

简化的vue代码

// import stuff

let player = new Vue({
  data: function() {
    return {
      audio: null,
      analyser: null,
      frequencyData: null,
      svg: null,
      currentTrack: data
    }
  },

  methods: {
    initAllTracks: function() {
      // ...
      this.initPlayer();
    },

    initPlayer: function() {
      this.audio = new Audio('audio_source_link');
      this.audio.crossOrigin = 'anonymous';

      this.startPlaying();
    },

    startPlaying: function() {
      // ...
      this.initAudioContext();
    },

    initAudioContext: function() {
      let audioCtx = new (window.AudioContext || window.webkitAudioContext)();
      let audioSrc = audioCtx.createMediaElementSource(this.audio);
      this.analyser = audioCtx.createAnalyser();

      audioSrc.connect(this.analyser);
      audioSrc.connect(audioCtx.destination);

      this.audio.play();

      this.frequencyData = new Uint8Array(5);
      this.svg = d3.select('.app').append('svg');

      this.renderSVG();
    },

    renderSVG: function() {
      requestAnimationFrame(this.renderSVG);

      console.log('FIRST: ' , this.frequencyData);

      this.analyser.smoothingTimeConstant = 1 - (4 / 100);
      this.analyser.getByteFrequencyData(this.frequencyData);

      console.log('SECOND: ' , this.frequencyData);

      var radiusScale = d3.scale.linear().domain([0, d3.max(this.frequencyData)]).range([0, 1200 / 2]);
      var circles = this.svg.selectAll('circle').data(this.frequencyData);

      circles.enter().append('circle');

      circles
        .attr({
          // ...
        });

      circles.exit().remove();
    }
  }
});

我调用

initAllTracks（）

，应用程序启动

但是，在代码行

var circles=this.svg.selectAll（'circle'）.data（this.frequencyData）我变成了错误
类型错误：this.svg.selectAll不是一个函数

console.log为我提供了一个正确的
Uint8Array
。然后我尝试删除
this.frequencyData
（可能vue.js中的绑定有问题）并使其全局化。但一切都没有改变

这又是一件有趣的事情：如果我在没有Vue.js的情况下编写所有代码（只需在开始时定义所有变量，然后写下函数）。这很有效

//编辑：

我将
renderSVG
函数放入
initAudioContext
函数中，它就可以工作了。为什么？
问题在于：

this.svg = d3.select('.app').append('svg');

不要将vue数据设置为d3实例，因为vue数据将更改d3实例原型

尝试将其分配给独立变量。
问题在于：

this.svg = d3.select('.app').append('svg');

不要将vue数据设置为d3实例，因为vue数据将更改d3实例原型

尝试将其分配给独立变量