PM01-0305. Forma, tamaño y color

Formato y organización de datos

Forma, tamaño y color

¿Deseas resaltar algún dato?, ¿necesitas identificar rápidamente algunos valores?, ¿deseas agregar a los informes algún tipo de identidad de marca?

[{"selector":"#anim-fecbe117-77f2-47da-af16-a75c88683627","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-e536df98-2a7a-413c-8a0a-03f406e75e94","keyframes":{"transform":["translate3d(0px, 155.29348%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-948ed68a-71a9-4d38-bf8e-5c90617b4dcd","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-066f5339-3b1b-4a27-9533-5d1365775751","keyframes":{"transform":["translate3d(0px, -117.34007%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}]

Puedes hacerlo de manera sencilla modificando la forma, tamaño y color de tus visualizaciones de datos.

[{"selector":"#anim-2498099a-8dfb-4238-b39a-97897c99547d","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-61a1001f-b46e-4bd3-8ff0-387c3fa943aa","keyframes":{"transform":["translate3d(-116.99347%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b8b004ae-4450-4482-acb0-6a28395b06f2","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-f353499e-fb74-4831-ae11-a9ddfe62f780","keyframes":{"transform":["translate3d(112.42423%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}]

Observa un ejemplo práctico:

[{"selector":"#anim-b8ead58a-23f4-4b8b-aece-32c733303c4f","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-f4031b84-6e3d-489f-9ad9-7f61c445102e","keyframes":{"transform":["translate3d(-115.18988%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-39d9e668-62ec-4bf8-a9c8-2cea16225b0e","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-67592097-6f0f-4dad-abe1-4e44e9febc1f","keyframes":{"transform":["translate3d(-386.51686%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-a0f92f63-362d-4cf6-8743-16851e37795b","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}] [{"selector":"#anim-09ff9aa3-4614-4fc5-a73a-b79d48a7eecd","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-dda9fc92-d444-468a-b105-88caa816bc3a","keyframes":{"transform":["translate3d(100.00000%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Aplica Burst with Arrow

[{"selector":"#anim-458d9d5f-200e-4820-9092-27e21e23d06f","keyframes":[{"offset":0,"transform":"translate3d(0, -166.2263%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.29,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.45,"transform":"translate3d(0, -46.74283556%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.61,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.71,"transform":"translate3d(0, -15.89123428%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.8,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.85,"transform":"translate3d(0, -5.967524170000001%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.92,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.96,"transform":"translate3d(0, -2.59313028%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":1,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"}],"delay":0,"duration":1400,"fill":"both"}]