SVG Introduction Video Lecture Transcript
This transcript was automatically generated by Zoom, so there may be discrepancies between the video and the text.

16:35:05 Hi, everybody! Welcome back. We're continuing to learn about web browser-based visualizations by introducing Svg.
16:35:16 So Svg. Stands for scalable vector graphics.
16:35:19 They're called that because they are an image format in which things are drawn in a way that scales nicely.
16:35:28 So helping with the resolution issues. So, for instance, if you were to take a Jpeg and then scale it upwards, it might become very blurry, whereas scalable vector graphics are set up so that when you increase them, the resolution stays nice and allows for a sharper image these are going
16:35:46 to allow us to paint images directly onto our HTML.
16:35:49 Files. And we're going to use them extensively in our D 3 Jas.
16:35:55 Content scalable vector graphic elements are contained within an Svg elements. And we're gonna see an example of this.
16:36:04 And right now, so let's go ahead and open this up.
16:36:08 And HTML.
16:36:13 So this is an example where we're going to have an Svg.
16:36:15 So we have our document, our div, and then within that div, we have our Svg.
16:36:23 So this Svg. Is set to have a light gray background, 600 pixels wide by 400 pixels high.
16:36:30 So it's going to just be a light gray rectangle, and on that rectangle I've added a circle.
16:36:36 And so this might look weird. But don't worry. We're going to cover circles explicitly, and either the next one or 2 notebooks.
16:36:43 I don't remember where it precisely so once we go ahead and see what this looks like in our web browser.
16:36:50 So this gray rectangle with the red circle on it.
16:36:53 This is an Svg. And this circle is an Svg.
16:36:56 Element. So you can see how we are going to utilize this to make data visualizations.
16:37:02 For example, an Svg. With a series of circles on it would be a scatter plot.
16:37:07 So d 3 dot J is going to allow us to take these Svg elements and bind data to them in a way that allows us to make data visualizations.
16:37:17 So now you've been introduced into what Svg is hopefully you're motivated to learn more about it.
16:37:25 I hope you enjoyed this video, and I can't wait to see you next time.