processing.js

How to restore the transformations after a resize

由 时光总嘲笑我的痴心妄想 提交于 2019-12-12 04:03:11
问题 I am working with Processing.js (version 1.4.8). I have 5 white points, which coordinates I chose specifically. The black dot marks the center of the sketch! I want to be able to translate and scale my sketch. ALSO, I want it to occupy the whole window. var mapWidth, mapHeight, canvas, pjs, centerX, centerY; var points = [[100, 100], [300, 100], [100, 300], [300, 300], [200, 200]]; var setSize = function() { mapWidth = $(window).outerWidth(); mapHeight = $(window).outerHeight(); if (pjs) {

How to precompile processingjs sketch to speed load times?

由 ⅰ亾dé卋堺 提交于 2019-12-12 03:03:00
问题 The loading times of my processingjs webpage are getting pretty hairy. How can I precache the compilation of processing to javascript? It would be acceptable for my application to compile on first entering the webpage (maybe keeping the result in the local store?) and then reuse the compilation on subsequent loads. 回答1: There's two ways to drive down load time as experienced by the user. The first is using precompiled sketches, which is relatively easy: github repo, or even just download the

Passing image from Processing to Javascript and then saving said image back to server using AJAX / PHP?

由 早过忘川 提交于 2019-12-12 01:29:52
问题 I'm working on a project where I want to load a processing sketch into a canvas, have some things happen to the image when a user mouses over (got that part), and then when they leave the canvas save the image back to the server. I've looked at these other questions, and can't quite figure this out: HTML5 CANVAS: How to save and reopen image from server That's not really working for me. Uploading 'canvas' image data to the server I don't exactly understand where to put everything in this.

Processing: How to convert a char datatype into its utf-8 int representation?

由 爱⌒轻易说出口 提交于 2019-12-11 13:44:06
问题 How can I convert a char datatype into its utf-8 int representation in Processing? So if I had an array ['a', 'b', 'c'] I'd like to obtain another array [61, 62, 63]. 回答1: After my answer I figured out a much easier and more direct way of converting to the types of numbers you wanted. What you want for 'a' is 61 instead of 97 and so forth. That is not very hard seeing that 61 is the hexadecimal representation of the decimal 97. So all you need to do is feed your char into a specific method

How to call Processing.js function from HTML?

由 五迷三道 提交于 2019-12-11 09:47:45
问题 I'm exploring HTML5 and Processing.js. When the user clicks on an image on my webpage, I'd like to call a function in the Processing.js code. Just calling the function in onclick , as illustrated in this simple example, isn't working: <html> <head> <script language="javascript" src="processing.init.js"></script> <script language="javascript" src="processing.js"></script> </head> <body> <script type="application/processing"> void restart() { /* does something */ } </script><canvas> You'll need

How to recenter after a zoom

由 别来无恙 提交于 2019-12-11 06:11:22
问题 I am working with Processing.js (version 1.4.8). I have 5 white points, which coordinates I chose specifically. The black dot marks the center of the sketch! The red cross is an element outside the canvas that marks the center of the window, so that we can compare with the black dot and ensure that the map is being correctly centered. I want my sketch to occupy the whole window. I want to be able to translate and scale my sketch. I use the Processing.js draw function. And I am keeping track

How can i use chrome webcam API and the processing.js to manipulate the video?

由 一笑奈何 提交于 2019-12-08 11:48:14
问题 As topic, I want to play with the webcam and chrome webcam API comes in handy, no plugin is needed. However, I am not familiar with javascript syntax, so I still want to use processing.js to manipulate the video. So how should the code be like? GetUserMedia in the canvas,then? How can i tell the processing.js that there is a video in the canvas? import processing.video should not work because it is processing.js instead of processing. 回答1: According to this: https://github.com/austinhappel

Integrate Processing with Minim Libraries in Website

由 岁酱吖の 提交于 2019-12-08 02:45:52
问题 I have seen similar questions posted before but seems the general answer is that it cannot be done. So, here is my HTML code : <head> … <script type="text/javascript" src="js/processing.js"></script> … </head> <body> … <canvas id="my_prog" data-processing-sources="project/my_prog.pde project/my_class.pde"/></canvas> … </body> And in my sketch I use Minim libraries : import ddf.minim.*; import ddf.minim.spi.*; import ddf.minim.ugens.*; Instead of having my project on my website, there is a

Integrate Processing with Minim Libraries in Website

由 爱⌒轻易说出口 提交于 2019-12-06 04:13:05
I have seen similar questions posted before but seems the general answer is that it cannot be done. So, here is my HTML code : <head> … <script type="text/javascript" src="js/processing.js"></script> … </head> <body> … <canvas id="my_prog" data-processing-sources="project/my_prog.pde project/my_class.pde"/></canvas> … </body> And in my sketch I use Minim libraries : import ddf.minim.*; import ddf.minim.spi.*; import ddf.minim.ugens.*; Instead of having my project on my website, there is a rectangular shape proportional to the project size, but without image and sound. Moreover, this method

load processing.js sketch with ajax on user click

由 社会主义新天地 提交于 2019-12-05 03:57:22
问题 I'm trying to load a processing.js sketch with ajax on click and it's not working. It works if I load the sketch instantly, but not on a user interaction. Here's my code: $('#clicker').click(function(){ var canvasRef = $('<canvas/>'); canvasRef.attr('data-src','/uploads/processing_js/anything_1.pde'); $('#loader').append(canvasRef); }); I've also tried 'data-processing-sources' and 'datasrc' for the attribute. Anyone know why this doesn't work? 回答1: We only check the data-processing-sources
订阅 processing.js