javascript - Chart.js. Values in a big range. The smallest values are not available -

i use chart.js (http://www.chartjs.org) show traffic usage different units using bar chart. if have big range of usage (1 unit 2.5gb, 2 unit 2.5mb, 3 unit 2.5kb, 4 unit 0b) smallest values not available (i cannot hover on or click on them) when bring them 1 value, gb (2.5,0.0024,2.38e-6,...,0) or mb (2560,2.5,0.0024,...,0). please ideas how display them on 1 chart maintain proportions , ability click , hover on over each bar (even 0)

thanks in advance

ability click , hover on over each bar

unfortunately, bars don't have pointhitdetectionradius equivalent. can override inrange function chart.rectangle give little more vertical detection range.

chart.rectangle.prototype.inrange = function (chartx, charty) {     return (chartx >= this.x - this.width / 2 && chartx <= this.x + this.width / 2) && (charty >= this.y && charty <= (this.base + 5)); }; 

i've extended vertical area 5 units downward x axis, change above axis (just subtract this.y)

fiddle - https://jsfiddle.net/etlfr9ka/

please ideas how display them on 1 chart

as long don't set barshowstroke false see stroke 0 values.

the alternative pick framework supports logarithmic scales or 1 allows split y scale sections - imo bad idea.