diff --git a/js/imageWidgetCrop.js b/js/imageWidgetCrop.js
index 7ebaf22..c5aec4e 100644
--- a/js/imageWidgetCrop.js
+++ b/js/imageWidgetCrop.js
@@ -59,7 +59,8 @@
     $verticalTabsMenuItem.click(function () {
       var tabId = $(this).find('a').attr('href');
       var $cropper = $(tabId).find(cropperSelector);
-      Drupal.imageWidgetCrop.initializeCropper($cropper, $cropper.data('ratio'));
+      var ratio = Drupal.imageWidgetCrop.getRatio($cropper);
+      Drupal.imageWidgetCrop.initializeCropper($cropper, ratio);
     });
 
     $reset.on('click', function (e) {
@@ -71,6 +72,27 @@
   };
 
   /**
+   * Get ratio data and determine if an available ratio or free crop.
+   *
+   * @param {Object} $element - Element to initialize cropper on its children.
+   */
+  Drupal.imageWidgetCrop.getRatio = function ($element) {
+    var ratio = $element.data('ratio');
+    var regex = /:/;
+
+    if ((regex.exec(ratio)) !== null) {
+      var int = ratio.split(":");
+      if ($.isArray(int) && ($.isNumeric(int[0]) && $.isNumeric(int[1]))) {
+        return int[0] / int[1];
+      } else {
+        return "NaN";
+      }
+    } else {
+      return ratio;
+    }
+  };
+
+  /**
    * Initialize cropper on an element.
    *
    * @param {Object} $element - Element to initialize cropper on.
@@ -95,9 +117,9 @@
     }
 
     options.data = data;
-    options.aspectRatio = (ratio);
+    options.aspectRatio = ratio;
 
-    $element.cropper(cropperOptions);
+    $element.cropper(options);
   };
 
   /**
@@ -107,7 +129,8 @@
    */
   Drupal.imageWidgetCrop.initializeCropperOnChildren = function ($element) {
     var visibleCropper = $element.find(cropperSelector + ':visible');
-    Drupal.imageWidgetCrop.initializeCropper($(visibleCropper), $(visibleCropper).data('ratio'));
+    var ratio = Drupal.imageWidgetCrop.getRatio($(visibleCropper));
+    Drupal.imageWidgetCrop.initializeCropper($(visibleCropper), ratio);
   };
 
   /**
diff --git a/src/Plugin/Field/FieldWidget/ImageCropWidget.php b/src/Plugin/Field/FieldWidget/ImageCropWidget.php
index e8e58be..07453f0 100644
--- a/src/Plugin/Field/FieldWidget/ImageCropWidget.php
+++ b/src/Plugin/Field/FieldWidget/ImageCropWidget.php
@@ -209,7 +209,6 @@ class ImageCropWidget extends ImageWidget {
             $original_properties = [];
             $has_ratio = $crop_type->getAspectRatio();
             $ratio = !empty($has_ratio) ? $has_ratio : t('NaN');
-            $ratio = str_replace(':', '/', $ratio);
 
             $container[$crop_type_id] = [
               '#type' => 'details',