dc.js легенда не отображается

Question

У меня есть круговая диаграмма, которую я показываю в квадрате <div>. Круговая диаграмма отображается хорошо, и когда я проверяю элемент на странице, я вижу легенду, но имеет ширину и высоту 0. Я попытался использовать .dc-legend svg { width: 100px; height: 100px; }, чтобы заставить его быть определенного размера, но он остается 0x0

<div class="quadrant_right"> 
<div id="CityCharttext"><span>Dummy graph</span></div> 
    <div id="city-chart"></div> 
</div> 
<script> 
    function InitPieChart(string){ 
     // cities.forEach(function(city){ 
      cities.forEach(function(city){ 
      DataForPieGraph.push({Name:city,data:(test.SumHelper(Projectsall, city, string))}); 
      }) 
    var ndx   = crossfilter(DataForPieGraph), 
    nameDim = ndx.dimension(function(d) {return d.Name;}), 
    spendPerName = nameDim.group().reduceSum(function(d) {return +d.data;}); 

      CityChart 
      .width(200).height(176) 
      .dimension(nameDim) 
      .group(spendPerName) 
      .innerRadius(30) 
      .colors(['#39393B', '#58585B', '#858688', '#A7A9AB','#E8EBF1','#C4D6ED','#64BBE3','#049FD9','#097DBC','#004BAF']) 
      .label(function(d) { return d.data.value}) 
      .legend(dc.legend().x(0).y(0).itemHeight(13).gap(5)); 
      CityChart.render() 

    } 
</script> 

Я оставил кучу других вещей, чтобы сфокусировать свою тему на этом вопросе и не загромождать код, но я, возможно, что-то упустил.

Спасибо заранее!

CSS

  #city-chart svg { width: 350px; } 
    #city-chart{ 
     width:350px; 
     border: 1px solid black; 
     height: 100%; 
     margin: 0px -1px; 
     position:relative; 
    float:left; 
    } 

Answer 1

Попробуйте установить CSS для # города-графике тоже.