javascript - 显示 json 图像数据的缩略图-6ren

javascript - 显示 json 图像数据的缩略图

转载作者：行者123 更新时间：2023-12-03 11:14:16

我有一个带有以下缩略图对象结构的 json 文件。

  {
    "locations":{
      "test_1":{
        "tel":"+41 58 249 91 91",
        "thumbnail.ext":"png",
        "title":"Basel",
        "mode":"update",
        "pobox":"P.O. Box 3456",
        "jcr:created":"Tue Dec 17 2013 13:02:56 GMT+0000",
        "id":"7a365fda-3e9b-be9e-0e91-a9b72856e6d6",
        "zip_city":"4002 Basel",
        "fax":"+41 58 249 91 23",
        "sort":"1",
        "maplocation":"47.549435,7.585241",
        "street":"Viaduktstrasse 42",
        "jcr:lastModified":"Fri Nov 07 2014 17:28:29 GMT+0000",
        "thumbnail":{
            "jcr:created":"Tue Dec 17 2013 13:02:58 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"ad388a5c-8638-4fed-a668-af2a9e1b173e",
                ":jcr:data":55007,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:28:30 GMT+0000"
            }
        }
    },
    "bern":{
        "tel":"+41 58 249 76 00",
        "thumbnail.ext":"png",
        "title":"Bern",
        "mode":"update",
        "pobox":"P.O. Box 112",
        "jcr:created":"Tue Dec 17 2013 13:02:56 GMT+0000",
        "id":"bfd2fff6-e769-6d2b-2722-9c09be415e10",
        "zip_city":"3073 Gümligen-Bern",
        "fax":"+41 58 249 76 17",
        "sort":"2",
        "maplocation":"46.93299,7.513097",
        "street":"Hofgut",
        "jcr:lastModified":"Fri Nov 07 2014 17:28:40 GMT+0000",
        "thumbnail":{
            "jcr:created":"Tue Dec 17 2013 13:02:58 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"7880b3ff-7d68-496f-a343-7fcc782eb0fd",
                ":jcr:data":61817,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:28:41 GMT+0000"
            }
        }
    },
    "geneva":{
        "thumbnail.ext":"png",
        "title":"Geneva",
        "tel":"+41 58 249 25 15",
        "mode":"update",
        "pobox":"P.O. Box 347",
        "jcr:created":"Thu Feb 13 2014 13:33:03 GMT+0000",
        "slingOldResourceType":"launchbase/components/launchbase/customerSpecificCode/__generic/",
        "id":"85ada88f-20c8-00ef-772d-9f040f978a7d",
        "zip_city":"1211 Geneva 13",
        "fax":"+41 58 249 73 13",
        "sort":"3",
        "maplocation":"Rue+de+Lyon+111,+1203+Genf,+Schweiz",
        "street":"Rue de Lyon 111",
        "jcr:lastModified":"Fri Nov 07 2014 17:28:51 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 13:33:03 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"d2e9be65-cae3-47ff-bf7c-b4193c4cd48a",
                ":jcr:data":70181,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:28:52 GMT+0000"
            }
        }
    },
    "lausanne":{
        "title":"Lausanne",
        "tel":"+41 58 249 45 55",
        "thumbnail.ext":"png",
        "mode":"update",
        "pobox":"P.O. Box 6663",
        "jcr:created":"Thu Feb 13 2014 13:49:28 GMT+0000",
        "id":"8a954430-faff-1af6-9383-fce04e57ee80",
        "zip_city":"1002 Lausanne",
        "fax":"+41 58 249 45 65",
        "sort":"4",
        "maplocation":"46.518507,6.637137",
        "street":"Avenue du Théâtre 1",
        "jcr:lastModified":"Fri Nov 07 2014 17:29:09 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 13:49:28 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"1f8bb242-c2d2-402a-9609-c2a1f8337522",
                ":jcr:data":60302,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:29:10 GMT+0000"
            }
        }
    },
    "lucerne":{
        "title":"Lucerne",
        "thumbnail.ext":"png",
        "tel":"+41 58 249 38 38",
        "mode":"update",
        "jcr:created":"Thu Feb 13 2014 13:51:03 GMT+0000",
        "id":"a29e5fb0-5e6e-a774-86d6-c68f867efe80",
        "zip_city":"6003 Lucerne",
        "fax":"+41 58 249 38 88",
        "sort":"5",
        "maplocation":"47.047772,8.304472",
        "street":"Pilatusstrasse 41",
        "jcr:lastModified":"Fri Nov 07 2014 17:29:19 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 13:51:03 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"4e70e476-65ed-481e-be26-64a5a241c6bc",
                ":jcr:data":61644,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:29:20 GMT+0000"
            }
        }
    },
    "lugano":{
        "title":"Lugano",
        "thumbnail.ext":"png",
        "tel":"+41 58 249 32 32",
        "mode":"update",
        "jcr:created":"Thu Feb 13 2014 13:55:27 GMT+0000",
        "id":"1c056c0e-fa83-8ced-1084-ac159d6bf6db",
        "zip_city":"6900 Lugano",
        "fax":"+41 58 249 32 33",
        "sort":"6",
        "maplocation":"46.008073,8.959413",
        "street":"Via Balestra 33",
        "jcr:lastModified":"Fri Nov 07 2014 17:29:29 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 13:55:27 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"33ca8dec-7d18-49e8-817f-95a1d663bdb2",
                ":jcr:data":67674,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:29:30 GMT+0000"
            }
        }
    },
    "neuch_tel":{
        "tel":"+41 58 249 61 30",
        "title":"Neuchâtel",
        "thumbnail.ext":"png",
        "mode":"update",
        "pobox":"P.O. Box 2572",
        "jcr:created":"Thu Feb 13 2014 13:57:06 GMT+0000",
        "slingOldResourceType":"launchbase/components/launchbase/customerSpecificCode/__generic/",
        "id":"9fce49b2-48dc-8bf0-541e-9b79b614ed8d",
        "zip_city":"2001 Neuchâtel",
        "fax":"+41 58 249 61 58",
        "sort":"7",
        "maplocation":"Rue+du+Seyon+1,+2000+Neuenburg,+Schweiz",
        "street":"Rue du Seyon 1",
        "jcr:lastModified":"Fri Nov 07 2014 17:29:38 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 13:57:06 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"51b4d831-d1b1-44da-b1f0-f2d83f058a1e",
                ":jcr:data":64736,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:29:39 GMT+0000"
            }
        }
    },
    "st_gallen":{
        "title":"St. Gallen",
        "tel":"+41 58 249 22 11",
        "thumbnail.ext":"png",
        "mode":"update",
        "pobox":"P.O. Box 1142",
        "jcr:created":"Thu Feb 13 2014 13:57:53 GMT+0000",
        "id":"577b75ed-6c0e-7ea9-c158-6d10e2d85246",
        "zip_city":"9001 St. Gallen",
        "fax":"+41 58 249 22 12",
        "sort":"8",
        "maplocation":"47.420683,9.363352",
        "street":"Bogenstrasse 7",
        "jcr:lastModified":"Fri Nov 07 2014 17:29:50 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 14:11:39 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"a01f593c-526c-48a3-88bb-562903999428",
                ":jcr:data":72246,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:29:51 GMT+0000"
            }
        }
    },
    "zug":{
        "tel":"+41 58 249 74 74",
        "thumbnail.ext":"png",
        "title":"Zug",
        "mode":"update",
        "pobox":"P.O. Box 4427",
        "jcr:created":"Thu Feb 13 2014 14:13:45 GMT+0000",
        "id":"4be64252-a892-f5fc-2e45-e412df9542ac",
        "zip_city":"6304 Zug",
        "fax":"+41 58 249 50 00",
        "sort":"9",
        "maplocation":"47.176149,8.512084",
        "street":"Landis + Gyr-Strasse 1",
        "jcr:lastModified":"Fri Nov 07 2014 17:30:01 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 14:13:45 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"cb2890d0-a8ba-45ec-b175-7b87f1597fa0",
                ":jcr:data":66838,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:30:02 GMT+0000"
            }
        }
    },
    "zurich":{
        "title":"Zurich",
        "thumbnail.ext":"png",
        "tel":"+41 58 249 31 31",
        "mode":"update",
        "pobox":"P.O. Box 1872",
        "subtitle":"Head Office",
        "jcr:created":"Thu Feb 13 2014 14:15:12 GMT+0000",
        "id":"a76d54e2-5b40-e389-a134-8db5cd3ebd67",
        "zip_city":"8026 Zurich",
        "fax":"+41 58 249 44 06",
        "sort":"10",
        "maplocation":"47.375148,8.520173",
        "street":"Badenerstrasse 172",
        "jcr:lastModified":"Fri Nov 07 2014 17:31:20 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 14:15:12 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"f90887d0-ef95-4841-992e-d94cfc7b90e8",
                ":jcr:data":70144,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:31:21 GMT+0000"
            }
        }
    },
    "schaan_liechtenstein":{
        "tel":"+423 237 70 40",
        "thumbnail.ext":"png",
        "title":"Schaan (LI)",
        "mode":"update",
        "pobox":"P.O. Box 342",
        "subtitle":"KPMG (Liechtenstein) AG",
        "jcr:created":"Thu Feb 13 2014 14:16:40 GMT+0000",
        "id":"b57b76b9-4f8b-7fee-09fc-533e5b96015e",
        "zip_city":"LI-9494 Schaan",
        "fax":"+423 237 70 50",
        "sort":"11",
        "maplocation":"Landstrasse+99,+9494+Schaan,+Liechtenstein",
        "street":"Landstrasse 99",
        "jcr:lastModified":"Fri Nov 07 2014 17:31:29 GMT+0000",
        "thumbnail":{
            "jcr:created":"Thu Feb 13 2014 14:16:40 GMT+0000",
            "jcr:content":{
                "jcr:uuid":"a8baee04-d0f4-4f2c-9cfb-e9299dc77406",
                ":jcr:data":58374,
                "jcr:mimeType":"image/png",
                "jcr:lastModified":"Fri Nov 07 2014 17:31:30 GMT+0000"
            }
          }
        }

      }
  }

缩略图位于images/locations/test_1/thumbnail

我想在解析 json 时添加缩略图作为图像源。

        var content = '';

    $(document).ready(function(){

        $.getJSON("json/locations.json", function(json){
            console.log(json);
            $.each(json.locations, function(index){
                content = "<div class=\"location\">" +
                            "<div class=\"location-name\"><strong>" + json.locations[index].title + "</strong></div>" +
                            "<div class=\"location-desc\">" +
                                "<p>Als unternehmerisch denkende Berater und ausgewiesene Kenner der Wirtschaftsregion k�nnen wir Sie in Ihrer F�hrungsaufgabe mit rund 80 Mitarbeitenden unterst�tzen.</p>" +
                            "</div>" +
                            "<div class=\"location-content\">" +
                                "<table>" +
                                    "<tr style=\"width: 100%\">" +
                                        "<td style=\"width: 50%\">" +
                                            "<img class=\"location-image\" style=\"width: 90%\" src=\"images/locations/"+ json.locations[index] + "/thumbnail." + json.locations[index].thumbnail.ext + "\" alt=\"\"/>" +
                                        "</td>" +
                                        "<td style=\"width: 50%\">" +
                                            "<div style=\"font-size: 12px\">" +
                                                "<div>" + json.locations[index].street + ", " + json.locations[index].pobox + ", " + json.locations[index].zip_city + "</div>" +
                                                "<div>Tel: " + json.locations[index].tel + "</div>" +
                                                "<div>Fax: " + json.locations[index].fax + "</div>" +
                                                "<div class=\"location-map\" onclick=\"initialize("+ json.locations[index].maplocation +");\">Auf Karte anzeigen</div>" +
                                            "</div>" +
                                        "</td>" +
                                    "</tr>" +
                                "</table>" +
                            "</div>" +
                        "</div>";
                $('.locations').append(content);     
                $(".location-map").click(function(){
                   $("#content-wrapper").css("display", "none");
                   $("#map-container").css("display", "block");
                   $("#map-canvas").css("display", "block");
                });
            });
        });

    });

如何修改图像来源以显示缩略图。我看过一些使用数据网址的示例，但不知道如何正确执行。任何帮助或指导将不胜感激。

最佳答案

好的，首先将 thumbnail.ext 更改为 thumbnailExt，因为 thumbnail.ext 引用了"thumbnail": { ext: val }。

添加数组var indexKey = [], i = 0;

var content = '';

var indexKey = [], i = 0;

$(document).ready(function(){

    $.getJSON("json/locations.json", function(json){

        for (var key in json.locations) {
                indexKey[indexKey.length] = key;
            }


        // console.log(json.locations);
        $.each(json.locations, function(index, value){

            content = "<div class=\"location\">" +
                        "<div class=\"location-name\"><strong>" + json.locations[index].title + "</strong></div>" +
                        "<div class=\"location-desc\">" +
                            "<p>Als unternehmerisch denkende Berater und ausgewiesene Kenner der Wirtschaftsregion k�nnen wir Sie in Ihrer F�hrungsaufgabe mit rund 80 Mitarbeitenden unterst�tzen.</p>" +
                        "</div>" +
                        "<div class=\"location-content\">" +
                            "<table>" +
                                "<tr style=\"width: 100%\">" +
                                    "<td style=\"width: 50%\">" +
                                        "<img class=\"location-image\" style=\"width: 90%\" src=\"images/locations/"+ indexKey[i] + "/thumbnail." + json.locations[index].thumbnailExt + "\" alt=\"\"/>" +
                                    "</td>" +
                                    "<td style=\"width: 50%\">" +
                                        "<div style=\"font-size: 12px\">" +
                                            "<div>" + json.locations[index].street + ", " + json.locations[index].pobox + ", " + json.locations[index].zip_city + "</div>" +
                                            "<div>Tel: " + json.locations[index].tel + "</div>" +
                                            "<div>Fax: " + json.locations[index].fax + "</div>" +
                                            "<div class=\"location-map\" onclick=\"initialize("+ json.locations[index].maplocation +");\">Auf Karte anzeigen</div>" +
                                        "</div>" +
                                    "</td>" +
                                "</tr>" +
                            "</table>" +
                        "</div>" +
                    "</div>";
                    i++;
            $('.locations').append(content);     
            $(".location-map").click(function(){
               $("#content-wrapper").css("display", "none");
               $("#map-container").css("display", "block");
               $("#map-canvas").css("display", "block");
            });
        });
    });

});

注意结构的更改。我们正在向数组添加键并调用该键。

这是一个 JSON 文件。

{
"locations":{
  "test_1":{
    "tel":"+41 58 249 91 91",
    "thumbnailExt":"png",
    "title":"Basel",
    "mode":"update",
    "pobox":"P.O. Box 3456",
    "jcr:created":"Tue Dec 17 2013 13:02:56 GMT+0000",
    "id":"7a365fda-3e9b-be9e-0e91-a9b72856e6d6",
    "zip_city":"4002 Basel",
    "fax":"+41 58 249 91 23",
    "sort":"1",
    "maplocation":"47.549435,7.585241",
    "street":"Viaduktstrasse 42",
    "jcr:lastModified":"Fri Nov 07 2014 17:28:29 GMT+0000",
    "thumbnail":{
        "jcr:created":"Tue Dec 17 2013 13:02:58 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"ad388a5c-8638-4fed-a668-af2a9e1b173e",
            ":jcr:data":55007,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:28:30 GMT+0000"
        }
    }
},
"bern":{
    "tel":"+41 58 249 76 00",
    "thumbnailExt":"png",
    "title":"Bern",
    "mode":"update",
    "pobox":"P.O. Box 112",
    "jcr:created":"Tue Dec 17 2013 13:02:56 GMT+0000",
    "id":"bfd2fff6-e769-6d2b-2722-9c09be415e10",
    "zip_city":"3073 Gümligen-Bern",
    "fax":"+41 58 249 76 17",
    "sort":"2",
    "maplocation":"46.93299,7.513097",
    "street":"Hofgut",
    "jcr:lastModified":"Fri Nov 07 2014 17:28:40 GMT+0000",
    "thumbnail":{
        "jcr:created":"Tue Dec 17 2013 13:02:58 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"7880b3ff-7d68-496f-a343-7fcc782eb0fd",
            ":jcr:data":61817,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:28:41 GMT+0000"
        }
    }
},
"geneva":{
    "thumbnailExt":"png",
    "title":"Geneva",
    "tel":"+41 58 249 25 15",
    "mode":"update",
    "pobox":"P.O. Box 347",
    "jcr:created":"Thu Feb 13 2014 13:33:03 GMT+0000",
    "slingOldResourceType":"launchbase/components/launchbase/customerSpecificCode/__generic/",
    "id":"85ada88f-20c8-00ef-772d-9f040f978a7d",
    "zip_city":"1211 Geneva 13",
    "fax":"+41 58 249 73 13",
    "sort":"3",
    "maplocation":"Rue+de+Lyon+111,+1203+Genf,+Schweiz",
    "street":"Rue de Lyon 111",
    "jcr:lastModified":"Fri Nov 07 2014 17:28:51 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 13:33:03 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"d2e9be65-cae3-47ff-bf7c-b4193c4cd48a",
            ":jcr:data":70181,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:28:52 GMT+0000"
        }
    }
},
"lausanne":{
    "title":"Lausanne",
    "tel":"+41 58 249 45 55",
    "thumbnailExt":"png",
    "mode":"update",
    "pobox":"P.O. Box 6663",
    "jcr:created":"Thu Feb 13 2014 13:49:28 GMT+0000",
    "id":"8a954430-faff-1af6-9383-fce04e57ee80",
    "zip_city":"1002 Lausanne",
    "fax":"+41 58 249 45 65",
    "sort":"4",
    "maplocation":"46.518507,6.637137",
    "street":"Avenue du Théâtre 1",
    "jcr:lastModified":"Fri Nov 07 2014 17:29:09 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 13:49:28 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"1f8bb242-c2d2-402a-9609-c2a1f8337522",
            ":jcr:data":60302,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:29:10 GMT+0000"
        }
    }
},
"lucerne":{
    "title":"Lucerne",
    "thumbnailExt":"png",
    "tel":"+41 58 249 38 38",
    "mode":"update",
    "jcr:created":"Thu Feb 13 2014 13:51:03 GMT+0000",
    "id":"a29e5fb0-5e6e-a774-86d6-c68f867efe80",
    "zip_city":"6003 Lucerne",
    "fax":"+41 58 249 38 88",
    "sort":"5",
    "maplocation":"47.047772,8.304472",
    "street":"Pilatusstrasse 41",
    "jcr:lastModified":"Fri Nov 07 2014 17:29:19 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 13:51:03 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"4e70e476-65ed-481e-be26-64a5a241c6bc",
            ":jcr:data":61644,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:29:20 GMT+0000"
        }
    }
},
"lugano":{
    "title":"Lugano",
    "thumbnailExt":"png",
    "tel":"+41 58 249 32 32",
    "mode":"update",
    "jcr:created":"Thu Feb 13 2014 13:55:27 GMT+0000",
    "id":"1c056c0e-fa83-8ced-1084-ac159d6bf6db",
    "zip_city":"6900 Lugano",
    "fax":"+41 58 249 32 33",
    "sort":"6",
    "maplocation":"46.008073,8.959413",
    "street":"Via Balestra 33",
    "jcr:lastModified":"Fri Nov 07 2014 17:29:29 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 13:55:27 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"33ca8dec-7d18-49e8-817f-95a1d663bdb2",
            ":jcr:data":67674,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:29:30 GMT+0000"
        }
    }
},
"neuch_tel":{
    "tel":"+41 58 249 61 30",
    "title":"Neuchâtel",
    "thumbnailExt":"png",
    "mode":"update",
    "pobox":"P.O. Box 2572",
    "jcr:created":"Thu Feb 13 2014 13:57:06 GMT+0000",
    "slingOldResourceType":"launchbase/components/launchbase/customerSpecificCode/__generic/",
    "id":"9fce49b2-48dc-8bf0-541e-9b79b614ed8d",
    "zip_city":"2001 Neuchâtel",
    "fax":"+41 58 249 61 58",
    "sort":"7",
    "maplocation":"Rue+du+Seyon+1,+2000+Neuenburg,+Schweiz",
    "street":"Rue du Seyon 1",
    "jcr:lastModified":"Fri Nov 07 2014 17:29:38 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 13:57:06 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"51b4d831-d1b1-44da-b1f0-f2d83f058a1e",
            ":jcr:data":64736,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:29:39 GMT+0000"
        }
    }
},
"st_gallen":{
    "title":"St. Gallen",
    "tel":"+41 58 249 22 11",
    "thumbnailExt":"png",
    "mode":"update",
    "pobox":"P.O. Box 1142",
    "jcr:created":"Thu Feb 13 2014 13:57:53 GMT+0000",
    "id":"577b75ed-6c0e-7ea9-c158-6d10e2d85246",
    "zip_city":"9001 St. Gallen",
    "fax":"+41 58 249 22 12",
    "sort":"8",
    "maplocation":"47.420683,9.363352",
    "street":"Bogenstrasse 7",
    "jcr:lastModified":"Fri Nov 07 2014 17:29:50 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 14:11:39 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"a01f593c-526c-48a3-88bb-562903999428",
            ":jcr:data":72246,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:29:51 GMT+0000"
        }
    }
},
"zug":{
    "tel":"+41 58 249 74 74",
    "thumbnailExt":"png",
    "title":"Zug",
    "mode":"update",
    "pobox":"P.O. Box 4427",
    "jcr:created":"Thu Feb 13 2014 14:13:45 GMT+0000",
    "id":"4be64252-a892-f5fc-2e45-e412df9542ac",
    "zip_city":"6304 Zug",
    "fax":"+41 58 249 50 00",
    "sort":"9",
    "maplocation":"47.176149,8.512084",
    "street":"Landis + Gyr-Strasse 1",
    "jcr:lastModified":"Fri Nov 07 2014 17:30:01 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 14:13:45 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"cb2890d0-a8ba-45ec-b175-7b87f1597fa0",
            ":jcr:data":66838,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:30:02 GMT+0000"
        }
    }
},
"zurich":{
    "title":"Zurich",
    "thumbnailExt":"png",
    "tel":"+41 58 249 31 31",
    "mode":"update",
    "pobox":"P.O. Box 1872",
    "subtitle":"Head Office",
    "jcr:created":"Thu Feb 13 2014 14:15:12 GMT+0000",
    "id":"a76d54e2-5b40-e389-a134-8db5cd3ebd67",
    "zip_city":"8026 Zurich",
    "fax":"+41 58 249 44 06",
    "sort":"10",
    "maplocation":"47.375148,8.520173",
    "street":"Badenerstrasse 172",
    "jcr:lastModified":"Fri Nov 07 2014 17:31:20 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 14:15:12 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"f90887d0-ef95-4841-992e-d94cfc7b90e8",
            ":jcr:data":70144,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:31:21 GMT+0000"
        }
    }
},
"schaan_liechtenstein":{
    "tel":"+423 237 70 40",
    "thumbnailExt":"png",
    "title":"Schaan (LI)",
    "mode":"update",
    "pobox":"P.O. Box 342",
    "subtitle":"KPMG (Liechtenstein) AG",
    "jcr:created":"Thu Feb 13 2014 14:16:40 GMT+0000",
    "id":"b57b76b9-4f8b-7fee-09fc-533e5b96015e",
    "zip_city":"LI-9494 Schaan",
    "fax":"+423 237 70 50",
    "sort":"11",
    "maplocation":"Landstrasse+99,+9494+Schaan,+Liechtenstein",
    "street":"Landstrasse 99",
    "jcr:lastModified":"Fri Nov 07 2014 17:31:29 GMT+0000",
    "thumbnail":{
        "jcr:created":"Thu Feb 13 2014 14:16:40 GMT+0000",
        "jcr:content":{
            "jcr:uuid":"a8baee04-d0f4-4f2c-9cfb-e9299dc77406",
            ":jcr:data":58374,
            "jcr:mimeType":"image/png",
            "jcr:lastModified":"Fri Nov 07 2014 17:31:30 GMT+0000"
        }
      }
    }

  }
}

关于javascript - 显示 json 图像数据的缩略图，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27418479/

文章推荐： javascript - 辅助方法、ActionView 和 ActionController

文章推荐： linux - Docker镜像导入错误: “Base layer cannot have tombstones”

文章推荐： javascript - 从 C# 中的 Json 数组转换为 List 或 T[]

javascript - 图像->JSON->.Net 图像
我正在尝试学习 Knockout 并尝试创建一个照片 uploader 。我已成功将一些图像存储在数组中。现在我想回帖。在我的 knockout 码(Javascript)中，我这样做: 我在 Jav
php - 如何在mysql中添加文本+图像+文本+图像+ ...？
我正在使用 php 编写脚本。我的典型问题是如何在 mysql 中添加一个有很多替代文本和图像的问题。想象一下有机化学中具有苯结构的描述。最有效的方法是什么？据我所知，如果我有一个图像，我可以在数据
html - Bootstrap 图像/按钮/图像
我在两个图像之间有一个按钮，我想将按钮居中到图像高度。有人可以帮帮我吗？ Entrar
javascript - 从中心点旋转全尺寸 Canvas 图像，而不移动其他 Canvas 图像
下面的代码示例可以在这里查看 - http://dev.touch-akl.com/celebtrations/ 我一直在尝试做的是在 Canvas 上绘制 2 个图像(发光，然后耀斑。这些图像的链接
javascript - 为什么相同的 JS 代码不适用于第二个帖子/图像，但适用于第一个帖子/图像？
请检查此https://jsfiddle.net/rhbwpn19/4/ 图像预览对于第一篇帖子工作正常，但对于其他帖子则不然。我应该在这里改变什么？ function readURL(input)
javascript - HTML Canvas 图像 - 在页面中绘制多 Canvas 图像
我对 Canvas 有疑问。我可以用单个图像绘制 Canvas ，但我不能用单独的图像绘制每个 Canvas 。- 如果数据只有一个图像，它工作正常，但数据有多个图像，它不工作你能帮帮我吗？ va
ios - 查找指定文件的扩展文件类型(JPEG 图像、TIFF 图像、...) objective c
我的问题很简单。如何获取 UIImage 的扩展类型？我只能将图像作为 UIImage 而不是它的名称。图像可以是静态的，也可以从手机图库甚至文件路径中获取。如果有人可以为此提供一点帮助，将不胜感激。
image-processing - 如何将 SVG 图像 "paths"转换为单独的 PNG 图像？
我有一个包含 67 个独立路径的 SVG 图像。是否有任何库/教程可以为每个路径创建单独的光栅图像(例如 PNG)，并可能根据路径 ID 命名它们？最佳答案谢谢大家。我最终使用了两个答案的组合。
javascript - 使一个(图像)向右移动并旋转 45 度，同时将鼠标悬停在另一个(图像)上
我想将鼠标悬停在一张图片(音乐专辑)上，然后播放一张唱片，所以我希望它向右移动并旋转一点，当它悬停时我希望它恢复正常动画片。它已经可以向右移动，但我无法让它随之旋转。我喜欢让它尽可能简单，因为我不是编
ios - Retina iOS 设备不显示@2X 图像，它显示 1X 图像
Retina iOS 设备不显示@2X 图像，它显示 1X 图像。我正在使用 Xcode 4.2.1 Build 4D502，该应用程序的目标是 iOS 5。我创建了一个测试应用(主/细节)并添加
javascript - 如何将 HTML CSS 图像 slider 转换为 Angular 图像 slider ？
我正在尝试从头开始以 Angular 实现图像 slider ，并尝试复制 w3school基于图像 slider 。下面我尝试用 Angular 实现，谁能指导我如何使用 Angular 实现？
c++ - 如何从 opencv 中的 RGB 图像(3 channel 图像)访问图像数据
我正在尝试获取图像的图像数据，其中 w= 图像宽度，h = 图像高度 for (int i = x; i imageData[pos]>0) //Taking data (here is the pr
php - HTML (或 JS 图像)与通过 PHP 的内联图像(base64_encoded 图像)
我的网页最初通过在 javascript 中动态创建图像填充了大约 1000 个缩略图。由于权限问题，我迁移到 suPHP。现在不用标准标签本身我正在通过这个 php 脚本进行检索 $file
python - 将 Python Opencv 图像(numpy 数组)转换为 PyQt QPixmap 图像
我正在尝试将 python opencv 图像转换为 QPixmap。我按照指示显示Page Link我的代码附在下面 img = cv2.imread('test.png')[:,:,::1]/2
python - OpenCV 将图像读取为 3 channel 图像，而 PIL 将图像读取为 1 channel 图像
我试图在这个 Repository 中找出语义分割数据集的 NYU-v2 . 我很难理解图像标签是如何存储的。例如，给定以下图像: 对应的标签图片为: 现在，如果我在 OpenCV 中打开标签图像，
java - 如何循环 8*1 svg 图像(由 java 生成)以获得 8*8 svg 图像？
import java.util.Random; class svg{ public static void main(String[] args){ String f="\"
Android自定义画笔图案/图像
我有一张 8x8 的图片。 (位图 - 可以更改) 我想做的是能够绘制一个形状，给定一个 Path 和 Paint 对象到我的 SurfaceView 上。目前我所能做的就是用纯色填充形状。我怎样才
HTML 图像
要在页面上显示图像，你需要使用源属性（src）。src 指 source 。源属性的值是图像的 URL 地址。定义图像的语法是：在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此
图像&视频编辑工具箱MMEditing安装及使用示例(Inpainting)
**MMEditing是基于PyTorch的图像&视频编辑开源工具箱，支持图像和视频超分辨率(super-resolution)、图像修复(inpainting)、图像抠图(matting)、
来自资源文件的 Qt 图像
我正在尝试通过资源文件将图像插入到我的程序中，如下所示: green.png other files 当我尝试使用 QImage 或 QPixm

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 显示 json 图像数据的缩略图