Javascript 如何从json文件中获取json数组？

我正在使用javascript创建图像热点，我需要从json文件中获取数据（x、y和Info），目前我正在从javascript数组获取数据。如何从json文件中获取它

代码粘贴在这里

var points;

        var l_nOldX;
        var l_nOldY;
        function createHotspots(){
        var points = new Array(
            /*Tamilnadu*/
        [38.7, 85.6, "0168"],
        [36.1, 85.3, "1843"],
        [38.5, 88.3, "39647"],
        [34.8, 29.2, "12320"]
    );
    var divHotspot = document.getElementById("loadImages");
    for(pi = 0; pi < points.length; pi++){  
        var hs = document.createElement("div");
        hs.className = "hotspot";
        hs.style.position = "absolute";
        hs.style.left = "calc(" + points[pi][0] + "% - 8px)";
        hs.style.top = "calc(" + points[pi][1] + "% - 0px)";
        hs.style.width = "15px";
        hs.style.height = "15px";
        var html;
        if (points[pi][0] < 31) {
            html = "<table cellpadding='0' cellspacing='0' class='tbltooltipright' align='center'><tr><td id='img9' align='center'><div align='center'><div class='divtooltip'><div class='divclose'></div>" + points[pi][2] + "</div><div id='triangle-down' class='arrow_boxr'></div></td></tr><tr><td align='center' id='img10' ></td></tr></table>";
            // alert('a');
            hs.innerHTML = html;
            $(hs).bind("mouseenter", function () {
                $(".tbltooltipnormal").hide();
                $(".tbltooltipleft").hide();
                $(".tbltooltipright").hide();
                $(this).find(".tbltooltipright").show();
            });
        }

        else {
            html = "<table cellpadding='0' cellspacing='0' class='tbltooltipnormal' align='center'><tr><td id='img9' align='center'><div align='center'><div class='divtooltip'><div class='divclose'></div>" + points[pi][2] + "</div><div id='triangle-down' class='arrow_boxn'></div></td></tr><tr><td align='center' id='img10' ></td></tr></table>";
            hs.innerHTML = html;
            $(hs).bind("mouseenter", function () {
                $(".tbltooltipnormal").hide();
                $(".tbltooltipleft").hide();
                $(".tbltooltipright").hide();
                $(this).find(".tbltooltipnormal").show();
            });

        }



        $('.divclose').on('click touchstart', function () {
            //debugger;

            $('.tbltooltipnormal').hide();
            $('.tbltooltipleft').hide();
            $('.tbltooltipright').hide();
            return false;
        });

        divHotspot.appendChild(hs);
    }

}

var点；
var l_nOldX；
变量l_nOldY；
函数createHotspots（）{
变量点=新数组(
/*泰米尔纳德邦*/
[38.7, 85.6, "0168"],
[36.1, 85.3, "1843"],
[38.5, 88.3, "39647"],
[34.8, 29.2, "12320"]
);
var divhospot=document.getElementById（“loadImages”）；
对于（pi=0；pi

在上面的代码中，我从“Points”数组中获取数据，而不是从一个json文件中获取数组数据？ 请帮我把这个修好

提前谢谢

var yourJsonDataFromFile=undefined;    
var getJsonData=function () {

        console.log("fetching data from JSON file");
        var url = "path_to_your_json _file";
        var ajaxHttp = new XMLHttpRequest();
        ajaxHttp.overrideMimeType("application/json");
        ajaxHttp.open("GET",url,true);
        ajaxHttp.setRequestHeader("Access-Control-Allow-Origin", "*");
        ajaxHttp.send(null);
        ajaxHttp.onreadystatechange = function () {
            if(ajaxHttp.readyState == 4 && ajaxHttp.status == "200")
            {
                yourJsonDataFromFile = JSON.parse(ajaxHttp.response);
            }
        };

    }

---

修改此代码将

path\u中的文件路径添加到您的\u json\u文件中

，并调用此函数

getJsonData（）

，之后您的数据将以json格式保存在

yourJsonDataFromFile中，希望这能解决您的问题
请尝试此操作。应该能解决你的问题

$.getJSON('<path_to_your_json_file>/file.json', function(data) {         
 var points = data;
});

$.getJSON（'/file.json'，函数（数据）{
var点=数据；
});
您可以使用ajax从json文件获取数据，只需将现有代码包装在一个函数中，该函数接受一个参数，并将该参数分配给所需的变量：

var points;
var l_nOldX;
var l_nOldY;

function createHotspots(points){ // <---pass the array
    var points = points; // assign it here
    var divHotspot = document.getElementById("loadImages");
   ...
}

$.ajax({
   url:'points.json', //<----call the json file
   type:'GET',
   dataType:'json',
   success:createHotspots // reference to the data
});

var点；
var l_nOldX；
变量l_nOldY；
函数创建热点（点）{//