canvas+WebGL实现交互式复变有理函数可视化代码-html代码-BFW代码库

canvas+WebGL实现交互式复变有理函数可视化代码

代码语言：html

所属分类：其他

代码描述：canvas+WebGL实现交互式复变有理函数可视化代码码

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

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  

  
  
<style>
body {
  font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif;
  background-color: #000;
  margin: 0;
  overflow: hidden;
  background-repeat: no-repeat;
}

canvas {
  position: absolute;
}

#controls:hover {
  background-color: rgb(255, 255, 200);
}

#menu {
  font-size: 80%;
  margin: 0;
  padding: 5px;
  position: absolute;
  left: 5px;
  top: 5px;
  border-radius: 10px;
  background-color: rgba(255, 255, 128, 0.9);
  color: black;
  z-index: 10;
}

#menu.hidden #showhide {
  display: none;
}

#menu p {
  margin-top: 3px;
  margin-bottom: 3px;
}

#menu button {
  margin-right: 5px;
  margin-left: 5px;
}

#ifnotrandom.israndom {
  display: none;
}

#huesample {
  display: inline-block;
  margin-left: 1em;
  width: 3em;
  height: 1em;
  background-color: #f00;
  border: 1px solid black;
}

span.lime {
  font-size: 150%;
  color: lime;
}

span.red {
  font-size: 150%;
  color: red;
}

.toggle-item {
  display: inline-block;
  width: 40px;
  height: 18px;
  border-radius: 9px;
  background-color: #cccccc;
  vertical-align: top;
  position: relative;
}

.toggle-item::after {
  display: inline-block;
  position: absolute;
  content: "";
  width: 14px;
  height: 14px;
  background-color: #004080;
  border-radius: 7px;
  top: 2px;
  left: 2px;
}

.toggle-item.on::after {
  left: 24px;
  background-color: #0080ff;
}
</style>

  
  
</head>

<body translate="no">
  <div id="menu">
  <p id="controls">close controls</p>
  <div id="showhide">
    <hr>
    <p><span class="lime">●</span> numerator degree: <input type="range" min=0 max=10 value=7 id="ordern">
      <span id="ordernv">5</span>
    </p>
    <p><span class="red">●</span> denominator degree: <input type="range" min=0 max=10 value=7 id="orderd">
      <span id="orderdv">5</span>
    </p>
    <p>mouse position :
      re : <span id="re"></span>
      im : <span id="im"></span></p>
    <hr>
    <p>color scheme:<input type="range" min=0 max=6 value=0 id="colorscheme"> <span id="colorschemev"></span>
    </p>
    <hr>
    <.........完整代码请登录后点击上方下载按钮下载查看