javascript - 如何创建从一个 ng-view 到另一个 ng-view 的缩放动画？

Question

我的屏幕将分成 4 个相等的矩形，每个矩形中都有一个图表。我希望用户能够单击图表和应用程序，然后放大到一个新 View ，即整个页面的图表。

所以我想要这样的设置:

app/charts 显示所有图表。然后，当用户选择一个图表(比如 chart-1)时，应用会导航到 app/charts/chart-1。

我希望被点击的图表展开到 View 中，直到它占据整个屏幕(新 View )。

我愿意接受任何解决方法。 CSS、javascript 库、hack(也许只使用一个 View 并放大选定的 div？)我希望能够通过 url 导航到全屏图表......

谢谢，感谢任何帮助。

Answer 1

<div class="wrapper  {selected_class}">
  <div ng-click="selected_class='top-left'" class="top-left"></div>
  <div ng-click="selected_class='top-right'" class="top-right"></div>
  <div ng-click="selected_class='bottom-left'" class="bottom-left"></div>
  <div ng-click="selected_class='bottom-right'" class="bottom-right"></div>
</div>


.top-left .top-left{ transform:scale(2); } etc