70 lines
2.3 KiB
Markdown
Executable File
70 lines
2.3 KiB
Markdown
Executable File
[[post_data {
|
|
"author" : "KyMAN",
|
|
"since" : 20210620,
|
|
"version" : 20210620
|
|
}]]
|
|
# Iniciando
|
|
|
|
Kanvas no es más que una pequeña librería ECMAScript 2015 totalmente autosuficiente, por lo que sólo
|
|
requiere de la implementación en HTML de dicha librería para poder ser iniciada. Para ello podemos
|
|
hacer uso de cualquiera de las direcciones puestas al principio del manual ([/es/#Kanvas]). El
|
|
siguiente ejemplo HTML muestra la creación de un Kanvas vacío que ocupa todo el marco HTML del
|
|
navegador.
|
|
|
|
```html
|
|
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<title>Kanvas - Test</title>
|
|
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
|
|
<meta charset="utf-8" />
|
|
|
|
<style data-type="text/css" data-language="CSS3" data-rel="stylesheet" charset="utf-8">
|
|
|
|
html,body{
|
|
height : 100%;
|
|
margin : 0px;
|
|
}
|
|
|
|
body{overflow : hidden;}
|
|
|
|
.kanvas{
|
|
position : absolute;
|
|
top : 0px;
|
|
left : 0px;
|
|
width : 100%;
|
|
height : 100%;
|
|
}
|
|
|
|
</style>
|
|
|
|
<script data-type="text/javascript" data-language="ECMAScript 2015" src="/Kanvas.ecma.js" data-crossorigin="anonymous" charset="utf-8"></script>
|
|
|
|
<script data-type="text/javascript" data-language="ECMAScript 2015" charset="utf-8">
|
|
|
|
kanvas = new Kanvas();
|
|
|
|
</script>
|
|
|
|
</head>
|
|
<body></body>
|
|
</html>
|
|
```
|
|
|
|
Como podemos ver en el ejemplo, que el propio Kanvas es una clase objeto con la cual creamos un
|
|
objeto el cual será el objeto que gestiona todo lo que se verá en este manual. Cada instancia Kanvas
|
|
gestionará un único Kanvas en el GUI, permitiendo poder hacer uso de más de un elemento al mismo
|
|
tiempo dentro del entorno HTML.
|
|
|
|
[[html_data {
|
|
"title" : "Kanvas - Iniciando",
|
|
"url" : "https://kanvas.k3y.pw/es/doc/kanvas.starting.html",
|
|
"author" : "KyMAN",
|
|
"since" : 20210620,
|
|
"version" : 20210620,
|
|
"key_words" : "kanvas,canvas,kyman,2d,graphics,iniciar,implementar,incluir",
|
|
"description" : "Manual para iniciar Kanvas.",
|
|
"project" : "Kanvas",
|
|
"logo" : "https://kanvas.k3y.pw/images/kanvas.png"
|
|
}]]
|