CodePen Problem - Finance library blocking P5

Programming a stock charting program with CodePen has not been without errors.

My program (here), appears to be encountering an error with running both the Finance API ( and P5.

Particularly, only the finance API’s code is run when both P5 (added independently using the option) and the finance API are called within the program.

Comments have been marked within the code, which you can view using the ‘view in editor’ option.

Solving my problem would enable me to use JSON data from the finance API’s function call in my p5 sketch to generate the placement of the stock candle tickers. Now, the P5 sketch simply does not even appear.

Any and all help with this will be greatly appreciated.

Thank you,

  • Ryan

The reason why p5js doesn’t “appear” is b/c your sketch contains the keyword import.

Any JS file containing any of these 2 keywords import & export is considered an ES module:

In order for the p5js library to find & callback your functions setup() & draw() they have to be in the outer global context.

We can explicitly place anything in the outer global context by appending it in the property window or globalThis:

This is the model you need to follow in order to have callbacks setup() & draw() in the outer global context on your own ES module sketch:

1 Like

Thank you very much for your help! It was quite exciting to awake to such helpful advice on Christmas.

I have made the changes, as per your reply, and successfully run my program and generated both a P5 image/chart and finance data.

I apologize for any amateurism I may have unnecessarily exhibited as I do intend to be a more active member of this community in the future.

Thank you ‘GoToLoop’ and have a wonderful holiday season


I’ve re-run your code w/ window.yAxisAutoRange replaced w/ yAxisAutoRange and it’s totally fine. :wink:

Thanks, I tried that as well and it is working well now. I appreciate your help!

  • Ryan

Hello everyone,

Since my last problem was solved, I have made progress on the stock candlestick charting program.

Currently, I am encountering a problem when calculating the y-axis indicators. Specifically, it appears that the program is iterating a for loop without properly calling the values of variable ‘window.yAxisAutoRange’.

Careful observation shows however (as per the sketch and console) that a successful full iteration of the loop is completed and presumably returns the intended results.

Thanks to all in advance for any help with my problem discerning why I am receiving a NaN value.

  • Ryan

*The code is quite long, so I have linked the online editor page I am working on.

A Pen by rms2256 (

EDIT: I should note, I also experience an error whereby I am prompted a number of two times for what I programmed as a single prompt function. Any help with that matter would be greatly appreciated as well.

*Bump for urgency’s sake