我想为不同的分辨率设置不同的dc.js的饼图宽度;为此我想通过css设置饼图的宽度,以便我可以应用不同分辨率的媒体查询。 请给我解决方案,通过css设置dc.js的饼图宽度。
icd9Pie /* dc.pieChart('#gain-loss-chart', 'chartGroup') */
// (_optional_) define chart width, `default = 200`
.width(180) // (optional) define chart height, `default = 200`
.height(160)
// Define pie radius
.radius(80)
// Set dimension
.dimension(icd9Dimension)
// Set group
.group(icd9Group)
// (_optional_) by default pie chart will use `group.key` as
// its label but you can overwrite it with a closure.
.label(function(d) {
return d.key;
}).renderLabel(true)
/
//新代码
icd9Pie /* dc.pieChart('#gain-loss-chart', 'chartGroup') */
// (_optional_) define chart width, `default = 200`
.minWidth(180) // (optional) define chart height, `default = 200`
.minHeight(160)
// Define pie radius
.radius(80)
// Set dimension
.dimension(icd9Dimension)
// Set group
.group(icd9Group)
// (_optional_) by default pie chart will use `group.key` as
// its label but you can overwrite it with a closure.
.label(function(d) {
return d.key;
}).renderLabel(true)
/
答案 0 :(得分:1)
我认为您可能只是遇到了最小尺寸参数minHeight
和@media (max-width: 1280px) {
#test { width: 180px !important; height: 160px !important; }
}
- 默认情况下它们是200。
Docs for minWidth and minHeight
媒体查询没有像你上面指定的那样工作,我不得不添加大括号。这完全适合我:
minWidth
并设置minHeight
和chart.minWidth(100)
.minHeight(100)
以允许它们低于200:
{{1}}