title: How to align horizontal bars to the right
body: <p>I'm using react-chartjs-2.</p>
  <pre><code>&lt;HorizontalBar
                      options={{
                          legend: {
                              display: false,
                          },
                          tooltips: {
                              enabled: false,
                          },
                          hover: {
                              mode: null,
                          },
                          scales: {
                              xAxes: [
                                  {
                                      display: false,
                                      gridLines: {
                                          color: &quot;rgba(0, 0, 0, 0)&quot;,
                                      },
                                      position: 'right'
                                  },
                              ],
                              yAxes: [
                                  {
                                      position: &quot;right&quot;,
                                      ticks: {
                                          reverse: true,
                                      },
                                      gridLines: {
                                          color: &quot;rgba(0, 0, 0, 0)&quot;,
                                      },
                                  },
                              ],
                          },
                          plugins: {
                              tooltip: {
                                  enabled: false,
                              },
                          },
                      }}
                      data={{
                          datasets: [
                              {
                                  label: &quot;My First dataset 2&quot;,
                                  borderWidth: 0,
                                  backgroundColor: [
                                      &quot;#68B68A&quot;,
                                      &quot;#5B9FC9&quot;,
                                      &quot;#83C39F&quot;,
                                      &quot;#85B7D6&quot;,
                                      &quot;#9FD1B4&quot;,
                                      &quot;#C2DAEB&quot;,
                                  ],
                                  data: ...,
                                  barPercentage: 0.5,
                              },
                          ],
                      }}
                  /&gt;
  </code></pre>
  <p>I need to align horizontal bars to the right side like this
  <a href="https://i.stack.imgur.com/hsNo1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hsNo1.png" alt="enter image description here" /></a></p>
  <p>but actual result from my code is this
  <a href="https://i.stack.imgur.com/03Ski.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/03Ski.png" alt="enter image description here" /></a></p>