MVC web application as an "app" for SharePoint 2013 - jQuery plugins not working

Our MVC web application contains the jQuery plugin HighCharts. A simple sample was created and works properly on the local dev environment. So we know that this plugin works. It's a very simple pie chart based on their example.

Now we used Visual Studio 2013 using the SharePoint App template to create an MVC website with the same purpose - to display the charting utility getting data from a data source (e.g. SQL Server) but as a SharePoint app.  This SharePoint app would then be deployed to an Office 365 SharePoint site.

When the MVC app is deployed the page comes up but not the data onto the chart.

It seems that the javascript call to get the data isn't "fired".  When I put a debug on the controller method that should be executed it doesn't even go there.

This is my first time dabbing in SharePoint apps so I'm not entirely sure what's wrong.
My initial thought is the Javascript get call is incorrect.  Maybe it's because I'm developing off the local environment and the URL shows something like: http://localhost:1234//Property?SPHostUrl=https%3A%2F%2Fmysite%2Esharepoint%2Ecom%2FDev and the get call doesn't know where to find the method?

Here is a sample of the Javascript call:

<script type="text/javascript">
    //Global Chart
    var chart;
    $(document).ready(function () {

        //define the options
        var options = {
            chart: {
                renderTo: 'container',
                margin: [50, 200, 60, 170]
            },
            title: {
                text: 'Browser market shares at a specific website'
            },
            plotArea: {
                shadow: null,
                borderWidth: null,
                backgroundColor: null
            },
            tooltip: {
                formatter: function () {
                    return '<b>' + this.point.name + '</b>: ' + this.y + ' %';
                }
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',
                        format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                    }
                }
            },
            series: []
        }
        //Calls the JSON
        jQuery.getJSON("GetPieChartData", null, function (items) {
            var series = {
                type: 'pie',
                name: 'Browser Share',
                data: []
            };
            jQuery.each(items, function (itemNo, item) {
                series.data.push({
                    name: item.Key,
                    y: parseFloat(item.Value)
                })
            });
            options.series.push(series);

            //Create the chart
            chart = new Highcharts.Chart(options);
            chart.render();
        });
    });
</script>

and the method is:

  public JsonResult GetPieChartData()
        {
            Dictionary<string, decimal> retVal = new Dictionary<string, decimal>();
            retVal.Add("Firefox", 45m);
            retVal.Add("IE", 26.8m);
            retVal.Add("Chrome", 12.8m);
            retVal.Add("Safari", 8.5m);
            retVal.Add("Opera", 6.2m);
            retVal.Add("Others", 0.7m);
            return Json(retVal.ToArray(), JsonRequestBehavior.AllowGet);
        }

I'm thinking the code below is the one causing the problem?

 jQuery.getJSON("GetPieChartData", null, function (items) 

I'm fairly certain it's not a problem with the HighCharts jQuery plugin because I can get a chart displayed on the local dev environment.  it's when it is pushed to the SharePoint 365 environment as an app that the "get" data call isn't executed. 

Any suggestions and/or recommendations?

Thanks for your time and help.