1.3: Graphing with Chart.js - Working With Data & APIs in JavaScript

[@critstixdarkspear5375]

I’m enthusiastic about learning to code already, but your infectious enthusiasm and pure joy personality makes me do chair dances every time you post. I love you because you bring the world joy in learning. Every teacher of any subject could learn a lot from you and 3blue1brown.

[@prschorn]

I work with JS for about 6 years, and still i'm watching this video. This is how this channel is able to entertain me, even when I'm watching tutorials about topics that I already know

[@stevewu9372]

😸😸😸

[@ranikheir5272]

Feel the same way!

[@rvssvedavyas921]

could u help me how can i visualize audio . select a part of the audio and play it using javascript?

[@ridz4912]

OMG !! WHERE WAS THIS GUY ALL THESE YEARS ??? SERIOUSLY ?? JUST WATCHING HIM ..HE JUST EXPLAINS IT IN SUCH A FUN WAY. TBH NEVER SEEN ANYONE EXPLAINING IN DEPTH MIXED WITH SUCH A CRAZY INTERACTIVE WAY !

[@yourfriendlyneighborhood5547]

Yeahh the same here bruh. I almost wasted a year and now finally found this guy. Wish I could've found this gem a year back.

[@asyncFlex]

i speak spanish but i'm learning english, im so happy to find this chanel, u teaching with a lot of passion, i never found it something like that. a lot of thanks

[@pahittatnamn]

I really love that your videos are longwinded enough to showcase lots of small "issues" one could encounter along the way of making something while still being consise enough to just get help "getting it done". I prefer this format much more compared to a fully prepared -these are the exact steps you should take video- and they never hit the same roadblocks you yourself get. Keep on making awesome content!

[@miquelmarti6537]

I'm a programmer with 20 yrs of experience in backend and database administration. I love your channel. You make coding look funny (and it is!)

[@3duFernandes]

This is the first video I watched from your channel. Excellent material, man! As a beginner, I like the way you code on the fly. I can see how a real developer solves errors and refactors the code, it's not like tons of other KZbin videos that just copy and paste the perfect code on the screen... You make it simple and real.

[@ShoSho-cq7ct]

I love your positivity and humorous style of teaching!!

[@pablovillaverde679]

I just finished working on a webpage that displays data on airline incidents reṕorted by the NSA from 1980 to 2014. The chart I created shows 56 airlines, their incident total, and fatal accidents during that period of time. I wouldn't have been able to do that without your amazing videos. Thanks a lot!!

[@Qjoel6398]

Hey man I gotta say. Watching you write code one way to get it done and then refactoring it afterwards brings a whole nother level to the learning here. great work - I'm hooked!

[@wesleyweisel134]

Why am I salivating the beginning of each video? Wait! The bell. Classical conditioning. I'm onto you, Daniel! Keep up the good work. I always love your videos and this is the first full class I am taking. Thanks.

[@katem9185]

I have a project coming up at work where I will be creating visualizations with Chart.js. This tutorial put me at ease and now I'm less stressed out about learning this new tool. Also, just wanted to say that your teaching style is so informative, easy to follow and engaging. It's helpful to watch you work through how you solve a coding problem and when you come across errors how you figure them out. Great tutorial! I'm looking forward to watching more of your videos.

[@morhaham6609]

At 9:38, a more elegant solution is to just call a "then" for the "getData" in order to chart the graph after the data is resolved, like this: getData() .then(() => { chartIt(); }) .catch((error) => console.log(error.message));

[@byedwardleung]

You're a blessing.

[@SigmaSixSoftware]

I’ve been working with JS for years and you just helped me find a bug in my code thanks

[@fooboobear]

This person is the coolest teacher I ever had.

[@patrickboehme4556]

OMG you are amazing! Thank you so much!!!! Your videos on "Working With Data & APIs in JavaScript" have been a god send.

Thanks for adding subtitles to the videos, the KZbin translator works better and better. : D greetings from Argentina

[@JuanOrtiz-qm9wy]

This tutorial is so amazing!, I can see how do you solve any problem and try it on my own. And the projects are so engaging that you want to do the full course in one day. Greetings from Mexico :).

[@austinedeclan10]

As a novice programmer, I find these videos really entertaining

[@nomju6411]

This video makes me feel excited about what I'm learning as well as depressed about what's happening to the Earth.

[@grainfrizz]

The world doesn't deserve people like Dan Shiffman. You're godsent.

[@rotrose7531]

it is hardly to think one can learn these valuable stuff for free. Thank you very much, you style of instant coding inspires and helps me a lot.

[@heimizhou2261]

This is best JS training video I've watched! thank you!

[@varshakapil8224]

We love you...love love love u....i love your energy...u can make boring things interesting... man this should be on Netflix!!! Love u dude...love the coding now cause of u

[@CodyPellom]

All aboard! I'm on the coding train for life I love this dude.

[@alissondamasceno2010]

So I open KZbin to search for Chart.js tutorials and your video pops up before searching for anything. Nice!

[@Annehbui]

I'm new to this coding industry and your videos really enlightened my interest in this field. Really enjoy your work!

[@armandsalle8447]

it's a very good idea to offer exercises ! It is important to learn and understand well

[@codeforest9027]

6 days ago?

[@iminni3459]

@@codeforest9027 Some people get early access I think.

[@pliniojr95]

Once again, thank you, teacher for this class! It was my first time using a JS library, and your way of teaching is catchy. I'm really looking forward to the next classes.

[@oeq57]

Dan, you are psychic I feel like every idea I have you have already made. Thanks for creating such amazing videos with lots of great information in them :D

[@Cornellie]

The contents you produce is amazing so glad I found this channel. Im almost done reading your book btw

[@ronicard]

Great video and a really nice little tip about making the function async and calling the getData with an await is a really elegant and clean little solution. Major props for a well put-together video!

[@hilkokriel5659]

Another brilliant video!! Thank you so much for all the effort you put into your content. I’ve been using Google’s Chart Services for similar projects, but now I know how to use another API!! Wooohooo. Much love from South Africa.

[@ugonnadi6732]

the way I love how this guy teaches cannot be explained

[@videovideoguy]

Your video is much better than mine. It is very nice and clear. Thank you

[@nileshgurung9437]

This is exactly what i needed. Thank you for these awesome tuts. Love from India🤗

[@mcyvideos68]

Very good video, very helpful. It look like Chart.js is a lot easier than D3. Just a little observation: the Celsius degree symbol is °C.

[@Annehbui]

I think D3 is more for designer to start everything from scratch - I would stick with charting libraries like this one chart.js or Plotly for graphing purposes.

[@Martin-jq8th]

he stated that in the chart description (datasets.label)

[@sodiqayilara1519]

I program daily, I watch this video to always remember to have fun,because goddamn coding is fun if you can just hang on enough to learn how it works.

[@RobertMenus]

Thank you very much, man! Your video really helped me and solved great coding problem. I was f*king for two days, trying to understand how to add data to this chart. And you example showed exactle what I wanted. You are awesome!!

[@vympel2732]

I love when you said that VS Code automatically corrects your errors when you save and you saved literally every line you wrote

[@djthedev]

You are such a gem!! Thank you so much for making these

[@juanpablogavilanes7036]

Very nice video, looking forward to review the full course

[@heksqer1022]

Loved this video. It explained Chart.js beautifully ! Also looking at the global average temperature rise was really scary.

[@deviloflove195]

This has been a really entertaining and educative video to watch. Thank you!! I also like how you would actually refactor your codes near the end to make everything even more clean.

[@BrenoLuna]

Awesome content! I'm definitely experimenting with the charting library on my projects. Please, in order to improve the viewers' productivity, kindly provide a tutorial video for preparing the concoction that yields such energetic demeanour towards coding. Cheers!

[@bradtking]

I am so thankful for you. Thank you for making this so much fun to learn.

[@lollilolli4582]

When I find a developer job , I will come back and thank you again !

[@Martin-jq8th]

6:30 made my night 🌙

[@nagualdesign]

The editing of these videos continues to improve. Am I right to assume that this is Matthaus' (sp?) handiwork? If so, he really ought to be credited in the video description. Whoever it is, they're doing a great job!

[@TheCodingTrain]

Yes, it's Mathieu Blanchette! I agree about the credit and will add!

[@nagualdesign]

@@TheCodingTrain Cheers, Dan.

[@paco3447]

As data is data, you won’t stop there. You could preprocess the input series and perform linear regressions, trends, averages, gaussian, time window predictions and forecasting, etc. vía custom functions and math helpers and plot with ChartJs. By the way, chartjs allows to use callbacks and hooks to perform advanced stuff.

[@mayaahmed]

Such fun. Best videos on the topic.

[@loic.bertrand]

That's such a cool and clear video, bravo!

[@phanta5m]

A lot of lesson learned from this video, thanks.

[@Banjer]

Great!!! I can't wait for the next module!!

[@rotrose7531]

Your tutorials unfailingly fascinate me, Thank you MILLIONS! I have a small request if possible, regarding this temperature toturial, could you make one more to cover some user interaction, for example, two input field to accept user input, which were then returned in form of year, then we only graph the temperature of that period specified by user? To be honest, based on the learning from you, I made a similar one, but I failed to extend it to feature some user interaction. I believe many other people want to see it too.

[@yogeshwarbirangal]

Thank you from 2020 It helped in building my district corona virus tracker.

[@herberdth]

This is SO good material! Thanks!

[@blackswann9555]

wow, I love you. so many questions answered for me!!!! Subscribed!

[@letung9255]

the beauty of teaching as the brain want to study.

[@chriscalso4699]

I thought I was watching a kids learning channel like blues clues for a second :) It's a good chart.js tutorial.

[@mohannedalademi5229]

man the way he explains stuff makes me wanna watch more, wish you were by elder brother

[@cheshtagupta7491]

Great great explanation😍😍😍

[@toastyPredicament]

I feel sick I will do a nap for today's courses

[@luciferkhusrao]

Professor is teaching codes! Bella Ciao!!

[@YolkBytes]

Very cool and very educational. Thank you.

[@graphiics]

I love your tutorial.. you are really fun!

[@sebastienserra1064]

Thank you so much! Really helpful!

[@syedalishan4986]

Hey my JS Teacher, Really Awesome Content.

[@NetMistro]

Such a great video 👍 thank you

[@mohdotnet]

Very very well described video Thank you so much

[@JoshuaKisb]

i already knew this stuff but the video was still fun to watch. makes me feel like making my own tutorials for coding. :)

[@ssimona7317]

The background is so cute !⭐

[@TheDima23]

Amazing video! thank you so much for this !

[@ichbindiego19]

Muchas gracias, justo tenía un problema con esa librería y lo resolviste. Thank you.

[@saxenavedant61]

love your tutorial videos ❤

[@raphaelvsantos]

What a nice way to learn JS AND be conscious about the climate change! Awesome!

[@moussaibrahem9]

You Are Awesome man i loved how you teach and thinking

[@arcane-requiem]

Learning should be like this! Damn nice

[@brucedordway]

Nice series, thanks. Just one thing I've run into that I haven't figured out yet. From VSCode I can send my page to Live server and the chart displays one set of data columns from 1880 to 2019. However, when I activate the console in the browser, the data columns are auto duplicated - e.g. 1880 thru 2019, then 1880 thru 2019 repeated. I am assuming that activating the console is somehow triggering CSV data being appended to my existing data object - instead of clearing it first.

[@thaanu]

Great tutorial. I was using ChartJS on a project. Is there a way generate dynamic charts with realtime data? Like a dashboard.

[@neddev2990]

Awesome stuff, thanks!

[@stefank.4345]

Very good video, very helpful, Thanks

[@zeinhm7250]

lol i love how you explain and the live coding is cool ! auto subscribe !

[@chuckf5540]

Awesome. Great tutorial! I'm using node-js and wonder what the difference is in creating that page using template node? I plan to use a financial model candlestick to plot temperature by time (hour, day, week, month) by Open temp, Low temp, High temp and close temp.

[@ndiayemouhamadou4920]

you are amazing you helped me a lot

[@Pedritox0953]

Excellent video series

[@khanparwez2009]

This is a great video, really helped me pick the concept fast. I was wondering if you can prepare some video where you can show timeseries data being aggregated from csv and display graph for a time period like , show graph for last 30 minutes or previous day something like that ?

[@aldogarciavaldez998]

Grandes contenidos saludos de México

[@narshah4806]

I owe you so much man

[@timotuomas9091]

Super man !! thank you !!

[@AksCodeCafe]

i love it super help full content

[@eng.khartoum47]

Hi, Thanks for this tutorial. I have a question about the background color. If I want to inject the data with it the random background color. Like if there's a new content give it a specific color. Can you show how to do that?

[@angeliqueesguerra6650]

Do you have any videos where the data needed for the chart.js is in a baseUrl?

[@rayaneaitaliyahia3688]

Hello ,nice videos . I'm working with dynamic data ,do you think that fetch data from a database is better ?

[@yanhualiu2191]

Can it do two data series samples on two different time intervals? Really Appreciate your comments

[@ABrushWithNature]

Really loving your tutorial here. So much appreciated! You talked about trimming blank lines at the end of the csv file. Can you share the code for that?

[@parsa3611]

That was useful. Thanks

[@City__Walker]

in 2022 year Chart.Js change self code, not removing "options" and write in field "beginAtZero: false" for correct drawing "options: scales: { y: { beginAtZero: false } } }"

[@fastlearner9993]

JUST THE COMMENT I NEEDED !!! THE LAST PIECE TO MY PUZZLE .... THANK YOU !!!!!!

[@jakubkurdziel2407]

Best teacher

[@chrisdietrich1533]

great video!