0.0.3

Author: weizhenye

dist/vue-highcharts.js

@@ -6,46 +6,56 @@
 
 HighchartsOnly = 'default' in HighchartsOnly ? HighchartsOnly['default'] : HighchartsOnly;
 
+var ctors = {
+  highcharts: 'Chart',
+  highstock: 'StockChart',
+  highmaps: 'Map',
+  'highcharts-renderer': 'Renderer'
+};
+
 function create(tagName, Highcharts) {
-  var ctors = {
-    highcharts: 'Chart',
-    highstock: 'StockChart',
-    highmaps: 'Map'
-  };
   var Ctor = Highcharts[ctors[tagName]];
   if (!Ctor) {
     return null;
   }
+  var isRenderer = tagName === 'highcharts-renderer';
   return {
     name: tagName,
     template: '<div></div>',
-    props: {
-      options: Object
-    },
+    props: isRenderer
+      ? {
+          width: { type: Number, required: true },
+          height: { type: Number, required: true }
+        }
+      : { options: { type: Object, required: true } },
     methods: {
-      render: function(options) {
-        var opts = options || {};
-        opts.chart = opts.chart || {};
-        opts.chart.renderTo = this.$el;
-        this._chart = new Ctor(opts);
+      _renderChart: function() {
+        if (isRenderer) {
+          this.renderer = new Ctor(this.$el, this.width, this.height);
+        } else {
+          var opts = JSON.parse(JSON.stringify(this.options));
+          opts.chart = opts.chart || {};
+          opts.chart.renderTo = this.$el;
+          this.chart = new Ctor(opts);
+        }
       }
     },
     mounted: function() {
-      this.render(this.options);
+      this._renderChart();
     },
     beforeDestroy: function() {
-      this._chart.destroy();
+      !isRenderer && this.chart.destroy();
     }
   };
 }
 
 function install(Vue, options) {
   var Highcharts = (options && options.Highcharts) || HighchartsOnly;
   Vue.prototype.Highcharts = Highcharts;
-  ['highcharts', 'highstock', 'highmaps'].forEach(function(tagName) {
+  for (var tagName in ctors) {
     var component = create(tagName, Highcharts);
     component && Vue.component(tagName, component);
-  });
+  }
 }
 
 return install;

dist/vue-highcharts.min.js

@@ -1,6 +1,6 @@
 {
   "name": "vue-highcharts",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Highcharts component for Vue",
   "main": "dist/vue-highcharts.js",
   "jsnext:main": "src/index.js",