Показать сообщение отдельно
  #2 (permalink)  
Старый 16.08.2019, 00:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Иса Мирзоев,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  canvas{
      border: 1px solid #000000
  }

  </style>

</head>

<body>
<canvas id="canv"></canvas>
<script>
 //график

//определяем канвас
//задаем размеры и цвета, ширину линий и шрифт
//задаем стартовые значения осей
//рисуем оси


var canv = document.getElementById("canv")
var canvas = canv.getContext("2d")

canv.width = 800
canv.height = 500
canvas.lineWidth = 2
canvas.font = "Georgia 10px"
canvas.strokeStyle = "red"

var oy=canv.width/2
var ox=canv.height/2


canvas.beginPath()
canvas.moveTo(oy,0)
canvas.lineTo(oy,canv.height)
canvas.moveTo(0,ox)
canvas.lineTo(canv.width,ox)
canvas.stroke()
canvas.closePath()


//определяем длину шага в пунктах, количество шагов, цвет и толщину
//через 2 цикла задаем описание цифр, указав связь i с шагом, перезадавая количество шагов для разных осей


var step = 50
var steps = canv.width/step
canv.lineWidth = 1
canvas.fillStyle = "black"
canvas.lineWidth = 1

for(i=0; i<steps; i++){
canvas.fillText((i*step)-oy,i*step+2,ox+10)
}

steps = canv.height/step

for(i=0; i<=steps; i++){
canvas.fillText(ox-(i*step),oy+2,i*step+10)
}



canvas.strokeStyle = "gold"
canvas.strokeText("Y",oy-12,12)
canvas.strokeText("X",canv.width-8,ox-8)


//пишем будущую функцию и цвет графика
//задаем стартовые точки
//начинаем канвас со стартовыми точками
//проходимся циклом, где переводим новые точки в старые и указываем конечные данные канваса
//завершаем канвас



function f(x){
    return x * x
}

canvas.fillStyle = "blue"

var x0 = 0;
var y0 = ox - f(-oy);

canvas.beginPath()
canvas.moveTo(x0,y0);
for(i=1; i<=canv.width; i++){
var x = i;
var y = ox - f(i - oy);
canvas.lineTo(x, y);
}
canvas.stroke()
canvas.closePath()

</script>
</body>
</html>
Ответить с цитированием