皮加尔图表水平排列

Question

我正在尝试获取我的pygal。SolidGauge图表排列成一条水平线，如下所示：水平行中的图表

但我发现默认情况下，图表垂直堆叠，如下所示：垂直行中的图表

如何让它们水平排列？我正在使用Python 3.5.1，这是我的代码

import pygal
def create_chart():
    gauge_chart = pygal.SolidGauge(show_legend=False, inner_radius=0.70, half_pie=False)
    gauge_chart.add('Max ', [{'value': 58, 'max_value': 100}])
    gauge_chart.add('Min ', [{'value': 42, 'max_value': 100}])
    gauge_chart.add('Mean', [{'value': 28, 'max_value': 100}])
    gauge_chart.render_to_png("chart.png")

if __name__ == "__main__":
    create_chart()

Answer 1

图表

很可能是在<div>元素中呈现

的

默认情况下，<div>元素具有display: block;
并将垂直堆叠

要进行测试，请将以下 CSS 添加到页面

div {
  display: inline-block;
}

如果正确，则图表将水平堆叠，假设屏幕足够宽

如果是这样，请删除测试并向图表容器添加类名，例如

.html

<div class="chart"></div>

然后为类添加 CSS

.css

.chart {
  display: inline-block;
}