angular-nvd3給出各種錯誤，說d3.scale是未定義的

Question

我正在嘗試一個非常基本的angular-nvd3概念驗證試圖獲取演示圖表根據angular-nvd3文檔呈現。

看到Plunker

示例代碼中我使用的是直上線圖的例子，但在瀏覽器控制檯收到此錯誤：

angular.js:12477 TypeError: Cannot read property 'category20' of undefined 
    at Object.nv.utils.defaultColor (nv.d3.js:987) 
    at Object.nv.models.scatter (nv.d3.js:11844) 
    at Object.nv.models.line (nv.d3.js:6467) 
    at Object.nv.models.lineChart (nv.d3.js:6696) 
    at Object.scope.api.updateWithOptions (angular-nvd3.js:95) 
    at Object.scope.api.refresh (angular-nvd3.js:45) 
    at Object.<anonymous> (angular-nvd3.js:437) 
    at Object.fn (angular-nvd3.js:505) 
    at n.$digest (angular.js:15826) 
    at n.$apply (angular.js:16097) 

我打過各種圖表選項試圖得到任何會呈現圖表的東西，但是所有變化似乎表明d3.scale是undefined裏面的Object.nv某處。但是，我只是使用angular-nvd3示例中的確切圖表選項和數據。

任何人都可以看到我在做什麼錯了，以及如何使用angular-nvd3時未定義這個d3.scale？

Answer 1

問題是，您使用的NVD3庫是基於D3庫的V3.x，但是您使用D3庫的v4.x。這兩個版本之間的序數範圍API發生了很大變化。

變化

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.1.1/d3.js"></script>

到

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script>

，並應解決這個問題。

我也有一些問題越來越傾向於與Plunkr一起工作，所以我不得不稍微修改你的例子，但核心變化歸結爲1-liner。

http://plnkr.co/edit/bRAtP9xIiDaXnv04RAHu