[APM] Service maps IE 11 bug fixes

[ogupte]

Closes #63113 by limiting service maps to only draw certain shapes in IE 11 without icons. Also fixes flex bugs in the popup details.

IE11 after fixes:

[dgieselaar]

we are using this in public/components/app/ServiceMap/icons.ts as well, should we put it in common and import it from there in both places?

[ogupte]

Actually, now that I think about it, the flag in icons.ts is now unnecessary since the iconForNode function is never called now (from cytoscapeOptions.ts. We can address this in another PR since this is already merged and backported now.

[dgieselaar]

nice @ogupte!

[formgeist]

@ogupte Not all that important, but if it's possible, can the service nodes be circles instead of squares to get closer to the real style?

[kibanamachine]

💚 Build Succeeded

• continuous-integration/kibana-ci/pull-request
• Commit: e08fe3d

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[ogupte]

@ogupte Not all that important, but if it's possible, can the service nodes be circles instead of squares to get closer to the real style?

@formgeist: Unfortunately, in IE 11, drawing circles were producing errors. The bug seemed to show itself when it traversed specific segments of a draw path for certain shapes. Ellipses (including circles) and triangles (connection arrows) were among those shapes with the kind of drawing path that produced the error, but diamonds, and rectangles (including squares) seemed to render without issue.

[formgeist]

@formgeist: Unfortunately, in IE 11, drawing circles were producing errors. The bug seemed to show itself when it traversed specific segments of a draw path for certain shapes. Ellipses (including circles) and triangles (connection arrows) were among those shapes with the kind of drawing path that produced the error, but diamonds, and rectangles (including squares) seemed to render without issue.

OK, thanks for looking into it though 👍