Testing the performance of moving 5000 circle nodes through a group translate. The performance is far worse than changing directly the X/Y properties of the CircleNode, see: https://play.data2viz.io/sketches/rJjpDL/edit/
5000 circles (with group translate)
import io.data2viz.color.*
import io.data2viz.geom.*
import io.data2viz.math.*
import io.data2viz.viz.*
import io.data2viz.random.*
import kotlin.math.sin
import kotlin.math.cos
private val vizWidth = 600.0
private val vizHeight = 600.0
private var center = Point(vizWidth / 2, vizHeight / 2)
private val randomAngle = RandomDistribution.uniform(.02, 2 * PI)
private var circles = 5000
private val angles = (0 .. circles).map { randomAngle().rad }
private var frame = .0
private fun getX(angle: Angle) = center.x + (sin(angle.rad) * sin(cos(angle.rad) + frame) * center.x)
private fun getY(angle: Angle) = center.y + (cos(angle.rad) * cos(sin(angle.rad) + frame) * center.y)
fun main() {
viz {
size = size(vizWidth, vizHeight)
val elements = angles.map {
group {
transform {
translate(getX(it), getY(it))
}
circle {
radius = 5.0
fill = Colors.Web.red
}
}
}
animation {
frame += 0.01
elements.forEachIndexed { index, group ->
group.apply {
transform {
translate(getX(angles[index]), getY(angles[index]))
}
}
}
}
}.bindRendererOnNewCanvas()
}
Sketch created by
pierre
comments