You are not logged in.
This new topic is inspired by a recommendation by our new member, offtherock.
I don't know anything about it, other than I've seen it mentioned by both ChatGPT4o and Google's Gemini.
The demonstration link that offtherock sent provides everyone with a glimpse of what may be possible.
I think that our members who have already shown skill with presentation tools might be able to use this effectively.
To see the demo offtherock created, use this link:
i think u could benefit on using the canvas.
i made some canvas demo myself.
https://openage.org/it/samples/default/index.html
There's a lot going on in the demo, but offtherock explained that one of the exhibits is of a tombstone from a distant time, and the project is to attempt to render the script readable.
(th)
Offline
Like button can go here
This post is reserved for an index to posts that may be contributed by NewMars members.
Index:
(th)
Offline
Like button can go here
Yes I think the canvas is an underrated technology.
It's basically just a... canvas.
The only caveat is that, when we draw on it,
we don't draw on a 2d array or anything like that.
Instead the canvas is just a single large 1d array.
And instead of a single location for a single pixel, we have 4 slots, so to speak.
Those are the red,green,blue and opacity, positions.
And each is 8bits, so, a number between 0 and 255.
But once we have passed that, its just a 2d array, with a pixel in each slot.
And whatever we fill this 2d array with, gets shown on the canvas.
And then we have a loop.
We loop in circles and in every loop, we are generating a single frame,
like in a movie.
We can set it to a specific frequency, but because the cpu has a bunch of things to worry about,
its actually better not to decide for it precisely how the framerate should go.
In order to do that we use a technology called requestanimationframe.
It basically just saying to the cpu "just do your best".
It has a much better performance than if we dictate to it precisely what the framerate should be.
But anyways, then we have this canvas,
we can draw on it.
In a loop.
And we are basically just making a movie.
And we can draw whatever we like.
Like when tahanson was showing me the simulation he was making in python.
Couldn't help but feeling like, what he is making.
Would be better displayed in js on a website.
For he can do those calculations and also, display them,
in a movie.
To the entire world without any... hindering.
Just.. anybody can click a button and theres the result.
Graphically, like a video.
We need a module that decreases the complexity from that obscure large 1d array, towards that 2d array though.
Then maybe another module that can put the requestanimationframe technology under the hood as well.
But then we are basically programming in movies.
Then, if we want to make some real graphics theres this library called 3js.
I really like that library.
Thats a thing you can use if you want to render, like, real graphics on that canvas.
https://threejs.org/
With shades, and, all that super complicated stuff you have to figure out if you wanter render graphics, for real.
I have programmed my own demo for it.
https://openage.org/it/3d/
press esc for directions.
buttons are:
wasdeq
z to enable the mouse.
It runs better in chrome for it has the v8 engine.
The core dream is,
to get the entire universe under the hood.
And speak only in data.
Maybe one day we can walk around in a world like that,
which is.. just, the world.
And we can go to mars and whatnot and its all... the way it is.
We could generate planets in there,
a planet is just a function, a module.
Like that landscape im making.
I keep thinking how i could update that functionality,
to go into a sphere.
Then we have a planet.
Then just make it super duper big.
There.. thats a planet.
And if we have the altitutde in each location of a planet.
We could use that to have that peace of code, make, for instance, Mars.
Or Earth.
There is also a multiplayer option via nodejs and just... a lot more.
Online
Like button can go here
Here is a preliminary description by Google's Gemini:
Conversation with Gemini
What us Canvas Display Tool? Hi Gemini! Thank you for your assistance with many previous requests. I have heard hints of something called "Canvas" for computer display, but I'd not seen it until today, when an email correspondent sent me a link to a demo of some kind, that featured impressive computer graphics. For the members of our small International forum, please write a description of this new service, and how it might be used by the average person.
***
Hi there! It sounds like you're asking about the HTML Canvas API, a powerful tool for creating and manipulating graphics directly within a web browser. It's not a new service but a long-standing web standard that's become much more widely used and capable over time.What is the HTML Canvas?
Canvas is a standard HTML5 element, <canvas>, that acts as a container for drawing graphics on a web page using JavaScript. Think of it as a digital drawing board or a blank canvas where developers can programmatically paint shapes, lines, text, and images. Unlike static images (like a JPEG or PNG), the content on a canvas is created dynamically using code.The "magic" behind it is the Canvas API, which is a set of JavaScript methods and properties that allow for drawing. You use JavaScript to tell the browser exactly where to place each pixel, line, or shape, giving you complete control over the visual output.
How the Average Person Might Use It
While it's a tool for developers, the average person interacts with applications and websites built with Canvas all the time. Here are a few examples of how it's used:Interactive Data Visualization: Instead of static charts, websites like financial dashboards or scientific portals can use Canvas to create interactive graphs and charts that respond to your mouse movements, allowing you to zoom in on specific data points or see real-time changes.
Online Photo Editors: Simple, browser-based image editors often use Canvas to allow you to apply filters, crop, or add text to a photo without needing to download a separate program.
Browser-based Games: Many of the 2D games you can play directly in your web browser—from simple puzzles to more complex platformers—are built using the Canvas API. It's a key technology for developing games that don't require plugins like Flash.
Interactive Art and Animations: Artists and designers use Canvas to create beautiful, dynamic animations and generative art that can react to user input, like a website background that changes as you scroll.
So, while you might not be writing the code yourself, the next time you see a cool animation, an interactive chart, or a simple game on a website, there's a good chance it's powered by the HTML Canvas API.
(th)
Offline
Like button can go here
In this next session I asked Gemini about the history of Canvas. I was not surprised that it started out with Apple in 2004. I ** was ** surprised to learn that it has been widely used since about 2010.
Thank you for this overview! When was the Canvas html service developed and when did it become widely available?
That's an excellent question! The history of the Canvas API is a good example of how web standards evolve.
Initial Development: The <canvas> element was actually first introduced by Apple in 2004 for their WebKit component, which powered the Safari browser. It was used for things like creating Dashboard widgets on Mac OS X. At that time, it was a proprietary extension and not part of any official web standard.
Standardization and Wider Adoption: The turning point came a few years later. The Canvas element was adopted by other browser developers, including Mozilla for Firefox in 2005 and Opera in 2006. With multiple major browsers implementing it, it became a key part of the new HTML5 specification being developed by the Web Hypertext Application Technology Working Group (WHATWG) and later the World Wide Web Consortium (W3C).
Wide Availability: Because it was a feature of the new HTML5 standard, Canvas became widely available as browsers implemented HTML5. The first public working draft of HTML5 was released in 2008, and the final HTML5 specification was released as a W3C Recommendation in October 2014. By this time, all major browsers had excellent support for the Canvas API, making it a reliable and powerful tool for web developers worldwide.
So, while its roots go back to 2004, it was the standardization as part of HTML5 around the late 2000s and early 2010s that led to its widespread adoption and a surge in its use for the kind of impressive graphics you saw in the demo.
(th)
Offline
Like button can go here
In this closing session, I asked Gemini to **think** about how Canvas might be used by our forum:
Thank you for providing a sense of the history of this tool. Our forum membership includes a wide variety of backgrounds and abilities. We have ** just ** been joined by a member with the skills needed to create the demo I saw. Our other members have interests generally around development of space travel and habitation. We have a web site supported by our sponsor, running a php forum application. Can Canvas html be stored on the existing web site, and called from the php application, such as by using a link?
***
Yes, Canvas HTML can be stored on your existing website and called from your PHP forum application. You can integrate Canvas-based content into your forum in a few straightforward ways.How to Store and Display Canvas Content
The core of your Canvas content is not a single file but a combination of HTML, CSS, and JavaScript.HTML File: You'll have an HTML file (e.g., canvas-demo.html) that contains the <canvas> element itself. This file also links to the JavaScript and CSS files needed to make the canvas work.
JavaScript File: This is the most crucial part. The JavaScript file (e.g., canvas-script.js) contains all the code that draws on the canvas. This is where the complex graphics and animations are defined.
CSS File: A CSS file (e.g., canvas-style.css) is often used to style the canvas element and its surrounding web page, such as setting its size, adding a border, or positioning it on the page.
All of these files can be uploaded to your web server, just like any other web page or image.
Calling Canvas from PHP
Since your PHP forum application is the front end, you can display the Canvas content by creating a simple link. The link would point directly to the HTML file you've uploaded.For example, if you upload your files to a directory named canvas-demos on your server, the link in your forum post would look like this:
Check out our new space travel simulation!
When a user clicks this link, their browser will navigate to the canvas-demo.html page, which will then run the associated JavaScript to display the interactive graphics.
In short, you don't need to "call" the Canvas API from PHP; you simply need to link to the HTML page that contains the Canvas content. Your PHP application acts as the platform for sharing the URL. This approach keeps the web technologies separate and allows the browser to handle the Canvas content directly.
***Thank you for your explanation of how this powerful new tool might be integrated into our primarily text based existing structure. We've been linking to external web sites for images and file storage, so this appears to be an attractive option for display of locally produced content that might be hosted on our sponsor's site.
***
Your understanding is exactly right. Hosting Canvas content locally on your sponsor's site, rather than linking to external sites, offers several key advantages for your forum members and the community as a whole.Benefits of Local Hosting
Reliability and Control: When you host the content on your own server, you have full control. You don't have to worry about an external site going down, changing its content, or removing the file you're linking to. This ensures that the demo will always be available to your members.Faster Loading Times: For users on your forum, a locally hosted page will generally load faster than one from a third-party server, as it's coming from the same location as the forum itself. This provides a smoother and more integrated user experience.
Branding and Integration: Hosting the content locally makes it feel like a seamless part of your forum and website, reinforcing your community's identity and showing that the impressive work is a product of your members. It strengthens the sense of a shared, collaborative space.
Security: You can ensure that the content is free from malware or other security risks that might be present on an unknown third-party site.
By keeping the content "in-house," you're making the most of your forum's existing infrastructure and giving your new member a great way to showcase their skills directly to the community. It's a fantastic approach for integrating new media into your current text-based structure.
(th)
Offline
Like button can go here
One like this can host an entire website,
https://thepihut.com/products/raspberry-pi-5
and using nginx.
It can handle a significant amount of traffic.
I once paid someone to host my website,
it was super slow.
Then i replaced it with a rpi3 in my own location.
it was way faster.
plus i could do whatever i wanted,
the one who was hosting was putting all kinds of restrictions on it.
Plus they were charging for it.
The obfuscation technology matters a lot for the speed.
To not be downloading multiple files each time a viewer views the website.
Rather just a single file.
It being kinda large is not that big of a deal.
Its that, every time a file is downloaded, the http protocol requires this handshake.
A handshake for every single file.
And thats time consuming for in a code setup its usually a bunch of files.
So its both slow, and also, a big burden on the server.
Slowing down even more if there are many requests.
Using bash i could cat all the files into a single large file.
Then obfuscate it using this obfuscation library.
So i make whatever code i want.
If i want to publish it, i run function tp.
To Public.
And that, does all the stuff that needs to be done for that code to become public in the correct manner.
Then run a function to rsync this new version of the system onto the rpi which contains the website.
And voila, whatever i was doing is now on the world stage.
Last edited by offtherock (2025-08-22 12:46:08)
Online
Like button can go here