Add animation to service map layout (#56042)

We had previously deleted the animation because the method we were using for adding nodes to the map would wipe the whole map out before redrawing it and make for very awkward animation.

The way it works now is the Cytoscape component calls `add` on the cytoscape instance when new elements are added, so the animation looks ok.

Fixes #54796.

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

x-pack/legacy/plugins/apm/public/components/app/ServiceMap/cytoscapeOptions.ts

@@ -10,7 +10,10 @@ import { defaultIcon, iconForNode } from './icons';
 const layout = {
   name: 'dagre',
   nodeDimensionsIncludeLabels: true,
-  rankDir: 'LR'
+  rankDir: 'LR',
+  animate: true,
+  animationEasing: theme.euiAnimSlightBounce,
+  animationDuration: parseInt(theme.euiAnimSpeedNormal, 10)
 };
 
 function isService(el: cytoscape.NodeSingular) {