Question

我收到以下错误：

未捕获的TypeError：chart.trigger不是functionplotData @ jquery.flot.animator.js：124

在我的flot图表上：

<a href="http://google.com" data-title="The World's Largest Search Engine!">Google!</a>
<style>  
.box
{
  border: 1px solid green;
  position:absolute;
  color: white;
  top: 19px;
  left: 30px;
  background-color: black;
}
</style>
<script>
$().ready(function(){
$( "a" ).hover(
  function() {   
   var title = $(this).attr("data-title");  // extracts the title using the data-title attr applied to the 'a' tag
    $('<div/>', { // creates a dynamic div element on the fly
        text: title,
        class: 'box'
    }).appendTo(this);  // append to 'a' element
  }, function() {
    $(document).find("div.box").remove(); // on hover out, finds the dynamic element and removes it.
  }
);
  });
</script>

我尝试过：

var options = {
    "xaxis": {
        "mode": "time",
        "timeformat": "%d/%m",
        //"tickSize": [1, "day"]
    },
    "yaxes": [{
            "position": "left",
            //"tickSize": 1,
            "min": min,
            "max": 100
        }, {
            "position": "right",
            "min": 0,
            "max": max
        }
    ],
    "series": {
        "lines": {
            "show": true
        },
        curvedLines: {
            apply: true,
        } 
    },
    "colors": ["#00ff00"],
    "legend": {
        "show": false
    },
    "grid": {
        hoverable: true,
        clickable: true
    },
    animator: { start: 100, steps: 99, duration: 2000, direction: "left" }
};

和

plot = $.plotAnimator("#network-graph",  [{ data : [arr], 
    animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }], options);

我现在尝试了

plot = $.plotAnimator("#network-graph",  [{ data : arr, 
    animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }], options);

但它崩溃了。

当我尝试以下操作时，它不会崩溃或弹出任何错误，但数据点不会加载。

plot = $.plotAnimator($("#network-graph"),  [{ data : arr, animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }], options);

这是数据

plot = $.plotAnimator($("#network-graph"),  [{ data : [arr], animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }], options);

我正在使用以下代码来绘制图表，这是有效的。

[1449619200000,99.38],
[1449622800000,99.23],
[1449626400000,99.39],
[1449630000000,99.4],
[1449633600000,99.39],
[1449637200000,99.4],
[1449640800000,99.41],
[1449644400000,99.4],
[1449648000000,99.31],
[1449651600000,99.12],
[1449655200000,99.06],
[1449658800000,98.93],
[1449662400000,98.94],
[1449666000000,99.05],
[1449669600000,99.11],
[1449673200000,99.16],
[1449676800000,99.3],
[1449680400000,99.4],
[1449684000000,99.43],
[1449687600000,99.43],
[1449691200000,99.43],
[1449694800000,99.43],
[1449698400000,99.43],
[1449702000000,99.44],
[1449705600000,99.46],
[1449709200000,99.37],
[1449712800000,99.41],
[1449716400000,99.38],
[1449720000000,99.36],
[1449723600000,99.34],
[1449727200000,99.37],
[1449730800000,99.36],
[1449734400000,99.3],
[1449738000000,99.16],
[1449741600000,99.03],
[1449745200000,98.93],
[1449748800000,98.97],
[1449752400000,99.01],
[1449756000000,99.03],
[1449759600000,99.11],
[1449763200000,99.2],
[1449766800000,99.26],
[1449770400000,99.31],
[1449774000000,99.34],
[1449777600000,99.34],
[1449781200000,99.33],
[1449784800000,99.32],
[1449788400000,99.37],
[1449792000000,99.33],
[1449795600000,99.32],
[1449799200000,99.31],
[1449802800000,99.34],
[1449806400000,99.34],
[1449810000000,99.33],
[1449813600000,99.33],
[1449817200000,99.33],
[1449820800000,99.21],
[1449824400000,99.05],
[1449828000000,98.82],
[1449831600000,98.85],
[1449835200000,98.94],
[1449838800000,99.04],
[1449842400000,99.11],
[1449846000000,99.17],
[1449849600000,99.25],
[1449853200000,99.25],
[1449856800000,99.32],
[1449860400000,99.4],
[1449864000000,99.37],
[1449867600000,99.09],
[1449871200000,99.06],
[1449874800000,99.19],
[1449878400000,99.42],
[1449882000000,99.43],
[1449885600000,99.43],
[1449889200000,99.41],
[1449892800000,99.41],
[1449896400000,99.4],
[1449900000000,99.4],
[1449903600000,99.43],
[1449907200000,99.41],
[1449910800000,99.31],
[1449914400000,99.26],
[1449918000000,99.2],
[1449921600000,99.21],
[1449925200000,99.27],
[1449928800000,99.35],
[1449932400000,99.39],
[1449936000000,99.43],
[1449939600000,99.45],
[1449943200000,99.47],
[1449946800000,99.48],
[1449950400000,99.47],
[1449954000000,99.46],
[1449957600000,99.51],
[1449961200000,99.51],
[1449964800000,99.52],
[1449968400000,99.52],
[1449972000000,99.5],
[1449975600000,99.47],
[1449979200000,99.48],
[1449982800000,99.48],
[1449986400000,99.5],
[1449990000000,99.5],
[1449993600000,99.44],
[1449997200000,99.36],
[1450000800000,99.36],
[1450004400000,99.37],
[1450008000000,99.37],
[1450011600000,99.39],
[1450015200000,99.43],
[1450018800000,99.48],
[1450022400000,99.52],
[1450026000000,99.51],
[1450029600000,99.52],
[1450033200000,99.52],
[1450036800000,99.52],
[1450040400000,99.51],
[1450044000000,99.5],
[1450047600000,99.49],
[1450051200000,99.5],
[1450054800000,99.5],
[1450058400000,99.5],
[1450062000000,99.49],
[1450065600000,99.49],
[1450069200000,99.5],
[1450072800000,99.48],
[1450076400000,99.5],
[1450080000000,99.5],
[1450083600000,99.38],
[1450087200000,99.2],
[1450090800000,99.11],
[1450094400000,99.08],
[1450098000000,99.1],
[1450101600000,99.12],
[1450105200000,99.23],
[1450108800000,99.37],
[1450112400000,99.41],
[1450116000000,99.42],
[1450119600000,99.43],
[1450123200000,99.42],
[1450126800000,99.43],
[1450130400000,99.44],
[1450134000000,99.43],
[1450137600000,99.4],

Answer 1

您需要使用jquery选择器包围HTML id字符串：

plot = $.plotAnimator($("#network-graph"), [{ data : arr, animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }], options);

这个JSFiddle加载动画而没有错误（它的jQuery选择器围绕id中div的{{1}}。

此JSFiddle会重现您在动画完成时看到的错误（它没有$.plotAnimate()中的选择器。）

在上述两个JSFiddles中，您可以打开正在使用的浏览器的开发人员工具，并查看控制台以查看错误（或缺少错误）。

在动画上绘制图表触发器错误

1 个答案: