Question

我想让我的pygal.SolidGauge图表排成一条水平线，如下所示： charts in horizontal row

但是我发现默认情况下图表是垂直堆叠的，如下所示： charts in vertical row

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

@SpringBootApplication
public class SpringBootJournalApplication {

@Bean
InitializingBean saveData(JournalRepository repo){
    return ()->{
        repo.save(new Journal("text1",LocalDate.now(),"date1"));
        repo.save(new Journal("text2",LocalDate.now(),"date2"));
        repo.save(new Journal("text3",LocalDate.now(),"date3"));
        repo.save(new Journal("text4",LocalDate.now(),"date4"));
    };
}

public static void main(String[] args) {
    SpringApplication.run(SpringBootJournalApplication.class, args);
}
}

Answer 1

图表最有可能是在<div>元素中呈现

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

进行测试，将以下css添加到页面

div {
  display: inline-block;
}

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

如果是，请删除测试并将类名添加到图表容器中，例如

html

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

然后为类添加css

css

.chart {
  display: inline-block;
}

pygal图表水平排列

1 个答案: