← All changes | js/media/view.js +142 -38 4.0.4 → 3.0.10 View file →

		@@ -38,11 +38,12 @@
38	38	wpmV.apply(this, arguments);
39	39	},
40	40
41	41	render: function() {
42		- var self, model, chart;
	42	+ var self, model, chart, gv, type, series, data, table, settings, i, j, row, date, format, formatter, axis, property;
43	43
44	44	self = this;
	45	+ gv = google.visualization;
45	46	model = self.model;
46	47
47	48	self.$el
48	49	.width(self.options.width)
		@@ -48,34 +49,139 @@
48	49	.width(self.options.width)
49	50	.height(self.options.height)
50	51	.css('background-image', 'none');
51	52
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.code = model.get('code');
59		- chart.settings.width = self.options.width;
60		- chart.settings.height = self.options.height;
61		- $('#' + self.id).parent().append(model.get('css'));
	53	+ type = model.get('type');
	54	+ series = model.get('series');
	55	+ data = model.get('data');
	56	+ settings = model.get('settings');
62	57
63		- if ( chart.library && 'd3' === chart.library ) {
64		- $('body').trigger('visualizer:render:chart:start', {
65		- id: self.id,
66		- charts: {
67		- [self.id]: {
68		- library: 'd3',
69		- code: chart.code,
70		- series: chart.series,
71		- data: chart.data
	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	+ }
72	83	}
73	84	}
74		- });
75		- } else {
76		- $('body').trigger('visualizer:render:specificchart:start', {id: self.id, chart: chart, v: {page_type: 'post'}} );
	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;
77	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);
78	184	}
79	185	});
80	186
81	187	/**
		@@ -162,22 +268,20 @@
162	268	paginationView.render();
163	269	}
164	270
165	271	self.renderCollection();
166		- if (self.collection.length > 0) {
167		- $('.visualizer-library-chart').css('position', 'relative')
168		- .append($(
169		- // jshint ignore:start
170		- '<div class="visualizer-chart-bg"></div>'
171		- + '<div class="visualizer-chart-insert-bg">'
172		- + '<button class="button button-primary visualizer-library-chart-insert">' + visualizer.i10n.insert + '</button>'
173		- + '</div>'
174		- // jshint ignore:end
175		- ))
176		- .on('mouseover', function(){
177		- $(this).addClass('hover');
178		- });
179		- }
	272	+ $('.visualizer-library-chart').css('position', 'relative')
	273	+ .append($(
	274	+ // jshint ignore:start
	275	+ '<div class="visualizer-chart-bg"></div>'
	276	+ + '<div class="visualizer-chart-insert-bg">'
	277	+ + '<button class="button button-primary visualizer-library-chart-insert">' + visualizer.i10n.insert + '</button>'
	278	+ + '</div>'
	279	+ // jshint ignore:end
	280	+ ))
	281	+ .on('mouseover', function(){
	282	+ $(this).addClass('hover');
	283	+ });
180	284	content.unlock();
181	285	}
182	286	}
183	287	});
		@@ -419,5 +523,5 @@
419	523	});
420	524
421	525	return $(this);
422	526	};
423		-})(jQuery);
	527	+})(jQuery);