vave
Полезный
- Регистрация
- 22 Июн 2007
- Сообщения
- 467
- Реакции
- 16
- Автор темы
- #1
Дорогие друзья, подскажите пожалуйста, как данный скрипт, вставить в скрипт графика CanvasJS?
Вот рабочий график, необходимо что бы в зависимости от рандомного значения, менялся ход графика
Вот что пытаюсь сделать, но данный код не работает:
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
animationDuration: 100,
animationEnabled: true,
zoomEnabled: false,
axisX:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
axisY:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
backgroundColor: "transparent",
data: [{
type: "line",
lineThickness: 3,
lineColor:"#219634",
dataPoints: []
}]
});
addDataPointsBuy(100);
chart.render();
function addDataPointsBuy(noOfDps) {
var xVal = chart.options.data[0].dataPoints.length + 1, yVal = 10;
for(var i = 0; i < noOfDps; i++) {
function randomInteger(min, max) {
let rand = min + Math.random() * (max + 1 - min);
return Math.floor(rand);
}
setInterval(function(){
let value = randomInteger(1, 2);
if (value === 1) {
yVal = yVal + Math.round(5 + Math.random() *(-4.4-6.8));
} else {
yVal = yVal + Math.round(6.3 + Math.random() *(-4.4-6.8));
}
document.getElementById("content").innerHTML = value;
},3000);
chart.options.data[0].dataPoints.push({x: xVal,y: yVal});
xVal++;
}
}
}
Вот рабочий график, необходимо что бы в зависимости от рандомного значения, менялся ход графика
HTML:
<script>
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
animationDuration: 100,
animationEnabled: true,
zoomEnabled: false,
axisX:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
axisY:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
backgroundColor: "transparent",
data: [{
type: "line",
lineThickness: 3,
lineColor:"#219634",
dataPoints: []
}]
});
addDataPointsBuy(100);
chart.render();
function addDataPointsBuy(noOfDps) {
var xVal = chart.options.data[0].dataPoints.length + 1, yVal = 10;
for(var i = 0; i < noOfDps; i++) {
yVal = yVal + Math.round(5 + Math.random() *(-4.4-6.8));
chart.options.data[0].dataPoints.push({x: xVal,y: yVal});
xVal++;
}
}
}
</script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 100%; width: 100%;">
Вот что пытаюсь сделать, но данный код не работает:
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
animationDuration: 100,
animationEnabled: true,
zoomEnabled: false,
axisX:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
axisY:{
gridThickness: 0,
tickLength: 0,
lineThickness: 0,
labelFormatter: function(){
return " ";
}
},
backgroundColor: "transparent",
data: [{
type: "line",
lineThickness: 3,
lineColor:"#219634",
dataPoints: []
}]
});
addDataPointsBuy(100);
chart.render();
function addDataPointsBuy(noOfDps) {
var xVal = chart.options.data[0].dataPoints.length + 1, yVal = 10;
for(var i = 0; i < noOfDps; i++) {
function randomInteger(min, max) {
let rand = min + Math.random() * (max + 1 - min);
return Math.floor(rand);
}
setInterval(function(){
let value = randomInteger(1, 2);
if (value === 1) {
yVal = yVal + Math.round(5 + Math.random() *(-4.4-6.8));
} else {
yVal = yVal + Math.round(6.3 + Math.random() *(-4.4-6.8));
}
document.getElementById("content").innerHTML = value;
},3000);
chart.options.data[0].dataPoints.push({x: xVal,y: yVal});
xVal++;
}
}
}