svg-points-interpolation.html | Explore in Territory

<!DOCTYPE html>
<html>
<body>
<template id="target-template">
<svg width="90" height="90">
<polygon class="target" />
</svg>
</template>
<script src="resources/interpolation-test.js"></script>
<script>
'use strict';
assertAttributeInterpolation({
  property: 'points',
  from: '10 20, 80 20, 80 70, 10 70',
  to: '15 10, 75 10, 75 80, 15 80'
}, [
  {at: -0.4, is: '8 24, 82 24, 82 66, 8 66'},
  {at: 0, is: '10 20, 80 20, 80 70, 10 70'},
  {at: 0.2, is: '11 18, 79 18, 79 72, 11 72'},
  {at: 0.6, is: '13 14, 77 14, 77 76, 13 76'},
  {at: 1, is: '15 10, 75 10, 75 80, 15 80'},
  {at: 1.4, is: '17 6, 73 6, 73 84, 17 84'}
]);
assertAttributeInterpolation({
  property: 'points',
  from: '0 0, 10 0, 20 0, 30 0, 40 0',
  to: '50 0, 60 0, 70 0'
}, [
  {at: -0.4, is: '0 0, 10 0, 20 0, 30 0, 40 0'},
  {at: 0, is: '0 0, 10 0, 20 0, 30 0, 40 0'},
  {at: 0.2, is: '0 0, 10 0, 20 0, 30 0, 40 0'},
  {at: 0.6, is: '50 0, 60 0, 70 0'},
  {at: 1, is: '50 0, 60 0, 70 0'},
  {at: 1.4, is: '50 0, 60 0, 70 0'}
]);
</script>
</body>
</html>

chromium/third_party/blink/web_tests/animations/svg-attribute-interpolation/svg-points-interpolation.html