| @@ -38,12 +38,11 @@ | ||
| 38 | 38 | wpmV.apply(this, arguments); |
| 39 | 39 | }, |
| 40 | 40 | |
| 41 | 41 | render: function() { |
| 42 | - var self, model, chart, gv, type, series, data, table, settings, i, j, row, date, format, formatter, axis, property; | |
| 42 | + var self, model, chart; | |
| 43 | 43 | |
| 44 | 44 | self = this; |
| 45 | - gv = google.visualization; | |
| 46 | 45 | model = self.model; |
| 47 | 46 | |
| 48 | 47 | self.$el |
| 49 | 48 | .width(self.options.width) |
| @@ -49,139 +48,19 @@ | ||
| 49 | 48 | .width(self.options.width) |
| 50 | 49 | .height(self.options.height) |
| 51 | 50 | .css('background-image', 'none'); |
| 52 | 51 | |
| 53 | - type = model.get('type'); | |
| 54 | - series = model.get('series'); | |
| 55 | - data = model.get('data'); | |
| 56 | - settings = model.get('settings'); | |
| 52 | + chart = {}; | |
| 53 | + chart.type = model.get('type'); | |
| 54 | + chart.series = model.get('series'); | |
| 55 | + chart.data = model.get('data'); | |
| 56 | + chart.library = model.get('library'); | |
| 57 | + chart.settings = model.get('settings'); | |
| 58 | + chart.settings.width = self.options.width; | |
| 59 | + chart.settings.height = self.options.height; | |
| 60 | + $('#' + self.id).parent().append(model.get('css')); | |
| 57 | 61 | |
| 58 | - settings.width = self.options.width; | |
| 59 | - settings.height = self.options.height; | |
| 60 | - | |
| 61 | - table = new gv.DataTable({cols: series}); | |
| 62 | - | |
| 63 | - switch (type) { | |
| 64 | - case "gauge": | |
| 65 | - case "table": | |
| 66 | - case "timeline": | |
| 67 | - chart = type.charAt(0).toUpperCase() + type.slice(1); | |
| 68 | - break; | |
| 69 | - default: | |
| 70 | - chart = type.charAt(0).toUpperCase() + type.slice(1) + 'Chart'; | |
| 71 | - break; | |
| 72 | - } | |
| 73 | - | |
| 74 | - chart = new gv[chart](self.el); | |
| 75 | - | |
| 76 | - switch (type) { | |
| 77 | - case 'pie': | |
| 78 | - if (settings.slices) { | |
| 79 | - for (i in settings.slices) { | |
| 80 | - if (settings.slices[i]['color'] === '') { | |
| 81 | - delete settings.slices[i]['color']; | |
| 82 | - } | |
| 83 | - } | |
| 84 | - } | |
| 85 | - break; | |
| 86 | - case 'line': | |
| 87 | - case 'bar': | |
| 88 | - case 'column': | |
| 89 | - case 'area': | |
| 90 | - case 'scatter': | |
| 91 | - case 'candlestick': | |
| 92 | - if (settings.series) { | |
| 93 | - for (i in settings.series) { | |
| 94 | - if (settings.series[i]['color'] === '') { | |
| 95 | - delete settings.series[i]['color']; | |
| 96 | - } | |
| 97 | - } | |
| 98 | - } | |
| 99 | - break; | |
| 100 | - case 'geo': | |
| 101 | - if (settings.region !== undefined && settings.region.replace(/^\s+|\s+$/g, '') === '') { | |
| 102 | - settings['region'] = 'world'; | |
| 103 | - } | |
| 104 | - break; | |
| 105 | - case 'gauge': | |
| 106 | - break; | |
| 107 | - default: | |
| 108 | - return; | |
| 109 | - } | |
| 110 | - | |
| 111 | - if (series[0] && (series[0].type === 'date' || series[0].type === 'datetime')) { | |
| 112 | - axis = false; | |
| 113 | - switch (type) { | |
| 114 | - case 'line': | |
| 115 | - case 'area': | |
| 116 | - case 'scatter': | |
| 117 | - case 'candlestick': | |
| 118 | - case 'column': | |
| 119 | - axis = settings.hAxis; | |
| 120 | - break; | |
| 121 | - case 'bar': | |
| 122 | - axis = settings.vAxis; | |
| 123 | - break; | |
| 124 | - } | |
| 125 | - | |
| 126 | - if (axis) { | |
| 127 | - for (property in axis.viewWindow) { | |
| 128 | - date = new Date(axis.viewWindow[property]); | |
| 129 | - if (Object.prototype.toString.call(date) === "[object Date]") { | |
| 130 | - if (!isNaN(date.getTime())) { | |
| 131 | - axis.viewWindow[property] = date; | |
| 132 | - continue; | |
| 133 | - } | |
| 134 | - } | |
| 135 | - | |
| 136 | - delete axis.viewWindow[property]; | |
| 137 | - } | |
| 138 | - } | |
| 139 | - } | |
| 140 | - | |
| 141 | - for (i = 0; i < data.length; i++) { | |
| 142 | - row = []; | |
| 143 | - for (j = 0; j < series.length; j++) { | |
| 144 | - if (series[j].type === 'date' || series[j].type === 'datetime') { | |
| 145 | - date = new Date(data[i][j]); | |
| 146 | - data[i][j] = null; | |
| 147 | - if (Object.prototype.toString.call(date) === "[object Date]") { | |
| 148 | - if (!isNaN(date.getTime())) { | |
| 149 | - data[i][j] = date; | |
| 150 | - } | |
| 151 | - } | |
| 152 | - } | |
| 153 | - row.push(data[i][j]); | |
| 154 | - } | |
| 155 | - table.addRow(row); | |
| 156 | - } | |
| 157 | - | |
| 158 | - if (settings.series) { | |
| 159 | - for (i = 0; i < settings.series.length; i++) { | |
| 160 | - format = settings.series[i].format; | |
| 161 | - if (!format || format === '') { | |
| 162 | - continue; | |
| 163 | - } | |
| 164 | - | |
| 165 | - formatter = null; | |
| 166 | - switch (series[i + 1].type) { | |
| 167 | - case 'number': | |
| 168 | - formatter = new gv.NumberFormat({pattern: format}); | |
| 169 | - break; | |
| 170 | - case 'date': | |
| 171 | - case 'datetime': | |
| 172 | - case 'timeofday': | |
| 173 | - formatter = new gv.DateFormat({pattern: format}); | |
| 174 | - break; | |
| 175 | - } | |
| 176 | - | |
| 177 | - if (formatter) { | |
| 178 | - formatter.format(table, i + 1); | |
| 179 | - } | |
| 180 | - } | |
| 181 | - } | |
| 182 | - | |
| 183 | - chart.draw(table, settings); | |
| 62 | + $('body').trigger('visualizer:render:specificchart:start', {id: self.id, chart: chart, v: {page_type: 'post'}} ); | |
| 184 | 63 | } |
| 185 | 64 | }); |
| 186 | 65 | |
| 187 | 66 | /** |