drawing node with verticies count dynamically calculated

This commit is contained in:
dongho
2024-09-04 16:15:39 +09:00
parent 532601bc43
commit 43817cfeea
6 changed files with 18 additions and 386 deletions

View File

@ -1,7 +1,9 @@
[package]
author = ["Random Walker"]
name = "ekstrahMap"
version = "0.1.0"
edition = "2021"
public = true
[dependencies]
console_log = "1.0.0"
@ -16,4 +18,4 @@ version = "0.3.4"
features = ["Document", "Element", "HtmlElement", "Node", "Window", "HtmlCanvasElement", "WebGlBuffer", "WebGlVertexArrayObject", "WebGl2RenderingContext", "WebGlProgram", "WebGlShader"]
[lib]
crate-type = ["cdylib", "rlib"]
crate-type = ["cdylib"]

View File

@ -1,10 +1,15 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
<script defer src="pkg/ekstrahMap.js"></script>
</head>
<body>
<canvas id="canvas" height="150" width="150">
<canvas id="glcanvas" height="640" width="570">
<script type="module">
import init from "./pkg/ekstrahMap.js";
init();
</script>
<!-- Note the usage of `type=module` here as this is an ES6 module -->
</body>
</html>

View File

@ -21,6 +21,7 @@ pub fn start() -> Result<(), JsValue> {
attribute vec4 aVertexPosition;
void main() {
gl_Position = aVertexPosition;
gl_PointSize = 5.0;
}
"#,
)?;
@ -29,16 +30,16 @@ pub fn start() -> Result<(), JsValue> {
WebGl2RenderingContext::FRAGMENT_SHADER,
r#"
void main() {
gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);
gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
}
"#,
)?;
let program = link_program(&gl, &vert_shader, &frag_shader)?;
gl.use_program(Some(&program));
let positions: [f32; 8] = [0.5, 0.5, -0.5, 0.5, 0.5, -0.5, -0.5, -0.5];
let buffer = bind_2d_float32_data(&gl, &positions)?;
let vertices: [f32; 8] = [0.5, 0.5, -0.5, 0.5, 0.5, -0.5, -0.5, -0.5];
let buffer = bind_2d_float32_data(&gl, &vertices)?;
draw(&gl, &program, &buffer)?;
draw(&gl, &program, &buffer, (vertices.len() / 2) as i32)?;
Ok(())
}
@ -122,6 +123,7 @@ fn draw(
gl: &WebGl2RenderingContext,
program: &WebGlProgram,
buffer: &WebGlVertexArrayObject,
vert_len: i32,
) -> Result<(), JsValue> {
gl.clear_color(0.0, 0.0, 0.0, 1.0);
gl.clear(WebGl2RenderingContext::COLOR_BUFFER_BIT);
@ -132,7 +134,7 @@ fn draw(
gl.vertex_attrib_pointer_with_i32(0, 2, WebGl2RenderingContext::FLOAT, false, 0, 0);
gl.enable_vertex_attrib_array(0);
gl.draw_arrays(WebGl2RenderingContext::TRIANGLE_STRIP, 0, 4);
gl.draw_arrays(WebGl2RenderingContext::POINTS, 0, vert_len);
Ok(())
}

View File

@ -1,147 +0,0 @@
use wasm_bindgen::prelude::*;
use web_sys::{WebGl2RenderingContext, WebGlProgram, WebGlShader};
#[wasm_bindgen(start)]
fn start() -> Result<(), JsValue> {
let document = web_sys::window().unwrap().document().unwrap();
let canvas = document.get_element_by_id("canvas").unwrap();
let canvas: web_sys::HtmlCanvasElement = canvas.dyn_into::<web_sys::HtmlCanvasElement>()?;
let context = canvas
.get_context("webgl2")?
.unwrap()
.dyn_into::<WebGl2RenderingContext>()?;
let vert_shader = compile_shader(
&context,
WebGl2RenderingContext::VERTEX_SHADER,
r##"#version 300 es
in vec4 position;
void main() {
gl_Position = position;
}
"##,
)?;
let frag_shader = compile_shader(
&context,
WebGl2RenderingContext::FRAGMENT_SHADER,
r##"#version 300 es
precision highp float;
out vec4 outColor;
void main() {
outColor = vec4(1, 1, 1, 1);
}
"##,
)?;
let program = link_program(&context, &vert_shader, &frag_shader)?;
context.use_program(Some(&program));
let vertices: [f32; 9] = [-0.7, -0.7, 0.0, 0.7, -0.7, 0.0, 0.0, 0.7, 0.0];
let position_attribute_location = context.get_attrib_location(&program, "position");
let buffer = context.create_buffer().ok_or("Failed to create buffer")?;
context.bind_buffer(WebGl2RenderingContext::ARRAY_BUFFER, Some(&buffer));
// Note that `Float32Array::view` is somewhat dangerous (hence the
// `unsafe`!). This is creating a raw view into our module's
// `WebAssembly.Memory` buffer, but if we allocate more pages for ourself
// (aka do a memory allocation in Rust) it'll cause the buffer to change,
// causing the `Float32Array` to be invalid.
//
// As a result, after `Float32Array::view` we have to be very careful not to
// do any memory allocations before it's dropped.
unsafe {
let positions_array_buf_view = js_sys::Float32Array::view(&vertices);
context.buffer_data_with_array_buffer_view(
WebGl2RenderingContext::ARRAY_BUFFER,
&positions_array_buf_view,
WebGl2RenderingContext::STATIC_DRAW,
);
}
let vao = context
.create_vertex_array()
.ok_or("Could not create vertex array object")?;
context.bind_vertex_array(Some(&vao));
context.vertex_attrib_pointer_with_i32(
position_attribute_location as u32,
3,
WebGl2RenderingContext::FLOAT,
false,
0,
0,
);
context.enable_vertex_attrib_array(position_attribute_location as u32);
context.bind_vertex_array(Some(&vao));
let vert_count = (vertices.len() / 3) as i32;
draw(&context, vert_count);
Ok(())
}
fn draw(context: &WebGl2RenderingContext, vert_count: i32) {
context.clear_color(0.0, 0.0, 0.0, 1.0);
context.clear(WebGl2RenderingContext::COLOR_BUFFER_BIT);
context.draw_arrays(WebGl2RenderingContext::TRIANGLES, 0, vert_count);
}
pub fn compile_shader(
context: &WebGl2RenderingContext,
shader_type: u32,
source: &str,
) -> Result<WebGlShader, String> {
let shader = context
.create_shader(shader_type)
.ok_or_else(|| String::from("Unable to create shader object"))?;
context.shader_source(&shader, source);
context.compile_shader(&shader);
if context
.get_shader_parameter(&shader, WebGl2RenderingContext::COMPILE_STATUS)
.as_bool()
.unwrap_or(false)
{
Ok(shader)
} else {
Err(context
.get_shader_info_log(&shader)
.unwrap_or_else(|| String::from("Unknown error creating shader")))
}
}
pub fn link_program(
context: &WebGl2RenderingContext,
vert_shader: &WebGlShader,
frag_shader: &WebGlShader,
) -> Result<WebGlProgram, String> {
let program = context
.create_program()
.ok_or_else(|| String::from("Unable to create shader object"))?;
context.attach_shader(&program, vert_shader);
context.attach_shader(&program, frag_shader);
context.link_program(&program);
if context
.get_program_parameter(&program, WebGl2RenderingContext::LINK_STATUS)
.as_bool()
.unwrap_or(false)
{
Ok(program)
} else {
Err(context
.get_program_info_log(&program)
.unwrap_or_else(|| String::from("Unknown error creating program object")))
}
}

View File

@ -1,131 +0,0 @@
use wasm_bindgen::prelude::*;
use web_sys::{WebGl2RenderingContext, WebGlProgram, WebGlShader};
#[wasm_bindgen(start)]
fn start() -> Result<(), JsValue> {
let document = web_sys::window().unwrap().document().unwrap();
let canvas = document.get_element_by_id("canvas").unwrap();
let canvas: web_sys::HtmlCanvasElement = canvas.dyn_into::<web_sys::HtmlCanvasElement>()?;
let context = canvas
.get_context("webgl2")?
.unwrap()
.dyn_into::<WebGl2RenderingContext>()?;
let vert_shader = compile_shader(
&context,
WebGl2RenderingContext::VERTEX_SHADER,
r##"
attribute vec4 aVertexPosition;
void main() {
gl_Position = aVertexPosition;
}
"##,
)?;
let frag_shader = compile_shader(
&context,
WebGl2RenderingContext::FRAGMENT_SHADER,
r##"
void main() {
gl_FragColor = vec4(0, 1.0, 0, 1.0);
}
"##,
)?;
let program = link_program(&context, &vert_shader, &frag_shader)?;
context.use_program(Some(&program));
let vertices: [f32; 8] = [0.5, 0.5, -0.5, 0.5, 0.5, -0.5, -0.5, -0.5];
let position_attribute_location = context.get_attrib_location(&program, "position");
let buffer = context.create_buffer().ok_or("Failed to create buffer")?;
context.bind_buffer(WebGl2RenderingContext::ARRAY_BUFFER, Some(&buffer));
unsafe {
let positions_array_buf_view = js_sys::Float32Array::view(&vertices);
context.buffer_data_with_array_buffer_view(
WebGl2RenderingContext::ARRAY_BUFFER,
&positions_array_buf_view,
WebGl2RenderingContext::STATIC_DRAW,
);
}
let vao = context
.create_vertex_array()
.ok_or("Could not create vertex array object")?;
context.bind_vertex_array(Some(&vao));
context.vertex_attrib_pointer_with_i32(
0, //position_attribute_location as u32,
2,
WebGl2RenderingContext::FLOAT,
false,
0,
0,
);
context.enable_vertex_attrib_array(0); //position_attribute_location as u32);
context.bind_vertex_array(Some(&vao));
let vert_count = (vertices.len() / 3) as i32;
draw(&context, vert_count);
Ok(())
}
fn draw(context: &WebGl2RenderingContext, vert_count: i32) {
context.clear_color(0.0, 0.0, 0.0, 1.0);
context.clear(WebGl2RenderingContext::COLOR_BUFFER_BIT);
context.draw_arrays(WebGl2RenderingContext::TRIANGLE_STRIP, 0, 3); //vert_count
}
pub fn compile_shader(
context: &WebGl2RenderingContext,
shader_type: u32,
source: &str,
) -> Result<WebGlShader, String> {
let shader = context
.create_shader(shader_type)
.ok_or_else(|| String::from("Unable to create shader object"))?;
context.shader_source(&shader, source);
context.compile_shader(&shader);
if context
.get_shader_parameter(&shader, WebGl2RenderingContext::COMPILE_STATUS)
.as_bool()
.unwrap_or(false)
{
Ok(shader)
} else {
Err(context
.get_shader_info_log(&shader)
.unwrap_or_else(|| String::from("Unknown error creating shader")))
}
}
pub fn link_program(
context: &WebGl2RenderingContext,
vert_shader: &WebGlShader,
frag_shader: &WebGlShader,
) -> Result<WebGlProgram, String> {
let program = context
.create_program()
.ok_or_else(|| String::from("Unable to create shader object"))?;
context.attach_shader(&program, vert_shader);
context.attach_shader(&program, frag_shader);
context.link_program(&program);
if context
.get_program_parameter(&program, WebGl2RenderingContext::LINK_STATUS)
.as_bool()
.unwrap_or(false)
{
Ok(program)
} else {
Err(context
.get_program_info_log(&program)
.unwrap_or_else(|| String::from("Unknown error creating program object")))
}
}

View File

@ -1,104 +1,6 @@
/*use std::fmt::write;
use std::fmt::write;
use osmpbf::*;
*/
use yew::prelude::*;
#[function_component]
fn App() -> Html {
let counter = use_state(|| 0);
let onclick = {
let counter = counter.clone();
move |_| {
let value = *counter + 1;
counter.set(value);
}
};
html! {
<div>
<button {onclick}>{ "+1" }</button>
<p>{ *counter }</p>
</div>
}
}
fn main() {
yew::Renderer::<App>::new().render();
}
/*
const fn compileLinkProgram(vs: *const u8, vs_len: usize, fs: *const u8, fs_len: usize) -> i32 {
let test_val: i32 = 1;
test_val
}
const fn bind2DFloat32Data(data: *const f32, data_len: usize) -> i32 {
let test_val: i32 = 1;
test_val
}
pub fn glBindVertexArray(vao: i32) {
println!("glBindVertexArray");
}
pub fn glClearColor(r: f32, g: f32, b: f32, a:f32) {
println!("Clear Color");
}
pub fn glClear(mask: i32) {
println!("Clear");
}
pub fn glUseProgram(program: i32) {
println!("Using Program");
}
pub fn glDrawArrays(mode: i32, first: i32, last:i32) {
println!("Draw Arrays");
}
const COLOR_BUFFER_BIT: i32 = 16384;
const TRIANGLE_STRIP: i32 = 5;
pub fn run() {
const VS_SOURCE: &str = "attribute vec4 aVertexPosition; \
void main() { \
gl_Position = aVertexPosition; \
} \
;";
const FS_SOURCE: &str = "void main() { \
gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); \
} \
";
const POSITIONS: [f32; 8] = [0.5, 0.5, -0.5, 0.5, 0.5, -0.5, -0.5, -0.5];
const PROGRAM: i32 = compileLinkProgram(VS_SOURCE.as_ptr(), VS_SOURCE.len(), FS_SOURCE.as_ptr(), FS_SOURCE.len());
const VAO: i32 = bind2DFloat32Data(POSITIONS.as_ptr(), POSITIONS.len());
glBindVertexArray(VAO);
// Set clear color to black, fully opaqe
glClearColor(0.0, 0.0, 0.0, 1.0);
// Clear the color buffer with specified clear color
glClear(COLOR_BUFFER_BIT);
glUseProgram(PROGRAM);
{
const offset = 0;
cconst fn bind2DFloat32Data(data: *const f32, data_len: usize) -> i32 {
let test_val: i32 = 1;
test_val
}
const POSITIONS: [f32; 8] = [0.5, 0.5, -0.5, 0.5, 0.5, -0.5, -0.5, -0.5];
const PROGRAM: i32 = compileLinkProgram(VS_SOURCE.as_ptr(), VS_SOURCE.len(), FS_SOURCE.as_ptr(), FS_SOURCE.len());
const VAO: i32 = bind2DFloat32Data(POSITIONS, POSITIONS.len());onst vertexCount = 4;
gl.drawArrays(gl.TRIANGLE_STRIP, offset, vertexCount);
}
}
fn main() {
let reader = ElementReader::from_path(
@ -127,4 +29,3 @@ fn main() {
}
}
}
*/