Chartist.js-向Y轴添加添加刻度线(而非值)

时间:2018-07-22 21:55:12

标签: javascript svg

我正在寻找一种方法来添加实际的刻度线,细线,这些刻度线指向Y轴上的值,如下图所示: screen-shot-tick-marks

我尝试将路径附加到'.ct-vertical'线(轴线本身除外),尽管它们已附加在代码中,但它们不可见。我也不确定是否最好将它们添加到每个值的y轴上,或者作为扩展名添加到“ .ct-vertical”行中,我已经在上面尝试过。

任何帮助将不胜感激。

谢谢!

1 个答案:

答案 0 :(得分:0)

您可以尝试在跨度中添加:: before)

span.ct-label.ct-horizontal {
  padding-top: 10px;
  position: relative;

 &::before {  
    content: "|";
    display: block;
    position: absolute;
    top: -5px;
    left: 0px;
    font-size: 5px;
   font-weight: bold;
   color: black;
  }
}

https://codepen.io/duchuy-the-flexboxer/pen/WWjreW

(对于IE,您需要定位元素)