Fix typos in primitives article

threejs/lessons/threejs-primitives.md

@@ -10,9 +10,9 @@ are generally 3D shapes that are generated at runtime
 with a bunch of parameters.
 
 It's common to use primitives for things like a sphere
-for globe or a bunch of boxes to draw a 3D graph. It's
+for a globe or a bunch of boxes to draw a 3D graph. It's
 especially common to use primitives to experiment
-and get started with 3D. For the majority if 3D apps
+and get started with 3D. For the majority of 3D apps
 it's more common to have an artist make 3D models
 in a 3D modeling program. Later in this series we'll
 cover making and loading data from several 3D modeling
@@ -30,19 +30,19 @@ for <code>TextBufferGeometry</code> and <code>TextGeometry</code> respectively.<
 <div data-primitive="IcosahedronBufferGeometry">An icosahedron (20 sides)</div>
 <div data-primitive="LatheBufferGeometry">A shape generated by spinning a line. Examples would lamps, bowling pins, candles, candle holders, wine glasses, drinking glasses, etc... You provide the 2d silhouette as series of points and then tell three.js how many subdivisions to make as it spins the silhouette around an axis.</div>
 <div data-primitive="OctahedronBufferGeometry">An Octahedron (8 sides)</div>
-<div data-primitive="ParametricBufferGeometry">A surface generated by providing a function that takes a 2d point from a grid and returns the corresponding 3d point.</div>
+<div data-primitive="ParametricBufferGeometry">A surface generated by providing a function that takes a 2D point from a grid and returns the corresponding 3d point.</div>
 <div data-primitive="PlaneBufferGeometry">A 2D plane</div>
 <div data-primitive="PolyhedronBufferGeometry">Takes a set of triangles centered around a point and projects them onto a sphere</div>
 <div data-primitive="RingBufferGeometry">A 2D disc with a hole in the center</div>
-<div data-primitive="ShapeBufferGeometry">A 2d outline that gets triangulated</div>
+<div data-primitive="ShapeBufferGeometry">A 2D outline that gets triangulated</div>
 <div data-primitive="SphereBufferGeometry">A sphere</div>
-<div data-primitive="TetrahedronBufferGeometry">A terahedron (4 sides)</div>
-<div data-primitive="TextBufferGeometry">3D Text generated from a 3D font and a string</div>
+<div data-primitive="TetrahedronBufferGeometry">A tetrahedron (4 sides)</div>
+<div data-primitive="TextBufferGeometry">3D text generated from a 3D font and a string</div>
 <div data-primitive="TorusBufferGeometry">A torus (donut)</div>
 <div data-primitive="TorusKnotBufferGeometry">A torus knot</div>
 <div data-primitive="TubeBufferGeometry">A circle traced down a path</div>
-<div data-primitive="EdgesGeometry">A helper object that takes another geometry as input and generates edges only if the angle between faces is greater than some threshold. For example if you look at the box at the top it shows a line going through each face showing every triangle that makes the box. Using an EdgesGeometry instead the middle lines are removed.</div>
-<div data-primitive="WireframeGeometry">Generates geometry that contains one line segment (2 points) per edge in the given geometry. With out this you'd often be missing edges or get extra edges since WebGL generally requires 2 points per line segment. For example if all you had was a single triangle there would only be 3 points. If you tried to draw it using a material with <code>wireframe: true</code> you would only get a single line. Passing that triangle geometry to a <code>WireframeGeometry</code> will generate a new Geometry that has 3 lines segments using 6 points..</div>
+<div data-primitive="EdgesGeometry">A helper object that takes another geometry as input and generates edges only if the angle between faces is greater than some threshold. For example if you look at the box at the top it shows a line going through each face showing every triangle that makes the box. Using an <code>EdgesGeometry</code> instead the middle lines are removed.</div>
+<div data-primitive="WireframeGeometry">Generates geometry that contains one line segment (2 points) per edge in the given geometry. Without this you'd often be missing edges or get extra edges since WebGL generally requires 2 points per line segment. For example if all you had was a single triangle there would only be 3 points. If you tried to draw it using a material with <code>wireframe: true</code> you would only get a single line. Passing that triangle geometry to a <code>WireframeGeometry</code> will generate a new geometry that has 3 lines segments using 6 points..</div>
 
 You might notice of most of them come in pairs of `Geometry`
 or `BufferGeometry`. The difference between the 2 types is effectively flexibility
@@ -72,7 +72,7 @@ based primitives easier to deal with.
 As an simple example a `BufferGeometry`
 can not have new vertices easily added. The number of vertices used is
 decided at creation time, storage is created, and then data for vertices
-are filled in. Where as for `Geometry` you can add vertices as you go.
+are filled in. Whereas for `Geometry` you can add vertices as you go.
 
 We'll go over creating custom geometry in another article. For now
 let's make an example creating each type of primitive. We'll start
@@ -236,7 +236,7 @@ is on the left edge. To work around this we can ask three.js to compute the boun
 box of the geometry. We can then call the `getCenter` method
 of the bounding box and pass it our mesh's position object.
 `getCenter` copies the center of the box into the position.
-It also returns the position object so we can call `multiplyScaler(-1)`
+It also returns the position object so we can call `multiplyScalar(-1)`
 to position the entire object such that its center of rotation
 is at the center of the object.
 
@@ -249,15 +249,15 @@ works in another article](threejs-scenegraph.html).
 For now it's enough to know that
 like DOM nodes, children are drawn relative to their parent.
 By making an `Object3D` and making our mesh a child of that
-we can position the `Object3D` where ever we want and still
-keep the center offset we set earilier.
+we can position the `Object3D` wherever we want and still
+keep the center offset we set earlier.
 
 If we didn't do this the text would spin off center.
 
 {{{example url="../threejs-primitives-text.html" }}}
 
 Notice the one on the left is not spinning around its center
-where as the one on the right is.
+whereas the one on the right is.
 
 The other exceptions are the 2 line based examples for `EdgesGeometry`
 and `WireframeGeometry`. Instead of calling `addSolidGeometry` they call
@@ -311,7 +311,7 @@ If you're only drawing a few spheres, like say a single globe for
 a map of the earth, then a single 10000 triangle sphere is not a bad
 choice. If on the otherhand you're trying to draw 1000 spheres
 then 1000 spheres times 10000 triangles each is 10 million triangles.
-To animate smoothly you need the browser to draw at 60 frames a
+To animate smoothly you need the browser to draw at 60 frames per
 second so you'd be asking the browser to draw 600 million triangles
 per second. That's a lot of computing.