如何在chartist.js中为图表背景着色

时间:2019-04-16 14:38:46

标签: css chartist.js

我可能缺少一些简单的东西,但是我无法使用chartist.js更改图表的背景颜色

.ct-grid {
background: black;
background-color: black;
stroke:black;
fill:black;
}

我试图仅更改网格区域,而不是整个区域,因此我没有使用ct-chart ct-golden-section

有什么想法吗?

2 个答案:

答案 0 :(得分:0)

下面的内容可能会让您了解如何进行操作..也许使用calc()之类的CSS来找到合适的尺寸,以免您无法静态设置它们

.ct-golden-section:before {
    display: block;
    float: left;
    content: "";
    width: 100%; 
    height: 413px; //set as the size of the container
    padding-bottom: 449px; //set as the size of the container
    background: yellow; // set the bg color wanted for the container
    border-style: solid;
    border-top-width: 15px;
    border-left-width: 49px;
    border-color: orange;  // choose the color of the page u have
    border-bottom-width: 25px;
    border-right-width: 39px;
}

检查屏幕截图以查看以上结果:

https://drive.google.com/file/d/15-vuRMXn2NspkNWfIuvcEZ8xxOEUeEgd/view?usp=sharing

请任何人随时编辑我的临时解决方案

答案 1 :(得分:0)

从 0.11.4 版本开始,您可以使用选项 showGridBackground: true 然后从 css 设置。例如

.ct-grid-background {
        fill: aliceblue;
 }

You can read more information there