javascript - dc.js 1.7 中的饼图图例未显示

标签 javascript d3.js legend pie-chart dc.js

我正在尝试在 dc.js 中创建饼图图例。然而,没有传说。它只是……没有出现。一切看起来都和我使用 legend 命令之前一样。

Here is the JSBin

这是图例代码:

.legend(dc.legend().x(80).y(70).itemHeight(13).gap(5));

下面是相关代码的其余部分:

  var companyDimension = data.dimension(function(d) {return d.company;});
  var totalSalesByCompany = companyDimension.group().reduceSum(function(d) {return d.total;});
  var pieChartCompanySales = dc.pieChart("#pie-chart-sales-by-company");
  pieChartCompanySales
    .width(150).height(150)
    .dimension(companyDimension)
    .group(totalSalesByCompany)
    .legend(dc.legend().x(80).y(70).itemHeight(13).gap(5));

  dc.renderAll();

我正在从 this tutorial 获取图例代码, 它似乎用 official docs 查看.我做错了什么?

最佳答案

我认为你没有做错任何事。这是您使用的 dc.js 版本的问题。请查看http://jsbin.com/xasenusu/1/ .我已经更改了 dc.js 的版本,并为 div 提供了更多空间给 svg。

 <!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.7/crossfilter.min.js"></script>
  <script type="text/javascript" src="http://dc-js.github.io/dc.js/js/dc.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
    <style>
    #pie-chart-sales-by-company svg{width:350px;}</style>
</head>
<body>

<div id="pie-chart-sales-by-company"></div>
</body>
</html>

关于javascript - dc.js 1.7 中的饼图图例未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24189840/

相关文章:

python - seaborn 点图和箱线图位于一个图中,但在 x 轴上移动

r - ggplot中没有边框的圆形

javascript - 刷新页面并插入新值后,本地存储值会重置

javascript - 获取一个span的值并插入到另一个div中

javascript - d3 缩放变换有问题。错误 : [ts] Property 'translate' does not exist on type 'Event | BaseEvent'

javascript - 将 JavaSscript 构造函数属性传递给 mouseover 函数并仍然使用 d3.select(this)

javascript - 显示带有标签的城市/兴趣点的 geoChoroplethChart map

javascript - 在另一个类中使用函数 onSubmit (REACT.js)

javascript - 带有 Firebase 实时数据库的 GoogleMap - Javascript

r - geom_vline() 图例的位置发生变化