title: Horizontal bar with two yaxes chart js
body: <p>I want to do an horizontal bar with 2 yaxes, Where a bar can have a positive or negative value and positive side has a yaxis and the negative side has other yaxis like the image</p>
  
  <p><img src="https://i.stack.imgur.com/xCzbd.png" alt="chart"></p>
  
  <p>This is my code <a href="https://jsfiddle.net/isivis/tos7mg6b/" rel="nofollow noreferrer">JSFiddle</a>.</p>
  
  <p>I can't change the names of the second yaxes</p>
  
  <p>I add arrays with the same values because i would want two yaxes, It is not necessary to use "chart.js" if you knows other library where i can it use, please tell me</p>
  
  <pre><code>    var canvas = document.getElementById('myChart');
      var extremo1=[-5, 3, 9, -11];
      var extremo2=[-5, 3, 9, -11];
      var data = {
      labels: ["Visua_Verbal", "Secuencial_Global", "Sensitivo_Intuitivo", "Reflexivo_Activo"],
  
      datasets: [
          {
           backgroundColor: 'rgba(63, 191, 191, 0.75)',
           borderColor: 'rgba(63, 191, 191, 0.75)',
           hoverBackgroundColor: 'rgba(191, 63, 63, 1)',
           hoverBorderColor: 'rgba(191, 63, 63, 1)',
                   data: extremo1
          },
          {   
           backgroundColor: 'rgba(63, 191, 191, 0.75)',
           borderColor: 'rgba(63, 191, 191, 0.75)',
           hoverBackgroundColor: 'rgba(191, 63, 63, 1)',
           hoverBorderColor: 'rgba(191, 63, 63, 1)',
                   data: extremo1
          }
      ]
  };
  
  var option = {
        maintainAspectRatio: false,
        responsive: true,
          scales: {
                 xAxes: [{
                   display: true,
                   ticks: {
                   maxTicksLimit: 12
                   }
                 }],
                 yAxes: [{
                    position: "left",
                    display: true,
                    ticks: { 
                    callback:(label,index,labels)=&gt;{
                    label = label.match(/_(\w*)/)[1];
                    return label;
                    }}
                    },
                    {
                     position: "right",
                     display: true,
                     ticks: {
  
                     callback:(label,index,labels)=&gt;{
                     return label ;
                     }
                    }
                   }]
                   },
                   legend: {
                           display: false
                  }
  
  };
  var myLineChart = new Chart(canvas,{
      type: 'horizontalBar',
      data:data,
    options:option
  });
  </code></pre>