Question

我正在使用highcharts。我的一些图表需要大量计算才需要大约1分钟才能完成。正如您在highcharts中所知，我们将图表作为模型并将其传递给我们的视图。我希望加载视图并显示加载图片，并在完成背景计算时接收模型并显示图表。

意味着我希望展示我的视图，但也等待接收模型。

如何在asp.net mvc4和c＃中处理此问题？

或任何其他方式......？

Answer 1

这是我更喜欢的，

Highcharts提供了显示加载的选项。

可以使用

中提供的选项完成 api中的

选项提供了here

您可以使用showLoading()和hideLoading()方法动态显示和隐藏测试。

因此您可以在计算启动时启动加载指示器，然后在显示图表后隐藏它

这是一个example我希望能为你效劳。

Answer 2

我的解决方案是：

在我看来，我检查模型是否为null。

如果模型为null，我将向控制器中的方法发送ajax请求以进行计算。

在此过程中，我正在显示一个包含Please wait,Loadin...消息的div的页面。

然后计算方法将计算结果保存在TempDate中，并且在成功函数中我将刷新视图。

在此视图的控制器中，我将TempDate传递给视图。

public ActionResult Chart()
{
    var chart=TempData["chart"];
    return View(chart);
}

图表视图：

@model DotNet.Highcharts.Highcharts
<script src="~/Scripts/jquery-1.8.3.js"></script>
@if (Model != null)
{
<script src="~/Scripts/highcharts.src.js"></script>
@(Model)
}
else
{
<h3 style="text-align:center">Loadin...</h3>
    <script type="text/javascript">
        $(document).ready(function () {
            $.getJSON("/WebServices/DrawChart",function(){
                window.location.replace("/WebServices/ChancePreview");
            })
        });
    </script>
}

最后：

public JsonResult DrawChart()
{
    //Calculations goes here...
    TempData["chart"]=chart;
}

如何在显示完整页面之前显示加载状态？

2 个答案: