clay-core

<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="shortcut icon" href="../clay.png" type="image/x-png"> <link rel="stylesheet" href="./libs/easycss-1.3.1.min.css"> <link rel="stylesheet" href="frame.css"> <script src="../build/clay-core.js"></script> <title>文档 - clay.js</title> <script> function loadpage(url) { document.getElementsByTagName('iframe')[0].src = "./apis/" + url + ".html"; window.location.href = "#/" + url; } function toEdit() { var url = window.location.href.replace(/[^#]*(#\/){0,1}/, ''); window.location.href = 'https://github.com/yelloxing/clay-core/blob/master/doc/apis/' + url + '.html'; } </script> </head> <body onresize="changeSize()"> <button onclick='toEdit()' id='edit-btn'>编辑文档</button> <div class="menu-frame" id='menu-frame'> <header> <a href='https://yelloxing.github.io/clay-core/doc/' target="_blank">clay.js</a> / API </header> <input type="text" placeholder="Type to filter" onkeyup='doSearch(this.value)'> <span>说明&指南</span> <label>快速开始</label> <ul> <li onclick='loadpage("quickstart/environment")'>初始化环境</li> <li onclick='loadpage("quickstart/url")'>有用的链接</li> </ul> <label>教程</label> <ul> <li onclick='loadpage("course/node_and_data")'>结点和数据操作</li> <li onclick='loadpage("course/layout")'>布局的使用</li> <li onclick='loadpage("course/layer_and_region")'>图层、区域管理者</li> </ul> <span>接口API</span> <label>结点对象</label> <ul> <li onclick='loadpage("clayobject/node")'>基本的结点操作</li> <li onclick='loadpage("clayobject/tool")'>有益的方法</li> <li onclick='loadpage("clayobject/node_and_data")'>数据绑定</li> <li onclick='loadpage("clayobject/event")'>事件绑定</li> </ul> <label>工具类</label> <ul> <li onclick='loadpage("tool/color")'>色彩相关</li> <li onclick='loadpage("tool/animation")'>轮询</li> <li onclick='loadpage("tool/layer_and_region")'>图层和区域管理者</li> </ul> <label>计算&求值</label> <ul> <li onclick='loadpage("calculate/transform")'>坐标变换</li> <li onclick='loadpage("calculate/interpolate")'>曲线插值</li> <li onclick='loadpage("calculate/matrix4")'>Matrix4矩阵</li> <li onclick='loadpage("calculate/map")'>地球坐标映射</li> </ul> <label>WebGL</label> <ul> <li onclick='loadpage("webgl/core")'>绘图对象</li> <li onclick='loadpage("webgl/shader")'>着色器</li> <li onclick='loadpage("webgl/buffer")'>缓冲区</li> <li onclick='loadpage("webgl/texture")'>纹理</li> </ul> <label>布局</label> <ul> <li onclick='loadpage("layout/tree")'>tree 树布局</li> </ul> <label>可加强部分</label> <ul> <li onclick='loadpage("enhance/config")'>配置项</li> </ul> <footer onclick='window.location.href="https://github.com/yelloxing/clay-core"'> Fork Me On Github </footer> </div> <iframe frameborder="0"></iframe> </body> <script> window.setTimeout(function () { loadpage(window.location.href.replace(/[^#]*(#\/){0,1}/, '') || "quickstart/environment"); }, 200); var lis = document.getElementsByTagName('li'), i; function doSearch(key) { for (i = 0; i < lis.length; i++) { if (new RegExp(key).test(lis[i].innerText)) { lis[i].style.display = 'block'; } else { lis[i].style.display = 'none'; } } } window.console && window.console.log && (console.log([ '%c ', '我们的目标是：提供更友好的web端绘图接口。', ' ', '始终秉承着开源的初衷，任何有益的建议或设计都是被鼓励作为新的代码贡献进来的。', ' ' ].join('\n'), "color:#d66eac"), console.log("%cclay.js项目github地址：https://github.com/yelloxing/clay-core （期待你的加入）", "color:#5292b2")); </script> <script> // 适配不同大小屏幕 function changeSize() { var body = document.getElementsByTagName('body')[0], menu = document.getElementById('menu-frame'), iframe = document.getElementsByTagName('iframe')[0], edit = document.getElementById('edit-btn'), scale, width = body.offsetWidth; if (width >= 1200) return; scale = width / 1200; // 缩放 body.style.transform = "scale(" + scale + ")"; // 恢复 menu.style.height = (100 / scale) + "vh"; iframe.style.height = (100 / scale) + "vh"; iframe.style.width = "calc(" + (100 / scale) + "vw - 2.6rem)"; edit.style.left = "calc(" + (100 / scale) + "vw - 1rem)"; } changeSize(); </script> </html>