angular-nvd3给出了各种错误,表示d3.尺度未定义
angular-nvd3 gives various errors saying that d3.scale is undefined
我正在尝试一个非常基本的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
是Object.nv
内部的undefined
。然而,我只是使用angular-nvd3
示例中的确切图表选项和数据。
有人能看到我做错了什么吗?在使用angular-nvd3
时,如何克服这个未定义的d3.scale
?
问题是您使用的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行。
http://plnkr.co/edit/bRAtP9xIiDaXnv04RAHu
相关文章:
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 为什么在单独的函数中应用时转换会闪烁/断断续续(D3)
- React中的数据集表示
- 如何在d3.js中返回路径的y坐标
- d3基于用户选择动态更新节点
- 有条件更新d3.js力图中节点的最佳方法
- 为什么我的d3.jsselectAll+过滤器没有过滤
- 使用D3.js计算带有字母间距的文本长度
- d3.js中日期的默认表示形式是什么
- D3.js 折线和面积图 - 想要添加一条由两点定义并表示阈值/最小值的额外线(以便于查看)
- d3.js:如何在力布局图中更改节点的表示
- 在d3甘特图中画一条表示当前日期的竖线
- D3/设计条形图,寻求时髦的方式来表示“;N/A”;
- 如何将 d3 的每个方法与 ES6 箭头表示法一起使用
- 什么是“价值”?用d3表示力有向图
- 用D3.js图表表示python生成的数据
- d3.js:直方图不呈现,如果域不是以0开始(表示[0,*])
- 用D3将数字快速表示为百分比
- angular-nvd3给出了各种错误,表示d3.尺度未定义
- D3 强制导向网络的 JSON 表示