vue+js如何实现旋转动画

我是分为两种方式进行旋转动画显示的，一种是原生js一种是vue+js。
主要的效果如下图显示：

当点击具体的某一块的时候，该元素会旋转到圆盘最前面的中间位置显示，同时要有透视效果，就是远小近大（远处的盒子最小，近处的盒子最大。透明度同理。）

第一种方法纯原生，代码如下：（根据代码给出解释）
这种首先给出了一个元素运动的运动轨迹以及动画。主要是既改变自身元素的旋转也改变背景圆盘的旋转。主要是用css完成。

<template>
    <div class='wrap'>
    	<!-- 这个是圆盘 -->