Question

我正在尝试在mvc4中的局部视图中呈现 google geochart ，但它显示引用错误：＆＃34; google未定义＆＃34;

但是在简单的视图中，它呈现得很好。下面是渲染我的geochat.i不知道我做错了什么，或者应该采取其他步骤来渲染Google geochat。

我的部分视图（ _mymap.cshtml ）

     <script type='text/javascript' src='http://www.google.com/jsapi'></script>
        <div id='visualization'></div>
        <script type='text/javascript'>

                    function initialize() {
                        google.load('visualization', '1', { 'packages': ['geochart'] });
                        google.setOnLoadCallback(drawVisualization);
                    }

         function drawVisualization() {
                        var data = new google.visualization.DataTable();

                        data.addColumn('string', 'Country');
                        data.addColumn('number', 'Value');
                        data.addColumn({ type: 'string', role: 'tooltip' }); var ivalue = new Array();

                        data.addRows([[{ v: '002', f: 'Africa' }, 0, 'Click to Choose']]);
                        ivalue['002'] = 'http://en.wikipedia.org/wiki/Africa';

                        data.addRows([[{ v: '150', f: 'Europe' }, 1, 'Click to Choose']]);
                        ivalue['150'] = 'http://en.wikipedia.org/wiki/Europe';

                        data.addRows([[{ v: '019', f: 'Americas' }, 2, 'Click to Choose']]);
                        ivalue['019'] = 'http://en.wikipedia.org/wiki/Americas';

                        data.addRows([[{ v: '142', f: 'Asia' }, 3, 'Click to Choose']]);
                        ivalue['142'] = 'http://en.wikipedia.org/wiki/Asia';

                        data.addRows([[{ v: '009', f: 'Australia' }, 4, 'Click to Choose']]);
                        ivalue['009'] = 'http://en.wikipedia.org/wiki/Oceania';

                        var options = {
                            backgroundColor: { fill: '#FFFFFF', stroke: '#FFFFFF', strokeWidth: 0 },
                            colorAxis: { minValue: 0, maxValue: 4, colors: ['#A8A8A8', '#939473', '#B1B38B', '#90AD89', '#87AAAD', ] },
                            legend: 'none',
                            backgroundColor: { fill: '#FFFFFF', stroke: '#FFFFFF', strokeWidth: 0 },
                            datalessRegionColor: '#f5f5f5',
                            displayMode: 'regions',
                            enableRegionInteractivity: 'true',
                            resolution: 'continents',
                            sizeAxis: { minValue: 1, maxValue: 1, minSize: 10, maxSize: 10 },
                            region: 'world',
                            keepAspectRatio: true,
                            width: 600,
                            height: 400,
                            tooltip: { textStyle: { color: '#444444' }, trigger: 'focus' }
                        };
                        var chart = new google.visualization.GeoChart(document.getElementById('visualization'));

                        google.visualization.events.addListener(chart, 'select', function () {
                            var selection = chart.getSelection();
                            //append_to_list(data.getValue(selection[0].row, 0));
                        });


                        chart.draw(data, options);
}
    $(document).ready(function () {initialize();});
    </script>

Answer 1

drawVisualization函数缺少script标记内的右括号。您已在代码中的结束脚本标记之后将其关闭。

$(document).ready(function () {initialize();});
</script>

                } //this brace need to be inside script tag

Answer 2

加载器使用document.write来注入JS和CSS，这可以在文档加载完成后完成（这里的情况是这样的，因为你在{{1}上调用initialize }}）

在domready的调用中定义回调，而不是通过google.load

setOnLoadCallback

谷歌没有在mvc4中定义

2 个答案: