Annotations on graphs displayed in incorrect location

[Dylan Blankenship]

I am extremely new to developing websites, and I am currently working on a website at the following link
https://shoplakecrestvillage.com/shopping-to-educate-w-digital-points-board/

The digital points board is my graph, my problem is that it's being displayed differently then my JS Fiddle page at the following link

https://jsfiddle.net/mktguru/hdtufw3m/16/

It's a WordPress site so i had to smush it all into a single HTML element or the graph just wouldn't load, or have a bunch of errors.

Again, I am extremely new to developing websites and have practically new experience, so any help would be nice.

Below is my smushed HTML code I put into WordPress

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <div id="number_format_chart">
 </div>
<script type="text/javascript">
google.charts.load('current', {packages:['corechart']});
google.charts.setOnLoadCallback(drawChart);


function drawChart() {


     
var data = google.visualization.arrayToDataTable([
         ['School Name', 'Points', { role: 'annotation' } ],
         ['Example School Name', 356789, '356789'],
         ['School Name #2', 546877, '546579'],
         ['School Name #3', 546213, '546213'],
         ['School Name #4', 423567, '423567'],
         ['School Name #5', 423567, '423567'],
         ['School Name #6', 423567, '423567'],
         ['School Name #7', 423567, '423567'],
         ['School Name #8', 423567, '423567'],
         ['School Name #9', 423567, '423567'],
         ['School Name #10', 423567, '423567'],
         ['School Name #11', 423567, '423567'],
         ['School Name #12', 423567, '423567'],
         ['School Name #13', 423567, '423567'],
         ['School Name #14', 423567, '423567'],
         ['School Name #15', 423567, '423567'],
         ['School Name #16', 423567, '423567'],
         ['School Name #17', 423567, '423567'],
         ['School Name #18', 423567, '423567'],
         ['School Name #19', 423567, '423567'],
         ['School Name #20', 789654, '423567']
      ]);
         var options = {
           title: 'Points as of July 2017',
           width: 900,
           height: 800,
           legend: 'none',
           bar: {groupWidth: '95%'},
           hAxis: { gridlines: { count: 0 } }
         };


         var chart = new google.visualization.BarChart(document.getElementById('number_format_chart'));
         chart.draw(data, options);


         document.getElementById('format-select').onchange = function() {
           options['vAxis']['format'] = this.value;
           chart.draw(data, options);
         };
      };
</script>