用html显示一个大图像

时间:2015-06-19 07:42:04

标签: jquery html5 image canvas

我是网络开发的新手。 我找到了这个网站http://digitalarchive.mcmaster.ca/islandora/object/macrepo:66896。 地图图像实际上大小约为1GB。 我真的想知道他们怎么做。 当我放大或平移地图时,似乎浏览器会请求图像的一小部分。但我不知道该怎么做。也许有人建议一些关键词让我学习更多? 非常感谢!!。

1 个答案:

答案 0 :(得分:1)

他们将图像切成方形部分称为瓷砖。

enter image description here

每个磁贴都有一个与之关联的元数据,类似于索引以及应该使用的缩放级别。

根据缩放,图块会逐层兑现。当您移动图像时,您正在向服务器发送边界框(您看到的图像的坐标,也称为bbox)使用此信息,服务器会计算应该抓取您的图块:

Network profiler

在您展示的每个网站请求的网站中,以svc.region=6144%2C12288%2C256%2C256&svc.level=4之类的内容结束,其中包含边界框(svc.region)和缩放(svc.level)

能够执行此操作(但专注于地理数据)的更高级服务器是:geoserver

对于视觉化,请查看openlayers

您也可以找到一个很好的解释here

图片的信用 www.mapbox.com