Adding dashed lines

[lorenzo-lipparini]

Nature of issue?

• New feature request

Most appropriate sub-area of p5.js?

• Core/Environment/Rendering

New feature details:

This issue is about adding a new lineDash() function to p5.

There are a few things that might be worth discussing about the API:

• The lineDash() function might take an array as its only argument (as in the native CanvasRenderingContext2D.setLineDash() function), or it might use rest parameters instead
• The lineDash() function might be chainable, or it might return the current line dash settings (as other functions in p5 like frameRate()); in the second case, it would make sense to call it with no arguments just to get the settings
• A noLineDash() function used to go back to solid lines (equivalent to calling lineDash([])) might be a good addition, since it would probably make the API more clear
• Since there is no native support for dashed lines in WEBGL, a 3D implementation would not be as straightforward as in the 2D case

#3014
@limzykenneth

[limzykenneth]

To make it more inline with the rest of the API, ideally, lineDash() can be taking multiple arguments in addition to one array as argument. In the code base you can just construct an array to be passed to CanvasRenderingContext2D.setLineDash() like so: var arg = new Array(arguments).

Will there be a use case for returning the current line dash setting seeing as it's not part of the canvas API nor something that can be altered by something not explicitly defined?

noLineDash() sounds good and maybe this can be reset in push/pop() as well.

WEBGL I have no clue about, I'll let others chime in.

Overall, I think it's an OK addition but whether we want to include this in the core library or not we should see if anyone else have an opinion about this. Thanks!

[lorenzo-lipparini]

Overloading the function so that it takes either a single array or several numbers as its arguments sounds good to me; I also understand that returning the current value wouldn't be super useful, and making the function chainable might be preferable.

About push() and pop(), they would automatically save the line dash (at least in the 2D context), since they are implemented with CanvasRenderingContext2D.save() which by itself takes care of that (see the code);
The thing is that the line dash would't be included in the 'properties' object returned by p5.Renderer.push(), but I don't understand the purpose of that object anyway since everything seemed to work fine in #3014, hopefully someone with a deeper knowledge of the framework will make that clear.

[lmccart]

I think this function is beyond the scope of the p5.js api for now as we try to focus on webgl and mobile updates. I apologize that this is confusing, we are in the process of implementing a public roadmap and milestones to make this more clear. We will soon be calling for input for new features for the 1.0 release. We can revisit this idea then. For now, it could be a great starting point for an addon library. see the docs here for how to create an addon: https://github.com/processing/p5.js/wiki/Libraries#creating-a-new-library