diff --git a/packages/angular/src/base-chart.component.ts b/packages/angular/src/base-chart.component.ts
index 8a8294ffcf..d5476a4cac 100644
--- a/packages/angular/src/base-chart.component.ts
+++ b/packages/angular/src/base-chart.component.ts
@@ -29,7 +29,7 @@ export class BaseChart implements AfterViewInit, OnInit {
 		this._data = newData;
 
 		if (dataExistsAlready) {
-			this.chart.setData(newData);
+			this.chart.model.setData(newData);
 		}
 	}
 
@@ -47,7 +47,7 @@ export class BaseChart implements AfterViewInit, OnInit {
 		this._options = newOptions;
 
 		if (optionsExistAlready) {
-			this.chart.setOptions(newOptions);
+			this.chart.model.setOptions(newOptions);
 		}
 	}
 
@@ -85,15 +85,11 @@ export class BaseChart implements AfterViewInit, OnInit {
 		// Width prop is mandatory for the wrappers
 		if (this.width) {
 			this.options.width = this.width;
-		} else if (!this.options.width) {
-			console.error("Missing `width` Input!");
 		}
 
 		// Height prop is mandatory for the wrappers
 		if (this.height) {
 			this.options.height = this.height;
-		} else if (!this.options.height) {
-			console.error("Missing `height` Input!");
 		}
 	}
 
diff --git a/packages/core/src/configuration.ts b/packages/core/src/configuration.ts
index 29143ed54c..63ab041620 100644
--- a/packages/core/src/configuration.ts
+++ b/packages/core/src/configuration.ts
@@ -98,6 +98,8 @@ export const timeScale: TimeScaleOptions = {
  * Base chart options common to any chart
  */
 const chart: BaseChartOptions = {
+	width: "100%",
+	height: "100%",
 	resizable: true,
 	theme: ChartTheme.DEFAULT,
 	tooltip: baseTooltip,
diff --git a/packages/core/src/interfaces/charts.ts b/packages/core/src/interfaces/charts.ts
index 20ec174fbf..10f0edb800 100644
--- a/packages/core/src/interfaces/charts.ts
+++ b/packages/core/src/interfaces/charts.ts
@@ -21,11 +21,11 @@ export interface BaseChartOptions {
 	/**
 	 * Optionally specify a width for the chart
 	 */
-	width?: number;
+	width?: number | string;
 	/**
 	 * Optionally specify a height for the chart
 	 */
-	height?: number;
+	height?: number | string;
 	/**
 	 * Optional function to generate the fill color based on datasetLabel, label, and/or value
 	 */
diff --git a/packages/react/src/base-chart.js b/packages/react/src/base-chart.js
index c29660940a..ba3cd60bf1 100644
--- a/packages/react/src/base-chart.js
+++ b/packages/react/src/base-chart.js
@@ -19,21 +19,18 @@ export default class BaseChart extends React.Component {
 		// Width prop is mandatory for the wrappers
 		if (props.width) {
 			this.options.width = props.width;
-		} else if (!this.options.width) {
-			console.error("Missing `width` prop!");
 		}
 
 		// Height prop is mandatory for the wrappers
 		if (props.height) {
 			this.options.height = props.height;
-		} else if (!this.options.height) {
-			console.error("Missing `height` prop!");
 		}
 
 		Object.assign(this, this.chart);
 	}
 
 	componentDidUpdate() {
-		this.chart.setData(this.props.data);
+		this.chart.model.setData(this.props.data);
+		this.chart.model.setOptions(this.props.options);
 	}
 }
diff --git a/packages/vue/src/ccv-base-chart.vue b/packages/vue/src/ccv-base-chart.vue
index 30d3d321cc..ebbcb5146b 100644
--- a/packages/vue/src/ccv-base-chart.vue
+++ b/packages/vue/src/ccv-base-chart.vue
@@ -13,10 +13,16 @@ export default {
 	watch: {
 		data: {
 			handler: function(newData) {
-				this.coreChart.setData(newData);
+				this.coreChart.model.setData(newData);
 			},
 			deep: true,
 		},
+		options: {
+			handler: function(newOptions) {
+				this.coreChart.model.setOptions(newOptions);
+			},
+			deep: true,
+		}
 	},
 };
 </script>