diff --git a/README.md b/README.md
index 5a3f009..2f41e08 100644
--- a/README.md
+++ b/README.md
@@ -14,6 +14,8 @@ Angular 2 component for [szimek/signature_pad](https://www.npmjs.com/package/sig
 API is identical to [szimek/signature_pad](https://www.npmjs.com/package/signature_pad).
 
 Options are as per [szimek/signature_pad](https://www.npmjs.com/package/signature_pad) with the following additions:
+* canvasId: ID of the canvas element
+* canvasClass: CSS class to be added to the canvas element
 * canvasWidth: width of the canvas (px)
 * canvasHeight: height of the canvas (px)
 The above options are provided to avoid accessing the DOM directly from your component to adjust the canvas size.
diff --git a/package-lock.json b/package-lock.json
index 72cdd65..44207a5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -106,14 +106,20 @@
       "dev": true
     },
     "rxjs": {
-      "version": "5.0.0-beta.12",
-      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-5.0.0-beta.12.tgz",
-      "integrity": "sha1-zf3i2MRjnSCud5S/+P3fMtp60zc=",
+      "version": "5.4.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-5.4.2.tgz",
+      "integrity": "sha1-KjI2/L8D31e64G/Wly/ZnlwI/Pc=",
       "dev": true,
       "requires": {
-        "symbol-observable": "1.2.0"
+        "symbol-observable": "^1.0.1"
       }
     },
+    "rxjs-compat": {
+      "version": "6.5.3",
+      "resolved": "https://registry.npmjs.org/rxjs-compat/-/rxjs-compat-6.5.3.tgz",
+      "integrity": "sha512-BIJX2yovz3TBpjJoAZyls2QYuU6ZiCaZ+U96SmxQpuSP/qDUfiXPKOVLbThBB2WZijNHkdTTJXKRwvv5Y48H7g==",
+      "dev": true
+    },
     "signature_pad": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/signature_pad/-/signature_pad-2.3.2.tgz",
@@ -166,10 +172,16 @@
         "source-map-support": "0.3.3"
       }
     },
+    "tslib": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",
+      "integrity": "sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==",
+      "dev": true
+    },
     "typescript": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.0.3.tgz",
-      "integrity": "sha1-M97J6uhrju4yfdQZygUMhTyr1RQ=",
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.1.tgz",
+      "integrity": "sha1-w8yxbdqgsjFN4DHn5v7onlujRrw=",
       "dev": true
     },
     "zone.js": {
@@ -179,4 +191,4 @@
       "dev": true
     }
   }
-}
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 149147e..0d1672f 100644
--- a/package.json
+++ b/package.json
@@ -35,8 +35,10 @@
     "@angular/platform-browser": "2.0.1",
     "@angular/platform-browser-dynamic": "2.0.1",
     "@angular/platform-server": "2.0.1",
-    "rxjs": "5.0.0-beta.12",
-    "typescript": "2.0.3",
+    "rxjs": "5.4.2",
+    "rxjs-compat": "^6.5.3",
+    "tslib": "^1.10.0",
+    "typescript": "2.4.1",
     "zone.js": "0.6.25"
   }
 }
diff --git a/signature-pad.ts b/signature-pad.ts
index 914d976..a1aec4f 100644
--- a/signature-pad.ts
+++ b/signature-pad.ts
@@ -37,7 +37,15 @@ export class SignaturePad {
   public ngAfterContentInit(): void {
     let sp: any = require('signature_pad')['default'];
     let canvas: any = this.elementRef.nativeElement.querySelector('canvas');
+    
+    if ((<any>this.options)['canvasId']) {
+      canvas.id = (<any>this.options)['canvasId'];
+    }
 
+    if ((<any>this.options)['canvasClass']) {
+      canvas.classList.add((<any>this.options)['canvasClass']);
+    }
+    
     if ((<any>this.options)['canvasHeight']) {
       canvas.height = (<any>this.options)['canvasHeight'];
     }