如何在d3v4上使用d3-jetpack？

Question

我正在尝试重新创建此You Draw It图表：https://bl.ocks.org/1wheel/07d9040c3422dac16bd5be741433ff1e

它需要d3.conventions函数，它在d3-jetpack中，我在这里找到：https://github.com/gka/d3-jetpack

raw d3v4版本在这里：https://raw.githubusercontent.com/gka/d3-jetpack/master/build/d3v4%2Bjetpack.js

^我将此文件保存在与index.html相同的文件夹中。

如何将其导入我的项目的index.html？

ATTEMPT 1

以下是我的尝试：

<script>
var d3 = Object.assign({}, require('d3v4+jetpack.js'));
</script>

这是我得到的错误：Uncaught ReferenceError：require未定义

ATTEMPT 2

在html文件的标头中添加了<script src="d3v4+jetpack.js"></script>。 说d3.conventions仍未找到。

Answer 1

如果您选择同时关注d3 和 jetpack路线，因为您对d3v4+jetpack.js的引用似乎就是这种情况，您< em>不得在脚本中加载vanilla d3。

const d3j = require('d3-jetpack/build/d3v4+jetpack');

以上一行是为我做的。请注意，它会公开d3j而不是d3，因此您当然需要将代码调整为：

const x = d3j.scaleLinear();

希望这能帮到你！