如何更新 SmoothieChart 中的数据而不向 TimeSeries 中的第二个值发送垃圾邮件?
How do I update data in a SmoothieChart without spamming the the second value in TimeSeries?
我想使用 JSON
建立某种股票交易网站
function getJSON(_url, _type) {
var request = new XMLHttpRequest();
request.open("GET", _url, true);
request.onload = function () {
if (request.status == 200 && request.readyState == 4) {
Callback(JSON.parse(request.responseText), _type);
} else
error("reach");
};
request.send(null);
}
以及获取数据的回调函数。
function Callback(_data, _type) {
switch (_type) {
case 1.1:
initAktien(_data);
break;
case 1.2:
updateAktien(_data);
break;
}
}
为了可视化我正在使用 SmoothieChart 的股票。
var lines = [];
var smoothie = new SmoothieChart({
tooltip: true, millisPerPixel: 50, minValueScale: 0,
grid: {fillStyle: '#99d6ff', strokeStyle: '#6c7d82', verticalSections: 8, borderVisible: false},
labels: {disabled: true, fontSize: 9}, minValue: 0, horizontalLines: [{color: '#000000', lineWidth: 1, value: 0}, {color: '#4d0f00', lineWidth: 2, value: 100}]
});
smoothie.streamTo(document.getElementById("aktien-grafik"), 500);
如果您想知道,请注意:"Aktien" 表示库存,"preis" 表示价格,"anzahlVerfügbar" 表示可用数量。我从其他人那里得到了这段代码,我应该 "fix" 它。这就是为什么它部分是德语的。
function initAktien(_data) {
var stocks = document.getElementById("aktien");
var amount = document.getElementById("amount");
for (var i = 0; i <= _data.length - 1; i++) {
var stockoption = document.createElement("option");
stockoption.innerHTML = _data[i].name;
stocks.appendChild(stockoption);
}
for (var j = 1; j <= 5; j++) {
var amountoption = document.createElement("option");
amountoption.innerHTML = j;
amount.appendChild(amountoption);
}
}
function updateAktien(_data) {
var select = document.getElementById("aktien").selectedIndex;
document.getElementById("kurs").innerHTML = _data[select].preis;
document.getElementById("anz").innerHTML = _data[select].anzahlVerfuegbar;
//spam is because of here
lines.push(new TimeSeries());
lines[select].append(new Date().getTime(), _data[select].preis);
smoothie.addTimeSeries(lines[select], {lineWidth: 2, strokeStyle: "#000000"});
}
我可以很好地渲染图表,甚至可以得到一个显示时间戳、价格和时间的叠加层。不幸的是,它会在覆盖层中发送垃圾邮件,从而使网站速度非常快。移除覆盖层并不能解决问题,因为价格是不停地附加的
在我标记的地方的某个地方。我不知道如何在不发送该值的情况下保持数据更新和图表绘制。
我认为这不是最好的解决方案,但它确实有效。有点冗余的代码。
function initAktien(_data) {
var stocks = getID("aktien");
var amount = getID("amount");
for (var i = 0; i <= _data.length - 1; i++) {
var stockoption = document.createElement("option");
stockoption.innerHTML = _data[i].name;
stocks.appendChild(stockoption);
lines.push(new TimeSeries());
lines[i].append(new Date().getTime(), _data[i].preis.toFixed(2));
smoothie.addTimeSeries(lines[i], {lineWidth: 2, strokeStyle: "#000000"});
}
}
function updateAktien(_data) {
var select = getID("aktien").selectedIndex;
getID("kurs").innerHTML = _data[select].preis.toFixed(2);
getID("anz").innerHTML = _data[select].anzahlVerfuegbar;
//Grafik update
lines[select].append(new Date().getTime(), _data[select].preis.toFixed(2));
}
我想使用 JSON
建立某种股票交易网站function getJSON(_url, _type) {
var request = new XMLHttpRequest();
request.open("GET", _url, true);
request.onload = function () {
if (request.status == 200 && request.readyState == 4) {
Callback(JSON.parse(request.responseText), _type);
} else
error("reach");
};
request.send(null);
}
以及获取数据的回调函数。
function Callback(_data, _type) {
switch (_type) {
case 1.1:
initAktien(_data);
break;
case 1.2:
updateAktien(_data);
break;
}
}
为了可视化我正在使用 SmoothieChart 的股票。
var lines = [];
var smoothie = new SmoothieChart({
tooltip: true, millisPerPixel: 50, minValueScale: 0,
grid: {fillStyle: '#99d6ff', strokeStyle: '#6c7d82', verticalSections: 8, borderVisible: false},
labels: {disabled: true, fontSize: 9}, minValue: 0, horizontalLines: [{color: '#000000', lineWidth: 1, value: 0}, {color: '#4d0f00', lineWidth: 2, value: 100}]
});
smoothie.streamTo(document.getElementById("aktien-grafik"), 500);
如果您想知道,请注意:"Aktien" 表示库存,"preis" 表示价格,"anzahlVerfügbar" 表示可用数量。我从其他人那里得到了这段代码,我应该 "fix" 它。这就是为什么它部分是德语的。
function initAktien(_data) {
var stocks = document.getElementById("aktien");
var amount = document.getElementById("amount");
for (var i = 0; i <= _data.length - 1; i++) {
var stockoption = document.createElement("option");
stockoption.innerHTML = _data[i].name;
stocks.appendChild(stockoption);
}
for (var j = 1; j <= 5; j++) {
var amountoption = document.createElement("option");
amountoption.innerHTML = j;
amount.appendChild(amountoption);
}
}
function updateAktien(_data) {
var select = document.getElementById("aktien").selectedIndex;
document.getElementById("kurs").innerHTML = _data[select].preis;
document.getElementById("anz").innerHTML = _data[select].anzahlVerfuegbar;
//spam is because of here
lines.push(new TimeSeries());
lines[select].append(new Date().getTime(), _data[select].preis);
smoothie.addTimeSeries(lines[select], {lineWidth: 2, strokeStyle: "#000000"});
}
我可以很好地渲染图表,甚至可以得到一个显示时间戳、价格和时间的叠加层。不幸的是,它会在覆盖层中发送垃圾邮件,从而使网站速度非常快。移除覆盖层并不能解决问题,因为价格是不停地附加的 在我标记的地方的某个地方。我不知道如何在不发送该值的情况下保持数据更新和图表绘制。
我认为这不是最好的解决方案,但它确实有效。有点冗余的代码。
function initAktien(_data) {
var stocks = getID("aktien");
var amount = getID("amount");
for (var i = 0; i <= _data.length - 1; i++) {
var stockoption = document.createElement("option");
stockoption.innerHTML = _data[i].name;
stocks.appendChild(stockoption);
lines.push(new TimeSeries());
lines[i].append(new Date().getTime(), _data[i].preis.toFixed(2));
smoothie.addTimeSeries(lines[i], {lineWidth: 2, strokeStyle: "#000000"});
}
}
function updateAktien(_data) {
var select = getID("aktien").selectedIndex;
getID("kurs").innerHTML = _data[select].preis.toFixed(2);
getID("anz").innerHTML = _data[select].anzahlVerfuegbar;
//Grafik update
lines[select].append(new Date().getTime(), _data[select].preis.toFixed(2));
}