Here you go :-

ShortTermIncentiveChart.cmp
<aura:component controller="ShortTermIncentiveChartController" implements="flexipage:availableForAllPageTypes" access="global">
    
    <aura:attribute name="selectedTerritoryId" type="id"  description="The id of the territory that the user has selected."/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
    <ltng:require scripts="{!$Resource.Chart}"/>
    <div class="slds-grid slds-wrap">
        <div aura:id="stiChartDiv" class="slds-col slds-size--1-of-1 slds-medium-size--1-of-1">
            <canvas aura:id="stiChart" id="stiChartId"/>
        </div>
    </div>
</aura:component>

ShortTermIncentiveChartController.js
({
    doInit : function(component, event, helper) {
        helper.setupChart(component, event, helper);
    }
})

ShortTermIncentiveChartHelper.js
({
    
    setupChart  : function(component, event, helper) {
        var selectedTerritoryId = component.get('v.selectedTerritoryId');
        var action = component.get("c.GetChartDataJSON");
        action.setParams({ "selectedTerritoryId" : selectedTerritoryId});
        action.setCallback(this, function(a){
            var jsonRetVal = JSON.parse(a.getReturnValue());
            
            var el = component.find('stiChart').getElement();
            var ctx = el.getContext('2d'); 
            new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: jsonRetVal.chartLabels,
                datasets: [
                    {
                        label: "Cumulative Gross Achieved",
                        fill: false,
                        backgroundColor: "rgba(11,111,206,0.8)",                    
                        data: jsonRetVal.chartActualData
                    },
                    {
                        type: 'line',
                        label: "Cumulative Gross Target",
                        fill: true,
                        borderColor: "rgba(164,188,152,1)",
                        backgroundColor: "rgba(184,208,172,0.4)",
                        pointBackgroundColor: "rgba(255,0,0,1)", 
                        data: jsonRetVal.chartTargetData
                    }
                    ]
                },
                options: {
                    hover: {
                        mode: "none"
                    },
                    tooltips : {

                        callbacks : { 
                            title : function() { 
                                return '';
                            },
                            beforeLabel : function(tooltipItem) {
                                if (tooltipItem.xLabel=='Jan') return 'January';
                                if (tooltipItem.xLabel=='Feb') return 'February';
                                if (tooltipItem.xLabel=='Mar') return 'March';
                                if (tooltipItem.xLabel=='Apr') return 'April';
                                if (tooltipItem.xLabel=='May') return 'May';
                                if (tooltipItem.xLabel=='Jun') return 'June';
                                if (tooltipItem.xLabel=='Jul') return 'July';
                                if (tooltipItem.xLabel=='Aug') return 'August';
                                if (tooltipItem.xLabel=='Sep') return 'September';
                                if (tooltipItem.xLabel=='Oct') return 'October';
                                if (tooltipItem.xLabel=='Nov') return 'November';
                                if (tooltipItem.xLabel=='Dec') return 'December';
                                return tooltipItem.xLabel;
                            },
                            label : function(tooltipItem, data) {
                                return data.datasets[tooltipItem.datasetIndex].label + ': ' + (Math.round(tooltipItem.yLabel*100)/100).toLocaleString() + 'm';
                            }
                        }
        
                    },
                    scales: {
                        xAxes: [{
                            scaleLabel: {
                                display: true,
                                labelString: 'Month',
                                fontstyle: 'bold',
                                fontSize: 20
                            }
                        }],
                        yAxes: [{
                            ticks: {
                                beginAtZero:true
                            },
                            scaleLabel: {
                                display: true,
                                labelString: 'Gross Sales (Millions)',
                                fontstyle: 'bold',
                                fontSize: 20
                            }
                        }]
                    }
                }
            });

            
        });
        $A.enqueueAction(action);


    }
})


ShortTermIncentiveChartController.cls
public class ShortTermIncentiveChartController {
    @AuraEnabled
    public static String GetChartDataJSON(Id selectedTerritoryId){
        
        decimal annualTarget;
        decimal runningTotalSales = 0;  
        string[] months = new String[]{'Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'};


        for(region__c r : [select id, Annual_Sales_Target__c from region__c where id = :selectedTerritoryId limit 1]){ 
            annualTarget = r.Annual_Sales_Target__c;
        }
        
        ChartDataWrapper chartData = new ChartDataWrapper();
        for (ShortTermIncentiveValue__c rec: [select Sales_As_At__c, Total__c
                                              from ShortTermIncentiveValue__c
                                              where region__c = :selectedTerritoryId
                                              order by Sales_As_At__c
                                              limit 12]){
            integer month = rec.Sales_As_At__c.month();
            chartData.chartLabels.add(months[month-1]);
            
            chartData.chartTargetData.add(((annualTarget == null ? 0 : annualTarget) / 12 * month) / 1000000);      //Show in millions
            if (rec.Total__c != null){
                runningTotalSales = runningTotalSales + rec.Total__c; 
                chartData.chartActualData.add(runningTotalSales / 1000000);      //Show in millions
            }
        }
        return System.json.serialize(chartData);

    }  


    class ChartDataWrapper
    {
        public List<String> chartLabels {get;set;}
        public List<Decimal> chartTargetData {get;set;}
        public List<Decimal> chartActualData {get;set;}
       
        public ChartDataWrapper(){
            chartLabels = new List<String>();
            chartTargetData = new List<Decimal>();
            chartActualData = new List<Decimal>();
        }
    }

}