javascript - d3.js v4 错误 jquery 冲突?

标签 javascript

我有一个使用以下脚本的 d3 图:

<script src="http://d3js.org/d3.v4.min.js" charset="utf-8"></script>

我得到错误:

(index):677 Uncaught ReferenceError: d3 is not defined

*我已经尝试过以前的解决方案,我在本地保存脚本并添加字符集,但没有任何运气

我还应该说我可以毫无问题地加载 v3:

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

但是 v4 有一个函数 d3.stratify,我的可视化使用了这个函数。我在加载 jquery 的大型企业 Web 应用程序中托管此页面。当我与企业应用程序(没有 jquery,只有 d3)分开托管我的项目时,它加载正常。

在关闭 jquery 之前,有什么方法可以确定地验证此冲突吗?

谢谢

最佳答案

如果您的页面中有 requirejs 或其他 Commonjs/AMD 实现库,则会出现此问题。

The default UMD bundle is now anonymous. No d3 global is exported if AMD or CommonJS is detected. In a vanilla environment, the D3 microlibraries share the d3 global, even if you load them independently; thus, code you write is the same whether or not you use the default bundle.

所以你的代码应该是这样的:

<html>
<body>
    <script src="https://d3js.org/d3.v4.js"></script>
    <script>console.log(d3)</script>
  </body>
</html>

https://jsfiddle.net/3dxuvjke/2/

或者像这样:

<html>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.js"></script>
    <!-- <script src="https://d3js.org/d3.v4.js"></script> -->
    <script>
    require.config({
      paths: {
        d3: "https://d3js.org/d3.v4"
      }
    });

    require(['d3'], function(d3){
      console.log(d3)
    })
    </script>
  </body>
</html>

https://jsfiddle.net/3dxuvjke/

关于javascript - d3.js v4 错误 jquery 冲突?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45514047/

相关文章:

javascript - 完整日历+过滤显示数据可能吗?

javascript - 如何消除 jQuery 中的冒泡效果?

javascript - 动态设置 AngularJS Directive 元素的属性

javascript - 有没有办法检测所获取的 Firebase token ,是从网络调用还是从缓存中获取的?

javascript - 如何在 JavaScript 中有效地使用共享缓冲区的类型化数组?

javascript - jQuery keyup 事件只触发一次

javascript - 使用 FormData 对象获取 CKeditor 值

javascript - react-native-image-picker 未定义

javascript - 使用 react-router v4、Jest 和 Enzyme 测试组件

javascript - 未捕获的类型错误未定义不是函数