yAxisTicks on Line Chart - top tick is separated from the rest of the graph

[bhonea]

I'm submitting a ... (check one with "x")

• [*] bug report - search github for a similar issue or PR before submitting
• [ ] feature request
• [ ] support request - use StackOverflow (add the ngx-charts tag) or the gitter chat for support questions

Current behavior When utilizing the yAxisTicks attribute on a line chart, the top most tick is not attached to the rest of the graph.

Expected behavior The top most Y axis tick must be attached to the graph.

Reproduction of the problem Attaching a screenshot to demonstrate, as well as the data set and html used.

<ngx-charts-line-chart
      [results]="historyMetrics"
      [scheme]="colorScheme"
      [xAxis]="true"
      [yAxis]="true"
      [legend]="true"
      [showXAxisLabel]="true"
      [showYAxisLabel]="true"
      [yAxisTicks]="[0,20,40,60,80,100]"
      [xAxisLabel]="Time"
      [yAxisLabel]="Count">
    </ngx-charts-line-chart>

data.txt

Please tell us about your environment: MacOS 10.12.6, Intellij IDEA 2017.2.6, npm

• ngx-charts version: 7.3.0

• Angular version: 5.2.7

• Browser: all

• Language: TypeScript 2.4.2

[Navya-adft]

@bhonea ,How to use [yAxisTicks]="[0,20,40,60,80,100]", when i use the same , its not working.

[kennymce]

Any news on this?

[SDelhey]

I encountered the same problem today, the workaround that fixed it for me was setting the yScaleMin and yScaleMax attribute accordingly.

[AgtHrq]

[yScaleMax]="100"

[Gil9091e10]

I have the problem using yScaleMin, since even if I set the minimum value to zero, the lines come out below the value. Instead of being consecutive on the zero line. Any idea what I'm doing wrong?

<ngx-charts-line-chart [xAxis]="xAxis" [yAxis]="yAxis" [curve]="curve" [scheme]="colorScheme" [results]="gasLines" [yScaleMin]="0" [yScaleMax]="500">