横向图例 React-vis

Question

我对 React-vis 中的水平图例有疑问。我用了这个道具orientation="horizo​​ntal"，但是什么都没有……

<DiscreteColorLegend width={2000} orientation="horizontal" items={json.items.map((item) => item.name)} colors={json.items.map((item) => item.color)} />

Answer 1

我自己刚刚解决了这个问题。就我而言，样式表没有被正确引用。我确实尝试将它导入到我的 js 文件的顶部，如下所示：

import '../../../../node_modules/react-vis/dist/style.css';

但是，我后来发现只有将 style.css 文件从 /node_modules/react-vis/dist 复制到 app/assets/stylesheets 后，这些样式才真正起作用，其中我的 application.css 文件有一个 require_tree 语句，其中包括有问题的样式表。

这是一种盗版的解决方法，因为从 /node_modules/react-vis/dist 中的主页导入样式表可能是最佳做法，但它对我有用。