I'm considering using three.js for my upcoming art project. My goal is to create graphics through code and then save them in high resolution, like 7000 x 7000 px or more, for printing purposes.
While I have experience with Flash and vvvv for similar projects, I'm curious to know if this is achievable with three.js and if there are any examples I can explore.
For a glimpse of my work, you can visit:
WebGL often comes with a size restriction. While some modern GPUs can handle limits as high as 8192x8192 (256meg) or even 16384x16384 (one gig), there may still be memory constraints in other areas of the browser, such as for taking a screenshot.
To work around this limitation, you can render portions of a larger image as separate pieces and then combine them using software like photoshop or the gIMP.
In the world of Three.js, you can approach this task like so. Let's say you start with one of the provided samples
function makeScreenshots() {
var desiredWidth = 7000;
var desiredHeight = 7000;
var stepX = 1000;
var stepY = 1000;
for (var y = 0; y < desiredHeight; y += stepY) {
for (var x = 0; x < desiredWidth; x += stepX) {
camera.setViewOffset( desiredWidth, desiredHeight, x, y, stepX, stepY );
renderer.render( scene, camera );
var screenshotDataURL = renderer.domElement.toDataURL();
saveScreenshot( "screenshot" + x + "-" + y + ".png", screenshotDataURL );
}
}
}
Keep in mind that you'll need to create the function saveScreenshot and likely run a small node.js or python server to save the screenshots. However, this technique allows you to generate images of almost any resolution you desire.
For more information, visit:
I have a specific request that I need to address. The first snippet of code shows a function called handleUpdate1 which uses async/await to run a function named _asyncFuncWillRun10Minutes, causing the client to wait approximately 10 minutes for a response ...
Utilizing Node.js, I am making requests to a report API that returns JSON responses. The API accepts different IDs as parameters, resulting in varying responses. For instance: https://report.domain.io/report/1 https://report.domain.io/report/2 Each r ...
I'm facing an issue with some code that I've written. Here's a snippet of what it looks like: myApp.module(args, function(args){ Views.MainView = Marionette.ItemView.extend({ //template, tagName, className down: false, events: ...
I am currently utilizing load-grunt-config along with grunt-contrib-copy. My objective is to have the copy task replace certain template tags using the 'process' option. I understand that replacing template tags is feasible based on the grunt-co ...
I have been working on a project involving LitElement components and I am looking to incorporate Leaflet into it. However, I am encountering difficulties with displaying the map properly. After installing Leaflet through npm in my project, I created a clas ...
I am currently working with ASP.Net. My goal is to retrieve the complete referrer URL when visitors arrive at my website from: https://www.google.co.il/webhp?sourceid=chrome-instant&rlz=1C1CHEU_iwIL457IL457&ion=1&espv=2&ie=UTF-8#q=%D7%90 ...
Currently, I am in the process of developing a progress circle bar that will function as a timer alongside sliders. Each slide is intended to have its own corresponding progress bar. While I have managed to create the bars individually, I am facing challe ...
In React Data Grid, there is a issue where selecting multiple filter options messes up the column headers. Is there a solution to display selected filter options above a line in a dropdown rather than adding them to the column header? The column header siz ...
While many questions focus on grouping nodes based on similarity, I am interested in grouping nodes simply based on their proximity. I have a vast collection of densely packed nodes, potentially numbering in the millions. These nodes take up space on-scre ...
I am currently developing an Angular application that utilizes reactive forms. I need to retrieve the values of dynamically created fields within a form group. Here is the code I have implemented: this.formSaisieSecondary = this.fb.group({ ...
I recently finished creating a basic MEAN.JS application. When using MEAN.JS, I can use the command grunt build to minify the js and css files located in specific folders: css: [ 'public/modules/**/css/*.css' ], js: [ 'public/config ...
Is there a method to secure JavaScript files from unauthorized access? <script src="JS/MyScript.js" type="text/javascript"> It is crucial that users are unable to access the MyScript.js file. I am seeking advice on how to achieve this. Is it even ...
Here is a script that I've created to make certain inputs dependent on the selection of a radio button. The 'parent' input in this case is determined by the radio button choice. Upon document load, the script initially hides parent divs of ...
Recently, in the latest version of next.js 13.4, the app router has been upgraded to stable. This update prompted me to transition my existing page router to utilize the app router. In _app.jsx file, it is expected to receive Component and pageProps as pr ...
An Issue Has Arisen: Exception in thread "main" java.lang.ExceptionInInitializerError at com.PoseidonTechnologies.caveworld.level.WoRe.<init>(WoRe.java:46) at com.PoseidonTechnologies.caveworld.CaveWorld.start(CaveWorld.java:80) at com.P ...
Need help with jQuery - adding a specific class to an element based on the presence of another class Hello everyone, I have searched through various forums and tried multiple code snippets in JavaScript and jQuery to no avail. Despite other scripts worki ...
I'm currently facing challenges while constructing a query using knex, specifically when it comes to incorporating the 'WHERE' clause with the condition EXISTS (SELECT * FROM caregiver_patient WHERE patient_id IN (0,1)). Below is the origin ...
I have been working on a phonegap 3.3 application that incorporates angularjs. When testing the application in my browser, I am successfully able to detect and respond to 'offline' and 'online' events. However, when I switch to the ios ...
For my current web project, I am utilizing a String username as the UID to connect to the channel in an Agora video call. However, I now need to incorporate individual cloud recording by Agora into the project. The challenge lies in the fact that cloud r ...
Here is the issue at hand - I am restricted to using older browsers (IE8 and FF8) by corporate policy. Despite my research indicating otherwise, it seems like this might be the root cause of my troubles. My current setup includes PHP 5.5.12 on Apache 2.4. ...