- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
下面的 jsfiddle 显示了问题。
第一个数据插入很好,但是当数据集的长度上限为 10 时,您会看到数据点自上而下动画而不是向左移动的不良行为。这非常让人分心。
http://jsfiddle.net/kLg5ntou/32/
setInterval(function () {
data.labels.push(Math.floor(Date.now() / 1000));
data.datasets[0].data.push(Math.floor(10 + Math.random() * 80));
// limit to 10
data.labels = data.labels.splice(-10);
data.datasets[0].data = data.datasets[0].data.splice(-10);
chart.update(); // addData/removeData replaced with update in v2
}, 1000);
有没有办法让折线图向左移动,新插入的数据点出现在右边?与分散注意力的波浪动画相反?
谢谢
最佳答案
此代码使用 streaming plugin并按预期工作。
http://jsfiddle.net/nagix/kvu0r6j2/
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-streaming@1.5.0/dist/chartjs-plugin-streaming.min.js"></script>
var ctx = document.getElementById("chart").getContext("2d");
var chart = new Chart(ctx, {
type: 'line',
data: {
labels: [],
datasets: [{
label: "My First dataset",
backgroundColor: "rgba(95,186,88,0.7)",
borderColor: "rgba(95,186,88,1)",
pointBackgroundColor: "rgba(0,0,0,0)",
pointBorderColor: "rgba(0,0,0,0)",
pointHoverBackgroundColor: "rgba(95,186,88,1)",
pointHoverBorderColor: "rgba(95,186,88,1)",
data: []
}]
},
options: {
scales: {
xAxes: [{
type: 'realtime'
}]
},
plugins: {
streaming: {
onRefresh: function(chart) {
chart.data.labels.push(Date.now());
chart.data.datasets[0].data.push(
Math.floor(10 + Math.random() * 80)
);
},
delay: 2000
}
}
}
});
关于javascript - chart.js 2,动画从右到左(不是自上而下),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36896190/
我在 OSX 10.10 上使用 XCode 6.1.1 我有一个以下 cocoa 窗口 我无法仅使用 IB 制作垂直自上而下的 slider 。 (B View 中的第二个 slider ) 如示例
我目前正在类里面学习自上而下的 C 编程,但不知何故我无法真正掌握它的窍门。 我一直在尝试通过这个编程练习来学习它,你必须根据某人的到达时间(以及以公里/小时为单位的速度和以公里为单位的距离)来计算某
元素的合并排序过程步骤是什么:20 47 15 8 9 4 40 30 12 17 我遇到过这个...... Pass1: |20 47| |8 15| |4 9| |30 40| |12 17| P
问题 - 给定一个长度为 N 的整数数组 A,找到先递增后递减的最长子序列的长度。输入:[1, 11, 2, 10, 4, 5, 2, 1] 输出:6 解释:[1 2 10 4 2 1]是最长的子序列
我是来自 2D SpriteKit 的 SceneKit 新手,并试图弄清楚如何调整相机,使其面朝下位于世界顶部。我的位置部分是正确的,但是在旋转时我遇到了困难。如果我调整X,是or Zaxis, n
这是我的笨蛋吗?的一天。以下代码不会按顺序运行(如从上到下),它从顶部跳到底部然后运行中间。另一方面,如果我放一个 Console.WriteLine(); 它将自上而下运行。和 Console.Re
昨天 我正在玩 CoordinatorLayout 和 TabView 1) 我的目标是什么? CoordinatorLayout 和 TabView 当我向上滚动时一个 View 如.GIF所示 向
我正在查看 this example它使用簇布局将 X 和 Y 坐标分配给树状图上的节点。我怎么知道cluster垂直布局,自上而下,而不是默认的从左到右? 最佳答案 对于example你链接,只是翻
我有一个 Kendo UI 图表,在 3 个不同的值轴上显示 3 个系列的数据。 “广告位置”值轴是反向的,1 是可能的最高值(根据图像)。 如您所见,这会导致“广告位置”系列“自上而下”呈现。 有谁
注意:我并不是要将 3D 对象投影到 2D 相机 View 图像(对此有很多答案)。 它甚至比这更简单:我有一个 3D 模型,比如说,一条街道。我想把它变成街道 map 。所以这是一个简单的自上而下/
我正在尝试使用谷歌浏览器的 Trace Event Profiling Tool分析我正在运行的 Node.js 应用程序。选择点样本后,我可以在三种 View 之间进行选择: 自上而下(树) 自上而
我正在自动化我们通常每月在 Word 中手动输入一次的报告,它的目标用户要求它总是看起来完全符合他们指定的方式 - 它需要有两个内容列,像 MS Word/a 一样换行报纸 - 第一栏的结尾换行到第二
我是一名优秀的程序员,十分优秀!