| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf8" />
- <title>delAllGraph</title>
- <style>
- html, body, #canvas {
- width: 100%;
- height: 100%;
- margin: 0px;
- padding: 0px;
- }
- </style>
- <script src="../../dist/crender.map.js"></script>
- </head>
- <body>
- <canvas id="canvas"></canvas>
- </body>
- <script>
- const { CRender, extendNewGraph } = window.CRender
- const render = new CRender(document.querySelector('#canvas'))
- const [w, h] = render.area
- function randomNum (minNum, maxNum) {
- switch (arguments.length) {
- case 1:
- return parseInt(Math.random() * minNum + 1, 10)
- case 2:
- return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10)
- default:
- return 0
- }
- }
- const circles = new Array(100).fill(0).map(foo => render.add({
- name: 'circle',
- shape: {
- rx: randomNum(0, w),
- ry: randomNum(0, h),
- r: 10
- },
- style: {
- fill: '#ffee97',
- stroke: 'goldenrod',
- lineWidth: 2
- }
- }))
- function wait (time) {
- return new Promise(resolve => setTimeout(resolve, time))
- }
- async function start () {
- await wait(1000)
- render.delAllGraph()
- }
- start()
- </script>
- </html>
|