Question

你好我不熟悉html和JavaScript。使用它们是因为map v3仅在JavaScript中可用。如何在我的地图加载函数初始化时设置一个不确定的圆形进度条，并在加载后将其关闭。

Answer 1

在此处制作GIF加载图片 - http://www.ajaxload.info/ 并下载它。然后将其上传到您的网络服务器。

然后在加载过程中显示它并在完成时隐藏它。假设图像的ID为loadingIMG：

<img src='path/to/image.gif' id='loadingImg' />

//During Loading
$('#loadingImg').show();

//After done loading
$('#loadingImg').hide();

/////////////////// OR for fade in and out //////////////////

//During Loading
$('#loadingImg').fadeIn();

//After done Loading
$('#loadingImg').fadeOut();

或者，因为您表示您需要进度元素：

<progress id='progressbar' val='0' max='1000' ></progress>
<p id='loadingTxt' style='display: none;'>Loading Location...</p>

//When it is loading...
//Show the loading text
$('#loadingTxt').show();

//During loading, just have dummy progress
var timer = setInterval(function(){ 

     //Incriment Progress bar
     $('#progressbar').attr('value',parseInt($('#progressbar').attr('value'))+10);
}, 1000);

//When completed, set bar to full
//Stop timer,
clearInterval(timer);

//Set to full,
$('#progressbar').attr('value',1000);

//Hide the loading text
$('#loadingTxt').hide();

只需调整最大值即可满足加载速度的需求。

Answer 2

在状态加载时使用* .gif图像，并在地图加载后将其删除。你不需要任何动画，只需用gif创建它。或使用其他图像并通过css或js旋转。

如何在html和javascript中显示隐藏不确定的循环进度条

2 个答案: