Как добавить вопрос.Javascript

Форум по Javascript
Ответить
Anonymous
 Как добавить вопрос.

Сообщение Anonymous »

Я пытаюсь использовать вещества. Код> падает на землю . Все работает, как и ожидалось, пока я не попытаюсь добавить MouseConstraint. My Mouse.element - это SVG Viewbox, который хорошо, но нажимать на поле ничего не делает. Приведенный ниже код также находится в этом коде. может щелкнуть/перетащить поле. Я не использую JavaScript в своем повседневном дне (кроме D3), так что это все немного непрозрачно.
Вот неработающий код:
const Engine = Matter.Engine
const Bodies = Matter.Bodies
const Composite = Matter.Composite
const World = Matter.World

const width = 400;
const height = 400;

// Helpers
vertices_to_points = function(vertices) {
return vertices.map(vertex => `${vertex.x},${vertex.y}`).join(" ");
}

// Initialize D3 selection
const svg = d3.select("#container")
.append("svg")
.attr("viewBox", [0, 0, width, height])
.attr("style", "max-width: 100%; height: auto;");

// Initialize physics objects
const engine = Engine.create();
const world = engine.world;
const bodies = world.bodies;

const box = Bodies.rectangle(width/2, height/2, 100, 100);
const ground = Bodies.rectangle(width/2, height - 25, width - 10, 40, { isStatic: true });
Composite.add(engine.world, [box, ground]);

// Render
bodies.forEach(body => {
svg.append("polygon")
.attr("id", `body-${body.id}`)
.attr("points", vertices_to_points(body.vertices))
.attr("fill", "white")
.attr("stroke", "black")
.attr("stroke-width", 2)
});

// Update + render loop
(function update() {
window.requestAnimationFrame(update);
Engine.update(engine, 5);

// Move the vertices to sync the D3 with the Matter
// physics body.
bodies.forEach(body => {
svg.select(`#body-${body.id}`)
.attr("points", vertices_to_points(body.vertices))
});
})();

// Mouse interaction (DOES NOT WORK)
const mouse = Matter.Mouse.create(svg.node());
mouse.pixelRatio = 2;
const mouse_constraint = Matter.MouseConstraint.create(engine, {
mouse: mouse
})
World.add(world, mouse_constraint);


Подробнее здесь: https://stackoverflow.com/questions/794 ... ox-element
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»