/** * Created by martin on 1/7/17. */ let GraphModel = Backbone.Model.extend({}); let Graph = Backbone.View.extend({ tagName: 'div', initialize: function() { _.bindAll(this, 'update'); this.model.bind('change', this.update); this.text1ID ='graph-txt1'; this.lineID ='graph-line'; console.log('graph init'); //This.$indoorTemp = $('#indoorTemp'); //this.$fan = $('#fan'); // this.$fan.hide(); }, update: function() { console.log('Graph:Update'); const data = this.model.get('data'); var _data = data ; var ceilingLimit; var ceiling; ceiling = _data.reduce(function(p, v) { return (Math.abs(p) > Math.abs(v) ? Math.abs(p) : Math.abs(v)); }); console.dir(ceiling); var calcArray = []; ceilingLimit = (Math.ceil((Math.round(ceiling) + 1) / 1.5) * 1.5); if (ceilingLimit > 1000) { ceilingLimit = (Math.ceil((Math.round(ceiling) + 1) / 50) * 50); } var scale = 124 / ceilingLimit; // Var xstep = (280 - 46) / 100; var xstep = 2.34; var startX = 46 + (100 - _data.length) * xstep; for (var x = 0;x < _data.length;x++) { calcArray.push((startX + (x * xstep)).toFixed(2) + ',' + (136 - ((_data[x]) * scale)).toFixed(2)); } console.log(calcArray); var elm = document.getElementById(this.lineID); elm.setAttribute('points',calcArray.join(' ')); elm = document.getElementById(this.text1ID); elm.textContent = ceilingLimit; } });