Question

我正在开展一个项目，将数字组织学（显微镜）幻灯片图像转换为Google Maps架构中排列的256x256像素JPEG图块。由于这些组织是在完全白色的背景下设置的（see example here），我使用的程序在将显微镜幻灯片文件转换为平铺的JPEG时，也会删除完全白色的瓷砖。这样可以节省大量的存储空间，并且可以将更少的文件上传到服务器，这很有用，因为我无法控制服务器（我正在使用Google存储空间）。

然而，这会在图像中留下空白洞。我正在尝试让Google Maps脚本在该位置没有磁贴时加载单个全白JPEG图像。我无法在任何地方找到答案，而且我的编程技巧充其量只是新手。我能找到的最接近的是使用tile overlays,，但我不会总是知道哪些瓷砖需要更换，而且似乎这是填写这些未填充区域的必要信息。

我目前的（非常非常基本的脚本）如下：

< html > < head >
  < script type = "text/javascript"
src = "https://maps.googleapis.com/maps/api/js?sensor=true&v=3" > < /script>
<script type="text/javascript
">
	function initialize()
	{
       	geocoder = new google.maps.Geocoder();
	    var myOptions = {
		  zoom: 2,
		  center: new google.maps.LatLng(0,0),
		  mapTypeControl: false,
		  streetViewControl: false,
		  navigationControl: true,
		  mapTypeId: google.maps.MapTypeId.ROADMAP
	      }
          map = new google.maps.Map(document.getElementById("
map_canvas "), myOptions);
	      var VM_Map = new google.maps.ImageMapType({
			name: 'Digital Histology'
			alt: 'Digital Histology',
			getTileUrl: function(coord, zoom) {return customGetTileURL(coord, zoom);},
			tileSize: new google.maps.Size(256, 256),
			minZoom: 1,
			maxZoom: 9,
			isPng: false
			});
		map.mapTypes.set('VM_Map', VM_Map);
	        map.setMapTypeId('VM_Map');
}
function customGetTileURL(a,b) {
         return 'SERVER_PATH' + b + '/' + a.y + '/' + a.x + '.jpg'
}
</script>
</head>
<body id="
body " style="
margin: 0px;
padding: 0px;
overflow: hidden;
" onLoad="
initialize()
" >
<div id="
map_canvas " style="
width: 100 % ;
height: 100 % ;
"></div>
</body>
</html>

任何建议都将深表感谢。

Answer 1

你有一些选择，但它们取决于你的设置和对它的控制量。

1.选项：您似乎正在从服务器加载图像：如果服务器在您的控制下运行，并且它使用Apache或其他可以设置的Web服务器解决方案，您可以将其配置为返回默认图像（如果是白色图像），如果请求的图像不存在。有关如何使用Apache执行此操作，请参阅this SO question。如果可能的话，我肯定会选择这个选项。

2.选项：如果您事先知道哪些文件不存在，您可以将它们添加到某些js对象并始终检查它们是否存在，如果不存在则返回白色图像的URL。所以你会得到一个JS变量，结构如下：

non_existing_images = {SAMPLE_ZOOM_1:
                        {SAMPLE_X_COORD_1:
                          {SAMPLE_Y_COORD_1:true, SAMPLE_Y_COORD_2:true, ...},
                         SAMPLE_X_COORD_2:
                          {SAMPLE_Y_COORD_1:true, SAMPLE_Y_COORD_2:true, ...}
                        ...},
                       SAMPLE_ZOOM_2:...
                      }

然后有一个功能：

function loadNonExistingImages(){
   //this function would determine, which images do not exist on your server. and then save it in not_existing_images object. It may be a call to some backend server which returns this for you.
}

如果你使用一些后端服务器，脚本可以连接数据库（如果你使用一个用于图像），或者其他一些方式（检查物理上是否存在图像）来返回不存在的图像列表。使用此功能填充non_existing_images及其填充后的电话initialize();（如果您没有后端服务器，则可以使用js to check if images exist，但我强烈建议不要这样做如果你要使用大量图像，因为这会导致对服务器的大量请求）

然后你只需将customGetTileURL函数调整为这样：

function customGetTileURL(a,b) {
         if(non_existing_images[b] && non_existing_images[b][a.x] && non_existing_images[b][a.y]) return 'SERVER_PATH_TO_WHITE_IMAGE.jpg'; //if image doesn't exist return path to the white image
         else return 'SERVER_PATH' + b + '/' + a.y + '/' + a.x + '.jpg'
}

在Google地图中调用“默认磁贴”

1 个答案: