1cb93a386Sopenharmony_cifunction SkottieExample(CanvasKit, surface, jsonStr, bounds) { 2cb93a386Sopenharmony_ci if (!CanvasKit || !jsonStr) { 3cb93a386Sopenharmony_ci return; 4cb93a386Sopenharmony_ci } 5cb93a386Sopenharmony_ci const animation = CanvasKit.MakeAnimation(jsonStr); 6cb93a386Sopenharmony_ci const duration = animation.duration() * 1000; 7cb93a386Sopenharmony_ci 8cb93a386Sopenharmony_ci const firstFrame = performance.now(); 9cb93a386Sopenharmony_ci 10cb93a386Sopenharmony_ci function drawFrame(skcanvas) { 11cb93a386Sopenharmony_ci const now = performance.now(); 12cb93a386Sopenharmony_ci const seek = ((now - firstFrame) / duration) % 1.0; 13cb93a386Sopenharmony_ci 14cb93a386Sopenharmony_ci animation.seek(seek); 15cb93a386Sopenharmony_ci animation.render(skcanvas, [0, 0, 500, 500]); 16cb93a386Sopenharmony_ci 17cb93a386Sopenharmony_ci surface.requestAnimationFrame(drawFrame); 18cb93a386Sopenharmony_ci } 19cb93a386Sopenharmony_ci surface.requestAnimationFrame(drawFrame); 20cb93a386Sopenharmony_ci}