jqPlot仅在刷新页面后起作用

Question

I want to use jqPlot in addition to jQuery to display charts and so on. 除了jQuery，我想使用jqPlot来显示图表等。

After adding all files, I run my code, the page is empty. 添加所有文件后，我运行我的代码，页面为空。 I press refresh, the chart appears. 我按刷新，出现图表。

I included all files in my <head> : 我在<head>包括了所有文件：

    <script class="include" type="text/javascript" src="~/Scripts/jqPlot/jquery.jqplot.min.js"></script>
    <script class="include" type="text/javascript" src="~/Scripts/jqPlot/jqplot.pieRenderer.min.js"></script>
    <script class="include" type="text/javascript" src="~/Scripts/jqPlot/jqplot.donutRenderer.min.js"></script>
    <script class="include" type="text/javascript" src="~/Scripts/jqPlot/excanvas.min.js"></script>

along with some js: 以及一些js：

<script>
        $(document).ready(function () {
            var data = [
              ['Heavy Industry', 12], ['Retail', 9], ['Light Industry', 14],
              ['Out of home', 16], ['Commuting', 7], ['Orientation', 9]
            ];
            var plot1 = jQuery.jqplot('chart1', [data],
              {
                  seriesDefaults: {
                      // Make this a pie chart.
                      renderer: jQuery.jqplot.PieRenderer,
                      rendererOptions: {
                          // Put data labels on the pie slices.
                          // By default, labels show the percentage of the slice.
                          showDataLabels: true
                      }
                  },
                  legend: { show: true, location: 'e' }
              }
            );
        });
    </script>

Finally in my <body> : 最后在我的<body> ：

<div id="chart1" style="height:300px; width:500px;"></div>

As far as I understand it, I messed up the order of the files, because they load after refreshing. 据我了解，我弄乱了文件的顺序，因为它们是刷新后加载的。 The chart does NOT appear in IE9, even after refreshing (yes, I included the excanvas.js) 即使刷新后，图表也不会出现在IE9中（是的，我包括了excanvas.js）

Do anyone can help me out? 有人可以帮我吗？

Thanks in advance, please let me know if you miss any information. 预先感谢，如果您错过任何信息，请告诉我。

Answer 1

I had the same issue. 我遇到过同样的问题。 What i did was create a function that builds my chart, an in the event pageshow draw that. 我所做的是创建一个构建图表的功能，并在事件页面显示中绘制了该图表。

$(document).on("pageshow", function(){ console.log('pageshow'); doPlot(); });

and my doPlot function was : 而我的doPlot函数是：

function doPlot(){
    var arrayValores = [];
    // listaValores is an array that i send as model attribute from backend
    $.each(JSON.parse(listaValores), function(idx, obj) {
        var actual = [obj.fechaAccion, obj.valorAccion]
        arrayValores.push(actual);
    });     
    var plot = $.jqplot('accion-chart', [arrayValores], {
          axes:{
            xaxis:{
              renderer:$.jqplot.DateAxisRenderer, 
              tickOptions:{formatString:'%H:%M'},
            }
          },
          series:[{lineWidth:1, 
                markerOptions: { style:'none', display: 'none' },
                    showMarker:false}],
          seriesColors:["#FF0000"]
      });
      if (plot) {
        plot.destroy();
      }
      plot.replot();

} }

I hope it helps. 希望对您有所帮助。 Regards. 问候。

jqPlot仅在刷新页面后起作用

问题描述

1 个解决方案

解决方案1
0 2016-08-26 19:26:12

jqPlot仅在刷新页面后起作用

问题描述

1 个解决方案

解决方案1 0 2016-08-26 19:26:12

解决方案1
0 2016-08-26 19:26:12