2016-06-09 1 views
3

я следующие диаграммы: ChartПоказать все значения График Js у оси

Я хочу буквы в моей оси у, так что я добавил переключатель в мои варианты диаграммы для запуска соответствующего письма для значения у оси. Моя проблема в том, что ось y показывает только четные значения, возвращающиеся в половине значений переключателя (xc, B, A + и т. Д.). Но я хочу показать все значения по оси y, от 0 до 13. Есть ли какой-нибудь метод достижения этого? Помощь очень ценится.

var data = { 
    labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 
    datasets: [{ 
    label: "My First dataset", 
    fill: false, 
    lineTension: 0, 
    backgroundColor: "rgba(75,192,192,0.4)", 
    borderColor: "rgba(75,192,192,1)", 
    borderCapStyle: 'butt', 
    borderDash: [], 
    borderDashOffset: 0.0, 
    borderJoinStyle: 'miter', 
    pointBorderColor: "rgba(75,192,192,1)", 
    pointBackgroundColor: "#fff", 
    pointBorderWidth: 2, 
    pointHoverRadius: 5, 
    pointHoverBackgroundColor: "rgba(75,192,192,1)", 
    pointHoverBorderColor: "rgba(220,220,220,1)", 
    pointHoverBorderWidth: 2, 
    pointRadius: 1, 
    pointHitRadius: 10, 
    data: [0, 1, 3, 4, 5, 6, 7, 9, 10, 11, 12, 13], 
    }] 
}; 

var options = { 
    scales: { 
    yAxes: [{ 
     ticks: { 
     // Create scientific notation labels 
     callback: function(value, index, values) { 
      switch (value) { 
      case 0: 
       return 'XC'; 
      case 1: 
       return 'C'; 
      case 2: 
       return 'B'; 
      case 3: 
       return 'A'; 
      case 4: 
       return 'A+'; 
      case 5: 
       return 'BA'; 
      case 6: 
       return 'N+'; 
      case 7: 
       return 'C-'; 
      case 8: 
       return 'D+'; 
      case 9: 
       return 'D'; 
      case 10: 
       return 'D-'; 
      case 11: 
       return 'N'; 
      case 12: 
       return 'N-'; 
      case 13: 
       return 'NR'; 
      default: 
       return ''; 
       break; 
      } 
     } 
     } 
    }] 
    } 
}; 

var ctx = $('#chart'); 
var chart = new Chart(ctx, { 
    type: 'line', 
    data: data, 
    options: options 
}); 
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<canvas id="chart"></canvas> 
+0

Hi chartjs позволяя значения YAxis видны ДО 10 данных: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10], если и увеличить больше его автоматического регулирования –

+0

@ gayathri: хорошо, но можете ли вы дать мне работу для этого? –

+0

Может быть [это] (https://github.com/chartjs/Chart.js/issues/2801) помогает кому-то – SimonH

ответ

4

В клещах объекта можно также поставить min, max и stepSize переопределить автоматический по умолчанию и изменить поведение

(более подробную информацию можно бен увидеть в docs на всех доступных свойства)

ticks: { 
    min: 0, 
    max: 13, 
    stepSize: 1, 
    ........REST OF THE OBJECT..... 

Fiddle

+0

Life saver в лучшем виде !!! Mwah !!!! <3 <3 –

+0

можно найти здесь http://www.chartjs.org/docs/latest/axes/cartesian/linear.html?h=ticks%3A%20%7B действительно не интуитивно, чтобы заметить .. – Blauhirn

Смежные вопросы