KineticJS и формы внутри области

Question

Я ищу самый быстрый способ найти все фигуры внутри области. Пожалуйста, попробуйте этот пример в Chrome или FireFox: http://jsfiddle.net/markusleth/FBjKY/

Я знаю, как перебирать и сравнивать координаты, но меня беспокоит производительность. Любые предложения приветствуются.

var x1, x2, y1, y2; 
var shapes = stage.get("Rect"); 
shapes.each(function (shape) { 
    // calculate if shape is inside x1, x2, y1, y2 
}); 

Answer 1

Ну, KineticJS имеет несколько функций пересечения:

intersects(point)Kinetic.Shape#intersects

getAllIntersections(pos)Kinetic.Container#getAllIntersections

getIntersection(pos)Kinetic.Stage#getIntersection

Хотя getAllIntersections, вероятно, является функцией вам нужно, похоже, автор KineticJS настоятельно рекомендует использовать getIntersectionIF возможно свыше getAllIntersections. Это связано с тем, что getAllIntersections имеет низкую производительность при вызове несколько раз подряд, что, вероятно, является проблемой для вас.

По моему опыту getIntersection извлекает только один объект, который пересекает точку, и, кажется, возвращает только последний объект, добавленный на сцену, который пересекает точку! Я не уверен, как вы будете использовать это в своей ситуации.

Пользователь EliteOctagon написал собственную функцию обнаружения столкновений с лучшим успехом (и лучшей производительностью!): HTML5/kineticJS getIntersection function implementation Это может быть вашим лучшим выбором. Удачи!

О, и еще один небольшой наконечник на производительность: если вы пытаетесь выбрать формы, а не только «Прямоугольники», он будет работать лучше, если бы вы назвали все выбираемые формы того же имени, и использовать функцию .get() по имени а не только .get("Rect").

Например:

new Kinetic.Rect({ 
    name: "selectableShape" 
}); 

new Kinetic.Ellipse({ 
    name: "selectableShape" 
}); 

var selectableShapes = stage.get(".selectableShape");