Share
Im vorherigen Tutorial der Serie haben Sie die Module World und Engine in Matter.js kennen gelernt. Die in diesen beiden Modulen verfügbaren Methoden sollen das Verhalten mehrerer Körper oder der ganzen Welt gleichzeitig steuern. An einem bestimmten Punkt wird es jedoch notwendig sein, die Eigenschaften der einzelnen Körper in Ihrer Welt unter Kontrolle zu haben.
Beispielsweise möchten Sie möglicherweise eine bestimmte Kraft auf ein bestimmtes Objekt anwenden oder seinen Reibungskoeffizienten ändern. In solchen Fällen kann das Body-Modul in Matter.js eine große Hilfe sein. Dieses Modul enthält viele Methoden und Eigenschaften, mit denen Sie Werte für alle Arten von physischen Attributen angeben können, von der Masse bis zum Restitutionskoeffizienten. In diesem Lernprogramm erfahren Sie mehr über alle diese Methoden und Eigenschaften und deren korrekte Verwendung.
Sie können jeden starren Körper in der Welt von Matter.js drehen, indem Sie die drehen (Körper, Drehung) Methode. Die Drehung ist relativ zum aktuellen Winkel des Körpers und gibt ihm keine Winkelgeschwindigkeit. Der Drehwinkel wird in Bogenmaß angegeben.
Sie können einen Körper auch mit der Taste skalieren Maßstab (Körper, MaßstabX, MaßstabY, [Punkt]) Methode. Die Parameter scaleX und scaleY Geben Sie den Skalierungsgrad in horizontaler und vertikaler Richtung an. Denken Sie daran, dass eine solche Skalierung auch die physikalischen Eigenschaften des Körpers wie Masse, Fläche und Trägheit aktualisiert. Der vierte Parameter gibt den Punkt an, um den herum die Skalierung erfolgt. Wenn nicht angegeben, wird angenommen, dass der Standardwert des Skalierungspunkts der Mittelpunkt des Körpers ist.
Mit dem können Sie einen Körper relativ zu seiner aktuellen Position um einen bestimmten Vektor bewegen übersetzen (Körper, Übersetzung) Methode. Der Übersetzungsparameter gibt die neue Position des Objekts relativ zu seiner aktuellen Position an. Hier ist der Teil des Codes aus der Demo, der die Box skaliert, dreht und bewegt.
Accentsconagua
var Körper = Materie. Körper; var box = Bodies.rectangle (460, 120, 40, 40); $ ('. scale'). on ('click', function () Body.scale (Box, 1.5, 1.2);); $ ('. drehen'). ein ('Klick', function () Body.rotate (Box, Math.PI / 6);); $ ('. translate'). on ('click', function () Body.translate (Kästchen, x: -10, y: 20););Sie können einem Objekt auch eine lineare Geschwindigkeit zuweisen, indem Sie die setVelocity (Körper, Geschwindigkeit) Methode. Durch die Anwendung einer Geschwindigkeit auf diese Weise werden der Winkel, die aufgebrachte Kraft oder die Position des betroffenen Objekts nicht geändert. Die Position des Objekts oder sein Winkel wird sich wahrscheinlich ändern, aber die Bibliothek legt sie nicht speziell auf einen Wert fest. Ihre Werte werden von anderen auf das Objekt einwirkenden Kräften wie Reibung bestimmt.
Genau wie bei der linearen Geschwindigkeit können Sie auch die Winkelgeschwindigkeit eines Objekts mithilfe von ändern setAngularVelocity (Körper, Geschwindigkeit) Methode. Auch in diesem Fall bleiben Position, Winkel und Kraft des Objekts unverändert.
Eine Sache, die Sie beachten sollten, ist, dass die Geschwindigkeit ein Vektor in ist setVelocity () und eine Zahl in setAngularVelocity ().
$ ('. linear'). on ('click', function () Body.setVelocity (Feld, x: 10, y: -10);); $ ('. angle'). on ('click', function () Body.setAngularVelocity (Box, Math.PI / 6););Sie können Objekten nicht nur Geschwindigkeiten verleihen, sondern auch einen Kraftvektor anwenden. Das applyForce (Körper, Position, Kraft) Methode kann verwendet werden, um a anzuwenden Macht Vektor auf einem Körper aus einem gegebenen Position. Diese Kraft kann dazu führen, dass auf einen bestimmten Körper ein Drehmoment ausgeübt wird.
Der folgende Code wendet eine Kraft direkt in der Körpermitte an. Der Kraftvektor ist x: 0, y: -0,05. Dies bedeutet, dass die aufgebrachte Kraft rein vertikal und aufwärts gerichtet ist. Beachten Sie, dass vertikale Kräfte in Aufwärtsrichtung in Matter.js ein negatives Vorzeichen haben. Bemerkenswert ist auch, wie klein die Zahl ist, die die Vertikalkraft angibt. Die Gravitationskraft selbst hat in Matter.js nur einen Wert von 1.
Die Bewegung des Balls nach dem Aufbringen der Kräfte erscheint natürlich, solange der Ball nicht mit den Wänden oder dem Boden kollidiert. Normalerweise, wenn Dinge mit etwas kollidieren, erwarten wir, dass sie zurückspringen. Die Energie, mit der ein Objekt zurückspringt, wird durch den Restitutionskoeffizienten bestimmt.
In Matter.js ist der Wert standardmäßig auf Null gesetzt. Dies bedeutet, dass ein Objekt, dessen Restitution auf Null gesetzt ist und mit etwas anderem kollidiert, nicht mehr zurückspringt. Ein Wert von 1 bedeutet, dass das Objekt mit einer kinetischen Energie zurückspringt, die der vor der Kollision entspricht. Ein Wert wie 0,5 bedeutet, dass das Objekt nur mit 50% seiner vorherigen kinetischen Energie zurückspringt. Der Rückerstattungswert für ein Objekt kann mit der Option gesteuert werden Restitution Schlüssel.
In bestimmten Simulationen kann es erforderlich sein, dass Sie die Reibung zwischen verschiedenen Körpern ändern. Dies kann mit dem erreicht werden Reibung, FriktionsAir und FrictionStatic Schlüssel.
Reibung Schlüssel gibt den Wert der kinetischen Reibung für einen Körper an. Es kann einen Wert zwischen 0 und 1 haben. Ein Wert von 0 bedeutet, dass sich ein Körper unbegrenzt weiter bewegen kann, nachdem er in Bewegung gesetzt wurde. Die einzige Möglichkeit, dies zu stoppen, besteht darin, eine andere äußere Kraft anzuwenden. Der Endwert der Reibung zwischen zwei Objekten wird anhand der Formel bestimmt Math.min (bodyA.friction, bodyB.friction). FrictionStatic Taste gibt den Wert der Reibung an, wenn sich ein Körper im Ruhezustand befindet. Der Standardwert für die Haftreibung beträgt 0,5. Ein höherer Wert bedeutet, dass eine größere Kraft erforderlich ist, um den Körper in Bewegung zu setzen.FriktionsAir Mit der Taste wird der Reibungswert zwischen einem Körper und der Umgebungsluft angegeben. Ein höherer Wert bedeutet, dass sich der Körper beim Durchfahren der Luft sehr schnell verlangsamt. Die Wirkung der Luftreibung ist nicht linear.$ ('. rote Reibung'). ein ('Klick', Funktion () circleA.friction = 0,05; circleA.frictionAir = 0,0005; circleA.restitution = 0,9;); $ ('. res-Reibung'). on ('click', function () circleA.friction = 0,1; circleA.frictionAir = 0,001; circleA.restitution = 0;);Bis jetzt haben wir die Farbe, die Umrissbreite oder den Strichstil nicht angegeben, die beim Rendern eines Körpers verwendet werden sollen. Alle diese Eigenschaften sind innerhalb von eingebettet machen Schlüssel. Das fillStyle Die Eigenschaft akzeptiert eine Zeichenfolge, um den Füllstil anzugeben, der den Körper darstellt. Das Linienbreite Diese Eigenschaft akzeptiert eine Zahl, die die Linienstärke definiert, die beim Erstellen der Kontur eines Körpers verwendet werden soll.
Ein Wert von Null bedeutet, dass überhaupt keine Linie gerendert wird. Das strokeStyle Diese Eigenschaft kann verwendet werden, um den Strichstil anzugeben, der beim Rendern der Körperkontur verwendet werden soll. Sie können das Rendern von Körpern überhaupt verhindern, indem Sie die Option sichtbar Schlüssel zu falsch. Die Deckkraft des Körpers, den Sie rendern möchten, können Sie mit der Option steuern Opazität Schlüssel.
Sie können auch ein Bild anstelle von einfachen Farben und Konturen verwenden, um einen Körper zu rendern. Die Parameter für das Rendern eines Körpers mithilfe von Sprites werden mit anderen Eigenschaften festgelegt. Das Textur Diese Eigenschaft definiert den Pfad des Bildes, der als Sprite-Textur verwendet werden soll.
Das xOffset und yOffset Eigenschaften können verwendet werden, um den Versatz in den jeweiligen Achsen für das Sprite zu definieren. Ebenso können Sie das verwenden xScale und yScale Eigenschaften zum Definieren der Skalierung in der X-Achse und der Y-Achse für das Sprite. Hier ist ein Code, der den hellblauen Hintergrund unseres Balls durch ein Fußball-Sprite von der Open Game Art-Website ersetzt.
var ball = Bodies.circle (90, 280, 20, render: sprite: textur: "pfad / to / soccer_ball.png", xScale: 0,4, yScale: 0,4);
Sie haben bereits gesehen, wie Sie die Reibung oder den Restitutionskoeffizienten für ein Objekt in Matter.js angeben. Es gibt viele andere Eigenschaften, deren Werte auf dieselbe Weise angegeben werden können. Auf der anderen Seite gibt es Eigenschaften, die schreibgeschützt sind und von Ihnen nicht geändert werden können.
Sie können die Position eines Körpers in der Welt mit Hilfe von festlegen Position Schlüssel, der einen Vektor als Wert akzeptiert. Sie können auch die Masse eines Körpers mit angeben Masse Eigenschaft, aber dann müssen Sie auch einen Wert für die festlegen inverseMass Eigenschaft, die mit berechnet wird 1 / Masse. Eine bessere Möglichkeit, die Masse eines Körpers zu kontrollieren, ist mit Hilfe der Dichte Eigentum.
Wenn Sie die Dichte eines Körpers ändern, wird seine Masse automatisch basierend auf seiner Fläche berechnet. Auf diese Weise können Sie auch verschiedene Objekte anhand ihrer Dichte unterscheiden. Beispielsweise sollte ein Körper, der einen Felsen als Sprite verwendet, eine höhere Dichte haben als ein Körper gleicher Größe, der einen Fußball als Sprite verwendet.
Einige Eigenschaften mögen Geschwindigkeit, Geschwindigkeit und Winkelgeschwindigkeit sind schreibgeschützt, aber ihre Werte können mit geeigneten Methoden wie eingestellt werden setAngularVelocity () und setVelocity (). Weitere Informationen zu verschiedenen Eigenschaften des Body-Moduls finden Sie in der Dokumentation.
In diesem Lernprogramm haben Sie alle wichtigen Methoden und Eigenschaften im Body-Modul der Matter.js-Bibliothek kennen gelernt. Wenn Sie sich mit diesen verschiedenen Eigenschaften auskennen und wissen, was sie bewirken, können Sie realistischere Simulationen der realen Physik erstellen. Im nächsten und letzten Tutorial der Serie erfahren Sie mehr über das Composite-Modul in Matter.js.
Wenn Sie Fragen zu diesem Tutorial oder Tipps zur Verwendung der Bibliothek haben, teilen Sie uns diese bitte mit.
