Is there a way to make a graphics element global, in p5js? Right now I want to make the ellipse be global:
var bug = ellipse(0, random(height), 20, 20);
function setup() {
createCanvas(500, 500);
background(100);
}
function draw() {
}
I want to store the ellipse in a variable. But there's an error saying that "mySketch.js, line 1:Uncaught ReferenceError: ellipse is not defined". Can someone help? Thanks.
The ellipse() function draws an ellipse, but it doesn't return anything, so you can't store the result of calling it in a variable.
I'm not totally sure what you're trying to do, but you have a couple options worth exploring:
You could store all of the values for your ellipse in variables like ellipseX, ellipseY, and ellipseSize.
You could create a class that stores the values you want. Shameless self-promotion: here is a tutorial on creating classes in p5.js.
You could draw the ellipse to a p5.Graphics and then store that p5.Graphics in a global variable. You can find more info about this in the reference.
Related
First time working with PDFSharp, I have a win form that enables the user to select a font and size of it for the PDF to be created. Also the app draws some rectangles on the page with currently hardcoded color like this:
rect = new XRect(5, 300, 25, 15);
gfx.DrawRectangle(XBrushes.SeaShell, rect); //SET COLOR TO RECT
tf.Alignment = XParagraphAlignment.Center;
tf.DrawString("No", invoiceItemsHeaderFont, XBrushes.Black, rect,
XStringFormats.TopLeft);
I want the user to be able to pick the color via a drop down. How can I load all of the colors from XBrushes. to a list and then parse it as such, this is one of the attempts:
foreach(XBrushes xbrush in typeof(XBrushes)
{
colorsRect.Add(xbrush.ToString());
}
Thank you all!
I know this is a bit late but maybe this could help someone else.
I take it you are just looking to get a collection of the different brushes?
I looked at the XBrushes class and all its public static properties seem to be brushes. You could use reflection to go through all its properties and get the values of the ones that are brushes.
Something like:
public static IEnumerable<XSolidBrush> Brushes
{
get
{
return typeof(XBrushes).GetProperties(System.Reflection.BindingFlags.Public | System.Reflection.BindingFlags.Static)
.Select(p => p.GetValue(null))
.Where(b=>b.GetType()==typeof(XSolidBrush))
.Cast<XSolidBrush>();
}
}
I'm newbie in using ogre3D and I need help on a certain point!
I'm trying a library mixing ogre3D engine and qtml :
http://advancingusability.wordpress.com/2013/08/14/qmlogre-is-now-a-library/
this library works fine when you want to draw some object and rotate or translate these objects already initialise in a first step.
void initialize(){
// we only want to initialize once
disconnect(this, &ExampleApp::beforeRendering, this, &ExampleApp::initializeOgre);
// start up Ogre
m_ogreEngine = new OgreEngine(this);
m_root = m_ogreEngine->startEngine();
m_ogreEngine->setupResources();
m_ogreEngine->activateOgreContext();
//draw a small cube
new DebugDrawer(m_sceneManager, 0.5f);
DrawCube(100,100,100);
DebugDrawer::getSingleton().build();
m_ogreEngine->doneOgreContext();
emit(ogreInitialized());
}
but If you want to draw or change the scene after this initialisation step it is problematic!
In fact in Ogre3D only (without the qtogre library), you have to use a frameListener
which will connect the rendering thread and allow a repaint of your scene.
But here, we have two ContextOpengl: one for qt and the other one for Ogre.
So If you try to put the common part of code :
createScene();
createFrameListener();
// La Boucle de rendu
m_root->startRendering();
//createScene();
while(true)
{
Ogre::WindowEventUtilities::messagePump();
if(pRenderWindow->isClosed())
std::cout<<"pRenderWindow close"<<std::endl;
if(!m_root->renderOneFrame())
std::cout<<"root renderOneFrame"<<std::endl;
}
the app will freeze! I know that startRendering is a render loop itself, so the loop below never gets executed.
But I don't know where to put those line or how to correct this part!
I've also try to add a background buffer and to swap them :
void OgreEngine::updateOgreContext()
{
glPopAttrib();
glPopClientAttrib();
m_qtContext->functions()->glUseProgram(0);
m_qtContext->doneCurrent();
delete m_qtContext;
m_BackgroundContext= QOpenGLContext::currentContext();
// create a new shared OpenGL context to be used exclusively by Ogre
m_BackgroundContext = new QOpenGLContext();
m_BackgroundContext->setFormat(m_quickWindow->requestedFormat());
m_BackgroundContext->setShareContext(m_qtContext);
m_BackgroundContext->create();
m_BackgroundContext->swapBuffers(m_quickWindow);
//m_ogreContext->makeCurrent(m_quickWindow);
}
but i've also the same error:
OGRE EXCEPTION(7:InternalErrorException): Cannot create GL vertex buffer in GLHardwareVertexBuffer::GLHardwareVertexBuffer at Bureau/bibliotheques/ogre_src_v1-8-1/RenderSystems/GL/src/OgreGLHardwareVertexBuffer.cpp (line 46)
I'm very stuck!
I don't know what to do?
Thanks!
How to change plain line to arrow line in infovis?
Currently there are some lines between blocks, I found some css files, but I cannot find which content describing the line behaviour such that I can change the plain line to arrow line.
Thanks.
Generally spoken: You can't (and shouldn't) change it via CSS. Define such properties during the setup.
Here's a brief explanation:
The Code that generates and Edge (which is a line in network visualizations) is generated by the Edge method/function which sits inside Options.Edge.js.
The function Edge is a property/module of the $jit object and works like this:
var viz = new $jit.Viz({
Edge: {
overridable: true,
type: 'line',
color: '#fff',
CanvasStyles: {
: '#ccc',
shadowBlur: 10
}
}
} );
It's important that you define overridable as true as you else can't override anything. The parameter that you're searching for is type. The allowed values are line, hyperline, arrow and I'm pretty sure that bezier will work as well - not sure if this is true for every type of graph. You can as well define custom graph Edge types - an example is missing in the documentation.
To change the Line/Edge style, there's another function that triggers before rendering. You just have to define it during the graph registration $jit.Viz( { /* add here */ } ); - code from the example/Spacetree here:
// This method is called right before plotting
// an edge. It's useful for changing an individual edge
// style properties before plotting it.
// Edge data proprties prefixed with a dollar sign will
// override the Edge global style properties.
onBeforePlotLine: function(adj){
if (adj.nodeFrom.selected && adj.nodeTo.selected) {
adj.data.$color = "#eed";
adj.data.$lineWidth = 3;
}
else {
delete adj.data.$color;
delete adj.data.$lineWidth;
}
}
The final step would now be to inspect what add.data can deliver and then either add the style you want or define a new one using a closure.
There might be another way to go on this: Example for a ForceDirected graph. Take a look at the documentation here.
$jit.ForceDirected.Plot.plotLine( adj, canvas, animating );
Maybe you could even use something like this:
var edge = viz.getEdge('Edge_ID');
edge.setData( property, value, type );
Disclaimer: I got no working copy of theJit/InfoViz library around, so I can't help more than that unless you add a JSFiddle example with your code.
Edit
As I just read that you only want to change to the default arrow type, just enter this type during the configuration of the graph.
Hey guys, I'm trying to make a 2D Platform style game similar to this game below:
http://www.gameshed.com/Puzzle-Games/Blockdude/play.html
I have finished making most of the graphic, and areas, and collision, but our character is still not able to carry things. I'm confused as to what code to use so that my character can carry the blocks. I need help as to how to make our character carry blocks that are in front of him, provided that the blocks that don't have anything on top of it. This has been confusing me for a week now, and any help would be highly appreciated. :D
I fondly remember my first AS2 game. The best approach is probably an object oriented approach, as I will explain.
In AS2, there is a hittest method automatically built into objects. There is a good tutorial on Kirupa here:
http://www.kirupa.com/developer/actionscript/hittest.htm
also
http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00001314.html
First you'll want to generate your boxes using a Box class. Your class would need to look something like the following:
//Box.as pseudo-code
class Box {
var x_pos:Number;
var y_pos:Number;
var attachedToPlayer:Boolean;
function Box(_x:Number, _y:Number) {
this.x_pos = _x;
this.y_pos = _y;
}
//other code here
}
See this tutorial on how to attach a class to an object in the library:
http://www.articlesbase.com/videos/5min/86620312
To create a new Box, you'd then use something like
box1 = new Box(100,200);
// creates a box at position 100x,200y
However, you'll also want to store the blocks you want to pickup into some sort of array so you can loop through them. See http://www.tech-recipes.com/rx/1383/flash-actionscript-create-an-array-of-objects-from-a-unique-class/
Example:
//somewhere near the top of your main method, or whereever your main game loop is running from - note Box.as would need to be in the same folder
import Box;
//...then, somewhere before your game loop
//create an array to hold the objects
var boxArray:Array = new Array();
//create loop with i as the counter
for (var i=0; i<4; i++)
{
var _x:Number = 100 + i;
var _y:Number = 100 + i;
//create Box object
var box:Box = new Box();
//assign text to the first variable.
//push the object into the array
boxArray.push(box);
}
Similarly, you would need a class for your player, and to create a new Player object at the start of your game, e.g.
var player = new Player(0,0);
You could then run a hittest method for your player against the blocks in your array for the main game loop (i.e. the loop that updates your player's position and other game properties). There are probably more efficient ways of doing this, e.g. only looping for the blocks that are currently on the screen.
Once your array has been created, use a foreach loop to run a hittest against your player in your game's main loop, e.g.
//assuming you have an array called 'boxArray' and player object called 'player'
for(var box in boxArray){
if (player.hittest(box)) {
player.attachObjectMethod(box);
}
}
This is basically pseudo-code for "for every box that we have entered into the array, check if the player is touching the box. If the box is touching, use the box as the argument for a method in the player class (which I have arbitrarily called attachObjectMethod)".
In attachObjectMethod, you could then define some sort of behavior for attaching the box to the player. For example, you could create a get and set method(s) for the x and y position of your boxes inside the box class, along with a boolean called something useful like attachedToPlayer. When attachObjectMethod was called, it would set the box's boolean, e.g. in the Player class
//include Box.as at the top of the file
import Box;
//other methods, e.g. constructor
//somewhere is the Player.as class/file
public function attachObjectMethod (box:Box) {
box.setattachedToPlayer(true);
//you could also update fields on the player, but for now this is all we need
}
Now the attachedToPlayer boolean of the box the player has collided with would be true. Back in our game loop, we would then modify our loop to update the position of the boxes:
//assuming you have an array called 'boxArray' and player object called 'player'
for(var box in boxArray){
if (player.hittest(box)) {
player.attachObjectMethod(box);
}
box.updatePosition(player.get_Xpos, player.get_Ypos);
}
In our Box class, we now need to define 'updatePosition':
//Box.as pseudo-code
class Box {
var x_pos:Number;
var y_pos:Number;
var attachedToPlayer:Boolean;
function Box(box_x:Number, box_y:Number) {
this.x_pos = box_x;
this.y_pos = box_y;
}
public function updatePosition(_x:Number, _y:Number) {
if (this.attachedToPlayer) {
this.x_pos = _x;
this.y_pos = _y;
}
}
//other code here
}
As you can see we can pass the player's position, and update the box's position if the attachedToPlayer boolean has been set. Finally, we add a move method to the box:
public function move() {
if (this.attachedToPlayer) {
this._x = x_pos;
this._y = y_pos;
}
}
Examples of updating position:
http://www.swinburne.edu.au/design/tutorials/P-flash/T-How-to-smoothly-slide-objects-around-in-Flash/ID-17/
Finally, to make it all work we need to call the move method in the game loop:
//assuming you have an array called 'boxArray' and player object called 'player'
for(var box in boxArray){
if (player.hittest(box)) {
player.attachObjectMethod(box);
}
box.updatePosition(player.get_Xpos, player.get_Ypos);
box.move();
}
You have also specified that the blocks should only move with the player if they have nothing on top of them. When you call your attachedToPlayer method, you would also need to run a foreach loop inside the method between the box and the objects that might sit on top of the box. You should now have a fair idea from the above code how to do this.
I appreciate that this is quite a lengthy answer, and I haven't had an opportunity to test all the code (in fact I'm fairly positive I made a mistake somewhere) - don't hesitate to ask questions. My other advice is to understand the concepts thoroughly, and then write your own code one bit at a time.
Good luck!
The way I would do this is to design an individual hit test for each block he will be picking up, then code for the hit test to play a frame within the sprite's timeline of him carrying a block, and to play a frame within the block to be picked up's timeline of the block no longer at rest (disappeared?).
Good Luck if you're confused about what I've said just ask a little more about it and I'll try to help you if I can.
What is the equivalent to removeMovieClip() in AS3?
Apparently many have the same question:
StackOverflow:
How to completely remove a movieclip in as3
Remove movie clip as3
How to remove childmovieclip and add to new parent movieclip
Others:
removeMovieClip(this) in AS3?
Destroy/Delete a Movieclip???
Remove movie clip
But none of their solutions seem to work, for me:
Im working on flash CS4 with AS3:
I have a very simple movie with a single button called click. On pressing the button, a new instance of coin is created:
this.click.addEventListener(MouseEvent.CLICK,justclick);
function justclick(e:MouseEvent){
var money=new coin
this.addChild(money)
money.x=e.stageX
money.y=e.stageY
}
It might not be the best code, but it works fine. Now, the coin MovieClip is supposed to show a small animation and remove itself. In good old AS2 I would have added:
this.removeMovieClip()
in the last frame of the animation. But this doesn't exist in AS3.
I have tried, without success:
this.parent.removeChild(this) // 'Cannot access a property or method of nullobject reference'...
this.removeMovieClip() // 'removeMovieClip is not a function'
removeMovieClip(this) //'call to possibly undefined method removeMovieClip'
unloadMovie(this)//'call to possibly undefined method removeMovieClip'
Solutions?
Thanks,
this.parent.removeChild(this);
This one should be working; it's what I use. One problem I had when I switched to AS3 is that sometimes it wouldn't be added as a child right, so you might want to check that. You also have to import flash.display via putting this at the top if you're not already:
import flash.display.*
You should also remove the event listener on it before removing it.
If your animation is ending on frame 20.
note: using 19 because flash count frames from zero(0) similar to array index.
class animatedCloud
{
public function animatedCloud(){
addFrameScript(19, frame20);
}
private function frame20(){
parent.removeChild(this);
}
}
Always ensure that those self removing movieclips can get garbage collected.
This solution wiped away all my instances from a loaded swf's library symbol:
var mc:MovieClip = new definition() as MovieClip;
addChild(mc);
mc.x = 1000 * Math.random();
mc.y = 1000 * Math.random();
mc.addFrameScript(mc.totalFrames - 1, function onLastFrame():void
{
mc.stop();
mc.parent.removeChild(mc);
mc = null;
});
public static function removeDisplayObject(displayObject:DisplayObject):void {
/* normal code
if(displayObject && displayObject.parent){
displayObject.parent.removeChild(displayObject);
}
*/
displayObject ? displayObject.parent ? displayObject.parent.removeChild(displayObject) : null : null;
}
I use, in an extra blank keyframe at the end of the MovieClip which should remove itself:
stop();
MovieClip(parent).removeChild(this);
Found it to be the proper and best solution.