Ray-metrixs NPM

ray-metrixs

React TimePicker

author

ilex.h

Usage

npm install --save ray-metrixs

basic use html

html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>temp</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="./../assets/stars.css" rel="stylesheet">
    <script src="./../lib/utils.js"></script>
    <script src="./../lib//stars.js"></script>
    <script src="./../lib/nest.js"></script>
    <script src="./../lib/silk.js"></script>
    <script src="./../lib/vastSky.js"></script>
    <script src="./../lib/Banner.js"></script>
    <style>
      .banner {
        width: 100%;
        height: 492px;
        background-color: black;
        overflow: hidden;
        line-height: 1.6;
        font-family: "Microsoft YaHei";
        color: #c3c9d8;
        font-size: 14px;
        position: relative;
        z-index: -1;
      }

      canvas {
        position: absolute;
        padding: 0;
        margin: 0;
        bottom: 0;
      }
    </style>
  </head>
  <body>
    <div class="banner" id="banner">
      <canvas id="mycanvas"></canvas>
    </div>
    <script>
      Star.init({
        height: 1500,
        round: 2000,
        zIndex: -2
      });

      var nest = new Nest({
        zIndex: -1,
        opacity: 0.7,
        color: "0,0,255",
        lines:200
      });

      nest.init();

      var silk = new Silk({
        zIndex: -1,
        alpha: 0.8,
        size: 30
      });

      silk.init();

      var vastSky = new VastSky({
        zIndex: -1,
        alpha: 0.8
      });

      vastSky.init();

      // baner
      const bannerWrapper = document.getElementById('banner');
      var banner = new Banner({
        width: bannerWrapper.clientWidth,
        height: bannerWrapper.clientHeight,
        canvas: document.getElementById('mycanvas')
      });

      banner.canvasInit();
    </script>
  </body>
</html>

License

MIT license.

metrixs

@everything-registry/sub-chunk-2533

2 years ago

2 years ago

2 years ago

2 years ago