交通轨迹动画效果

代码语言:html

所属分类:动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<title> traffic</title>

</head>
<body translate="no">

<script>
      "use strict";

/* no street : they run everywhere
              */
window.addEventListener("load", function () {

  let canv, ctx;
  let sqSide;
  let nbx, nby; // nb of squares horiz. / vert.
  let terrain; // bi-dimensionnal array for car paths

  let cars;
  let blocked, veryVeryBlocked; // thresholds for blocking detection

  let carsMaxLength; // maximum length for cars
  let nbCars; // number of cars
  let initTime;
  let msByStep; // interval between 2 moves

  /********************************************************
  parameters - play with them
  ********************************************************/

  const bgColor = '#004'; // background color

  nbCars = 20; // number of cars

  /* an 'element' is a little square - a car id made of a few elements */
  carsMaxLength = 15; // cars max length (in elements, not pixels)
  nbx = 50; // width (in elements)
  msByStep = 100; // ms between 2 moves

  blocked = 2 * carsMaxLength; // threshold for blocking detection
  veryVeryBlocked = 3 * carsMaxLength; // threshold for blocking detection

  //********************************************************

  // shortcuts for Math
  const mrandom = Math.random;
  const mfloor = Math.floor;
  .........完整代码请登录后点击上方下载按钮下载查看

网友评论0