echarts中引用同一目錄下的本地json文件產生跨域問題

echarts中引用同一目錄下的本地json文件之后，Microsoft Edge可以正常顯示，但是谷歌瀏覽器不能夠顯示，應該是導致了跨域問題，但是我看到echarts的官方案例都采用的是這種方法，為什么我就出現(xiàn)了跨域問題,求大神指點啊~~

下面是錯誤

jquery-1.8.3.js:8434 Failed to load file:///C:/Users/Gemma/Desktop/hello/lipengfei/fuzhou.json: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

下面是文檔結構

下面是HTML頁面代碼

<!DOCTYPE html>
<html style="height: 100%"> 
    <head> 
        <meta charset="utf-8"> 
    </head> 
    <body style="height: 100%; margin: 0"> 
        <div id = "main" style = "height:100%"></div>
<script src="echarts.js"></script>
<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script>
$.get('fuzhou.json', function (geoJson) {
    echarts.registerMap('fuzhou', geoJson); 
    var dom = document.getElementById("main");
    var app = {};
    option = null;
    var dataMap = {};
    var myChart = echarts.init(dom);
    myChart.setOption(option={
            baseOption: {
                timeline: {
                    axisType: 'category',
                    autoPlay: true,
                    playInterval: 1000,
                    data: [ ],
                    label: {
                        formatter : function(s) {
                            return s;
                        }
                    }
                },
                tooltip: {
                            trigger: 'item'
                        },
                visualMap: {
                        min: 40,
                        max: 230,
                        text:['High','Low'],
                        realtime: false,
                        calculable: true,
                        inRange: {
                            color: ['green','yellow', 'red']
                        }
                    },
                series: [{
                    type: 'map',
                    map: 'fuzhou',
                    itemStyle:{
                        normal:{label:{show:true}},
                        emphasis:{label:{show:true}}
                    },
                }],
            },
            options:[]
        });
    });
</script>
</body>
</html>

回答

編輯回答

安若晴

<head> 
    <meta charset="utf-8"> 
</head> 
<body style="height: 100%; margin: 0"> 
    <div id = "main" style = "height:100%"></div>

echarts.registerMap('fuzhou', fuzhou); 
var dom = document.getElementById("main");
var app = {};
option = null;
var dataMap = {};
var myChart = echarts.init(dom);
myChart.setOption(option={
        baseOption: {
            timeline: {
                axisType: 'category',
                autoPlay: true,
                playInterval: 1000,
                data: [ ],
                label: {
                    formatter : function(s) {
                        return s;
                    }
                }
            },
            tooltip: {
                        trigger: 'item'
                    },
            visualMap: {
                    min: 40,
                    max: 230,
                    text:['High','Low'],
                    realtime: false,
                    calculable: true,
                    inRange: {
                        color: ['green','yellow', 'red']
                    }
                },
            series: [{
                type: 'map',
                map: 'fuzhou',
                itemStyle:{
                    normal:{label:{show:true}},
                    emphasis:{label:{show:true}}
                },
            }],
        },
        options:[]
    });

</script>
</body>
</html>

2017年10月19日 23:23