Related
Given an array of datapoints. I want to be able to count the occurrence of a datapoint x by the status of each point. The datapoint can exist more than once. The goal is to keep a count for each point and finally return an object of each point and the failure and successful count
For example. Given an array
const data = [
{
"x": 14,
"y": "1",
"created_at": "2021-04-14T14:23:59.825Z",
"status": "undelivered"
},
{
"x": 14,
"y": "1",
"created_at": "2021-04-14T14:27:51.666Z",
"status": "undelivered"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T10:34:07.317Z",
"status": "success"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T10:34:08.601Z",
"status": "undelivered"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T10:34:09.871Z",
"status": "undelivered"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T10:34:11.108Z",
"status": "undelivered"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T10:35:17.969Z",
"status": "pending"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T11:10:59.600Z",
"status": "pending"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T11:22:29.020Z",
"status": "pending"
},
{
"x": 15,
"y": "1",
"created_at": "2021-04-15T11:48:15.974Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T09:56:30.156Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:49:55.734Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:49:56.707Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:49:57.692Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:49:58.620Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:49:59.638Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T10:50:00.561Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T11:11:13.602Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T11:11:41.271Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T11:12:06.548Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T11:26:02.834Z",
"status": "pending"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T11:27:05.462Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T12:11:21.446Z",
"status": "undefined"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T12:12:18.397Z",
"status": "undelivered"
},
{
"x": 16,
"y": "1",
"created_at": "2021-04-16T12:22:05.958Z",
"status": "accepted"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:06:57.946Z",
"status": "undelivered"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:06:59.179Z",
"status": "undelivered"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:07:00.375Z",
"status": "undelivered"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:07:01.534Z",
"status": "undelivered"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:07:02.633Z",
"status": "undelivered"
},
{
"x": 18,
"y": "1",
"created_at": "2021-04-18T18:07:03.732Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:17.967Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:19.073Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:20.000Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:21.008Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:21.972Z",
"status": "undelivered"
},
{
"x": 20,
"y": "1",
"created_at": "2021-04-20T07:56:22.946Z",
"status": "undelivered"
}
]
I want to be able to get result as
result = {
14: {
failureCount: 2,
successCount : 0,
total: 2
},
15: {
failureCount: 7,
successCount : 1,
total: 8
}
.......
}
failureCount is incremented when status is not equal to delivered or success i.e
element.status !== "delivered" || element.status !== "success"
where element is the item in each array
successCount is incremented when status is equal to delivered or success i.e
element.status == "delivered" || element.status == "success"
where element is the item in each array
total is the summation of the y datapoint
Attempt
const map = {};
let failureCount = 0;
let successCount = 0;
data.forEach((element, index) => {
map[element.x] = {
failureCount: failureCount,
successCount: successCount
}
const failed = element.status !== "delivered" || element.status !== "success"
if(element.x in map && failed){
map[element.x] = {
failureCount: map[element.x].failureCount + 1
}
}else {
map[element.x] = {
successCount: map[element.x].successCount + 1
}
}
})
Based on the comments, came up with a slightly modified solution of my original attempt
const map = {};
data.forEach((element, index) => {
if(!map[element.x]){
map[element.x] = {
failureCount: 0,
successCount: 0
}
}
const failed = element.status !== "delivered" && element.status !== "success"
if(failed){
map[element.x].failureCount +=1
}else {
map[element.x].successCount +=1;
}
})
console.log(map)
Issues
The failure condition isn't right.
const failed = element.status !== "delivered" || element.status !== "success"
If element.status is 'success', failed will be true since element.status !== "delivered" returns true.
It should instead be
const failed = element.status !== 'delivered' && element.status !== 'success'
And you're reassigning map[element.x] every time. You should instead use the object if it exists in map or initialize it to a default object with the keys (failureCount, successCount, and total) set to 0.
Solution
You can use Array.prototype.reduce to create the result object. You can initialize the object for each element with { failureCount: 0, successCount: 0, total: 0 } if it doesn't already exist in the accumulator (acc) object. You can then increment failureCount if the status is failed or increment successCount. And then you can increment total.
const data = [ { "x": 14, "y": "1", "created_at": "2021-04-14T14:23:59.825Z", "status": "undelivered" }, { "x": 14, "y": "1", "created_at": "2021-04-14T14:27:51.666Z", "status": "undelivered" }, { "x": 15, "y": "1", "created_at": "2021-04-15T10:34:07.317Z", "status": "success" }, { "x": 15, "y": "1", "created_at": "2021-04-15T10:34:08.601Z", "status": "undelivered" }, { "x": 15, "y": "1", "created_at": "2021-04-15T10:34:09.871Z", "status": "undelivered" }, { "x": 15, "y": "1", "created_at": "2021-04-15T10:34:11.108Z", "status": "undelivered" }, { "x": 15, "y": "1", "created_at": "2021-04-15T10:35:17.969Z", "status": "pending" }, { "x": 15, "y": "1", "created_at": "2021-04-15T11:10:59.600Z", "status": "pending" }, { "x": 15, "y": "1", "created_at": "2021-04-15T11:22:29.020Z", "status": "pending" }, { "x": 15, "y": "1", "created_at": "2021-04-15T11:48:15.974Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T09:56:30.156Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:49:55.734Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:49:56.707Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:49:57.692Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:49:58.620Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:49:59.638Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T10:50:00.561Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T11:11:13.602Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T11:11:41.271Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T11:12:06.548Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T11:26:02.834Z", "status": "pending" }, { "x": 16, "y": "1", "created_at": "2021-04-16T11:27:05.462Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T12:11:21.446Z", "status": "undefined" }, { "x": 16, "y": "1", "created_at": "2021-04-16T12:12:18.397Z", "status": "undelivered" }, { "x": 16, "y": "1", "created_at": "2021-04-16T12:22:05.958Z", "status": "accepted" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:06:57.946Z", "status": "undelivered" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:06:59.179Z", "status": "undelivered" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:07:00.375Z", "status": "undelivered" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:07:01.534Z", "status": "undelivered" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:07:02.633Z", "status": "undelivered" }, { "x": 18, "y": "1", "created_at": "2021-04-18T18:07:03.732Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:17.967Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:19.073Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:20.000Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:21.008Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:21.972Z", "status": "undelivered" }, { "x": 20, "y": "1", "created_at": "2021-04-20T07:56:22.946Z", "status": "undelivered" } ]
const result = data.reduce((acc, { x, status }) => {
acc[x] = acc[x] || {
failureCount: 0,
successCount: 0,
total: 0,
}
const failed = status !== 'delivered' && status !== 'success'
if (failed) {
acc[x].failureCount += 1
} else {
acc[x].successCount += 1
}
acc[x].total += 1
return acc
}, {})
console.log(result)
Try this,
const data = <ACTUAL_DATA>
const map = {}
data.forEach(item => {
let curItem = map[item.x] || {
failureCount: 0,
successCount: 0,
total: 0
}
if (item.status == "delivered" || item.status == "success") {
curItem.successCount += 1
} else {
curItem.failureCount += 1
}
curItem.total += 1
map[item.x] = curItem
})
console.log(map)
How can i display the individual bars with a lighter color range based on the graph values. I came to know that vega has sequential multi-hue schemes.
Click here to check Image for MultiColor Scheme. I want to use this color scheme, for different values in the graph. For example, if i have value=3, then in the graph it should display lighter color as compared to the value=10. How can i include the multicolor scheme into the bar graph so it displays the color according to the value. Below is my snippet which i tried, i am actually looking for the color changing according to the amount instead of category. I included color in scales and in fill color in mark. Can someone guide me on how this can be achieved. I am new to this
{
"$schema": "https://vega.github.io/schema/vega/v5.json",
"description": "A basic bar chart example, with value labels shown upon mouse hover.",
"width": 400,
"height": 200,
"padding": 5,
"data": [
{
"name": "table",
"values": [
{"category": "A", "amount": 28},
{"category": "B", "amount": 55},
{"category": "C", "amount": 43},
{"category": "D", "amount": 91},
{"category": "E", "amount": 81},
{"category": "F", "amount": 53},
{"category": "G", "amount": 19},
{"category": "H", "amount": 87}
]
}
],
"signals": [
{
"name": "tooltip",
"value": {},
"on": [
{"events": "rect:mouseover", "update": "datum"},
{"events": "rect:mouseout", "update": "{}"}
]
}
],
"scales": [
{
"name": "xscale",
"type": "band",
"domain": {"data": "table", "field": "category"},
"range": "width",
"padding": 0.05,
"round": true
},
{
"name": "yscale",
"domain": {"data": "table", "field": "amount"},
"nice": true,
"range": "height"
},
{
"name": "color",
"type": "ordinal",
"domain": {"data": "table", "field": "category"},
"range": {"scheme": "category10"}
}
],
"axes": [
{ "orient": "bottom", "scale": "xscale" },
{ "orient": "left", "scale": "yscale" }
],
"marks": [
{
"type": "rect",
"from": {"data":"table"},
"encode": {
"enter": {
"x": {"scale": "xscale", "field": "category"},
"width": {"scale": "xscale", "band": 1},
"y": {"scale": "yscale", "field": "amount"},
"y2": {"scale": "yscale", "value": 0}
},
"update": {
"fill": {"value": "steelblue"}
},
"hover": {
"fill": {"value": "red"}
}
}
},
{
"type": "text",
"encode": {
"enter": {
"align": {"value": "center"},
"baseline": {"value": "bottom"},
"fill": {"scale": "color", "field": "category"}
},
"update": {
"x": {"scale": "xscale", "signal": "tooltip.category", "band": 0.5},
"y": {"scale": "yscale", "signal": "tooltip.amount", "offset": -2},
"text": {"signal": "tooltip.amount"},
"fillOpacity": [
{"test": "datum === tooltip", "value": 0},
{"value": 1}
]
}
}
}
]
}
Update: I found out that i have added the fill color in type='text' in mark property, instead of type='rect'
"fill": {"scale": "color", "field": "category"}.
{
"$schema": "https://vega.github.io/schema/vega/v5.json",
"description": "A basic bar chart example, with value labels shown upon mouse hover.",
"width": 400,
"height": 200,
"padding": 5,
"data": [
{
"name": "table",
"values": [
{"category": "A", "amount": 28},
{"category": "B", "amount": 55},
{"category": "C", "amount": 43},
{"category": "D", "amount": 91},
{"category": "E", "amount": 81},
{"category": "F", "amount": 53},
{"category": "G", "amount": 19},
{"category": "H", "amount": 87}
]
}
],
"signals": [
{
"name": "tooltip",
"value": {},
"on": [
{"events": "rect:mouseover", "update": "datum"},
{"events": "rect:mouseout", "update": "{}"}
]
}
],
"scales": [
{
"name": "xscale",
"type": "band",
"domain": {"data": "table", "field": "category"},
"range": "width",
"padding": 0.05,
"round": true
},
{
"name": "yscale",
"domain": {"data": "table", "field": "amount"},
"nice": true,
"range": "height"
},
{
"name": "color",
"type": "ordinal",
"domain": {"data": "table", "field": "category"},
"range": {"scheme": "category10"}
}
],
"axes": [
{ "orient": "bottom", "scale": "xscale" },
{ "orient": "left", "scale": "yscale" }
],
"marks": [
{
"type": "rect",
"from": {"data":"table"},
"encode": {
"enter": {
"x": {"scale": "xscale", "field": "category"},
"width": {"scale": "xscale", "band": 1},
"y": {"scale": "yscale", "field": "amount"},
"y2": {"scale": "yscale", "value": 0}
},
"update": {
"fill": {"scale": "color", "field": "category"}
},
"hover": {
"fill": {"value": "red"}
}
}
},
{
"type": "text",
"encode": {
"enter": {
"align": {"value": "center"},
"baseline": {"value": "bottom"}
},
"update": {
"x": {"scale": "xscale", "signal": "tooltip.category", "band": 0.5},
"y": {"scale": "yscale", "signal": "tooltip.amount", "offset": -2},
"text": {"signal": "tooltip.amount"},
"fillOpacity": [
{"test": "datum === tooltip", "value": 0},
{"value": 1}
]
}
}
}
]
}
In short, I have events that have data (y) and timestamp (t) and I want to show them on the chart.
Currently, if I have three events:
10:00 AM: 42
11:00 AM: 43
11:20 AM: 44
The chart won't show there is a gap (I refer to the gap of one hour) of data but will simply connect them.
For example, there is a gap between 10PM and 5AM in the following example.
Is there an option to automatically display 0 values if the gap between two points is more than X seconds?
var ctx = document.getElementById('chart').getContext("2d");
var data = [
{
"y": "0.58",
"t": 1565665819571
},
{
"y": "0.84",
"t": 1565665218436
},
{
"y": "1.69",
"t": 1565664625228
},
{
"y": "0.24",
"t": 1565640019245
},
{
"y": "0.24",
"t": 1565639418937
},
{
"y": "0.25",
"t": 1565638819713
},
{
"y": "0.25",
"t": 1565638219190
},
{
"y": "0.23",
"t": 1565637619961
},
{
"y": "0.24",
"t": 1565637018574
},
{
"y": "0.24",
"t": 1565636426432
},
{
"y": "0.24",
"t": 1565635825187
},
{
"y": "0.25",
"t": 1565635218607
},
{
"y": "0.25",
"t": 1565634618853
},
{
"y": "0.26",
"t": 1565634020604
},
{
"y": "0.26",
"t": 1565633419088
},
{
"y": "0.27",
"t": 1565632819216
},
{
"y": "0.27",
"t": 1565632218830
},
{
"y": "0.28",
"t": 1565631620692
},
{
"y": "0.29",
"t": 1565631019620
},
{
"y": "0.29",
"t": 1565630418738
},
{
"y": "0.30",
"t": 1565629818050
},
{
"y": "0.31",
"t": 1565629218872
},
{
"y": "0.33",
"t": 1565628126871
}
]
var chart = new Chart(ctx, {
"type": "line",
"data": {
"datasets": [
{
"label": "Foo",
"backgroundColor": "lightblue",
"borderColor": "blue",
"data": data,
"type": "line",
"pointRadius": 0,
"fill": false,
"lineTension": 0,
"borderWidth": 2,
"spanGaps": false
}
]
},
"options": {
"scales": {
"xAxes": [
{
"type": "time",
"distribution": "series",
"ticks": {
"source": "data",
"autoSkip": true
}
}
],
"yAxes": [
{
"scaleLabel": {
"display": true,
"labelString": "Y"
}
}
]
},
"tooltips": {
"intersect": false,
"mode": "index",
"callbacks": {}
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js"></script>
<canvas id="chart"></canvas>
Since v3 chart.js has an ability to set spanGap as a number, determining the maximum gap to span. So in this case, 1 hour gap can be used in order to keep the data points connected, but at the same time have a gap between 11pm and 5 am
Docs: https://www.chartjs.org/docs/latest/charts/line.html#line-styling
Official example: https://www.chartjs.org/docs/latest/samples/scales/time-max-span.html
Here's the adjusted code:
const ctx = document.getElementById('chart');
const data = [{
"y": "0.58",
"x": 1565665819571,
},
{
"y": "0.84",
"x": 1565665218436,
},
{
"y": "1.69",
"x": 1565664625228
},
{
"y": "0.24",
"x": 1565640019245
},
{
"y": "0.24",
"x": 1565639418937
},
{
"y": "0.25",
"x": 1565638819713
},
{
"y": "0.25",
"x": 1565638219190
},
{
"y": "0.23",
"x": 1565637619961
},
{
"y": "0.24",
"x": 1565637018574
},
{
"y": "0.24",
"x": 1565636426432
},
{
"y": "0.24",
"x": 1565635825187
},
{
"y": "0.25",
"x": 1565635218607
},
{
"y": "0.25",
"x": 1565634618853
},
{
"y": "0.26",
"x": 1565634020604
},
{
"y": "0.26",
"x": 1565633419088
},
{
"y": "0.27",
"x": 1565632819216
},
{
"y": "0.27",
"x": 1565632218830
},
{
"y": "0.28",
"x": 1565631620692
},
{
"y": "0.29",
"x": 1565631019620
},
{
"y": "0.29",
"x": 1565630418738
},
{
"y": "0.30",
"x": 1565629818050
},
{
"y": "0.31",
"x": 1565629218872
},
{
"y": "0.33",
"x": 1565628126871
}
]
const chart = new Chart(ctx, {
"type": "line",
"data": {
datasets: [{
label: 'Foo',
backgroundColor: "lightblue",
borderColor: "blue",
fill: false,
data: data,
pointRadius: 0,
spanGaps: 1000 * 60 * 60, // 1 hour
}]
},
options: {
responsive: true,
scales: {
xAxis: {
type: "time"
}
},
"tooltips": {
"intersect": false,
"mode": "index",
"callbacks": {}
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.2.0/chart.umd.js"></script>
<script src="https://cdn.jsdelivr.net/npm/luxon#^2"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-luxon#^1"></script>
<canvas id="chart"></canvas>
I need help with increments in Node Red (on Raspberry Pi). I am trying to make a smart thermostat with a LCD touchscreen and an app for remote access (ex. coming home on a cold winter day and want to start heating your apartment).
Some suggestions on how to connect to the Raspberry Pi over the Internet (not local network) with an android and a link on a tutorial or example would be much appreciated.
P.S. I am doing this for a friend and I promised him some good results.
Sorry for messy code... => cleaned it up in the edit
I have tried everything I could think of to make my code work as I am not very experienced with NodeRed nor JS.
Global variables May just do the trick... I haven't figured it out yet...
Another barrier I have encountered is the ability to access and interact with the code outside the local network.
[
{
"id": "9f63513b.e227a",
"type": "ui_slider",
"z": "f216bae9.be3b68",
"name": "",
"label": "",
"group": "b344cd03.40f29",
"order": 2,
"width": "0",
"height": "0",
"passthru": true,
"topic": "slide",
"min": "10",
"max": "45",
"step": 1,
"x": 650,
"y": 140,
"wires": [
[
"4e35591.c5466a8",
"ef681f9b.17845"
]
]
},
{
"id": "4e35591.c5466a8",
"type": "delay",
"z": "f216bae9.be3b68",
"name": "Buffer",
"pauseType": "queue",
"timeout": "5",
"timeoutUnits": "seconds",
"rate": "1",
"nbRateUnits": "1",
"rateUnits": "second",
"randomFirst": "1",
"randomLast": "5",
"randomUnits": "seconds",
"drop": true,
"x": 810,
"y": 60,
"wires": [
[
"eec05221.3091e"
]
]
},
{
"id": "82848cf2.b33d1",
"type": "function",
"z": "f216bae9.be3b68",
"name": "delete payload",
"func": "msg.buton = msg.payload;\ndelete msg.payload;\nmsg.incalzire=msg.buton;\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 480,
"y": 240,
"wires": [
[
"9f63513b.e227a"
]
]
},
{
"id": "ef681f9b.17845",
"type": "ui_gauge",
"z": "f216bae9.be3b68",
"name": "",
"group": "b344cd03.40f29",
"order": 1,
"width": 0,
"height": 0,
"gtype": "gage",
"title": "",
"label": "",
"format": "{{value}}",
"min": "0",
"max": "60",
"colors": [
"#00b500",
"#e6e600",
"#ca3838"
],
"seg1": "",
"seg2": "",
"x": 810,
"y": 220,
"wires": []
},
{
"id": "eec05221.3091e",
"type": "function",
"z": "f216bae9.be3b68",
"name": "delete payload",
"func": "msg.tempslide=msg.payload;\ndelete msg.payload;\n\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 1000,
"y": 60,
"wires": [
[
"f5853672.5fe148"
]
]
},
{
"id": "6b57c137.8c136",
"type": "function",
"z": "f216bae9.be3b68",
"name": "Switch",
"func": "if(msg.payload===0){\n msg.payload=1;\n}\nelse if (msg.payload==1){\n msg.payload=0;\n}\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 310,
"y": 460,
"wires": [
[
"82848cf2.b33d1"
]
]
},
{
"id": "f5853672.5fe148",
"type": "function",
"z": "f216bae9.be3b68",
"name": "working mess",
"func": "if (msg.incalzire===0||msg.payload===0){\n\nif (msg.temp<=msg.tempslide){\n msg.payload=0;\n}\n\nelse if (msg.temp>msg.tempslide){\n msg.payload=1;\n}\n\nelse{\n msg.payload=1;}\n \n}\n\n\nelse{\n msg.payload=1;\n \n}\n\n\n\n\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 1058,
"y": 140,
"wires": [
[
"3f6977e5.b44158",
"ee3a7840.808ad8",
"7726596c.b74228"
]
]
},
{
"id": "d34a3234.79712",
"type": "ui_switch",
"z": "f216bae9.be3b68",
"name": "",
"label": "Override Window",
"group": "b344cd03.40f29",
"order": 4,
"width": 0,
"height": 0,
"passthru": true,
"decouple": "false",
"topic": "",
"style": "",
"onvalue": "1",
"onvalueType": "num",
"onicon": "",
"oncolor": "",
"offvalue": "0",
"offvalueType": "num",
"officon": "",
"offcolor": "",
"x": 250,
"y": 420,
"wires": [
[
"6b57c137.8c136"
]
]
},
{
"id": "3f6977e5.b44158",
"type": "debug",
"z": "f216bae9.be3b68",
"name": "",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "true",
"x": 1293,
"y": 140,
"wires": []
},
{
"id": "ee3a7840.808ad8",
"type": "function",
"z": "f216bae9.be3b68",
"name": "Message",
"func": "if(msg.payload===0){\n msg.payload='PORNITA'; //ON\n}\nelse if (msg.payload==1){\n msg.payload='OPRITA'; //OFF\n}\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 1183,
"y": 340,
"wires": [
[
"eaeac5fb.c27728"
]
]
},
{
"id": "7726596c.b74228",
"type": "rpi-gpio out",
"z": "f216bae9.be3b68",
"name": "Rel1",
"pin": "22",
"set": "",
"level": "0",
"freq": "",
"out": "out",
"x": 1233,
"y": 220,
"wires": []
},
{
"id": "c0784b3b.c1fcb8",
"type": "function",
"z": "f216bae9.be3b68",
"name": "Switch",
"func": "if(msg.payload===0){\n msg.payload=1;\n}\nelse if (msg.payload==1){\n msg.payload=0;\n}\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 250,
"y": 380,
"wires": [
[
"d34a3234.79712"
]
]
},
{
"id": "eaeac5fb.c27728",
"type": "ui_text",
"z": "f216bae9.be3b68",
"group": "b344cd03.40f29",
"order": 3,
"width": 0,
"height": 0,
"name": "",
"label": "Incalzirea este",
"format": "{{msg.payload}}",
"layout": "row-right",
"x": 1220,
"y": 380,
"wires": []
},
{
"id": "248c4825.00c018",
"type": "rpi-gpio in",
"z": "f216bae9.be3b68",
"name": "",
"pin": "40",
"intype": "tri",
"debounce": "25",
"read": false,
"x": 90,
"y": 300,
"wires": [
[
"c0784b3b.c1fcb8"
]
]
},
{
"id": "afb8009a.49841",
"type": "function",
"z": "f216bae9.be3b68",
"name": "delete payload",
"func": "//nu umbla la asta\nmsg.temp=msg.payload;\ndelete msg.payload;\nreturn msg;",
"outputs": 1,
"noerr": 0,
"x": 320,
"y": 140,
"wires": [
[
"c0784b3b.c1fcb8"
]
]
},
{
"id": "c696dbbc.58ee98",
"type": "rpi-dht22",
"z": "f216bae9.be3b68",
"name": "",
"topic": "Interior",
"dht": "22",
"pintype": "1",
"pin": "29",
"x": 140,
"y": 180,
"wires": [
[
"afb8009a.49841",
"33ec6fb6.fda7f"
]
]
},
{
"id": "33ec6fb6.fda7f",
"type": "ui_gauge",
"z": "f216bae9.be3b68",
"name": "",
"group": "d2bfb34b.1c943",
"order": 1,
"width": 0,
"height": 0,
"gtype": "gage",
"title": "",
"label": "° C",
"format": "{{value}}",
"min": 0,
"max": "60",
"colors": [
"#00b500",
"#e6e600",
"#ca3838"
],
"seg1": "",
"seg2": "",
"x": 150,
"y": 220,
"wires": []
},
{
"id": "d3a6bff.b99a44",
"type": "inject",
"z": "f216bae9.be3b68",
"name": "",
"topic": "",
"payload": "",
"payloadType": "date",
"repeat": "50",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"x": 110,
"y": 120,
"wires": [
[
"c696dbbc.58ee98"
]
]
},
{
"id": "b344cd03.40f29",
"type": "ui_group",
"z": "",
"name": "Reglarea Incalzirii",
"tab": "af80de11.bfd15",
"order": 2,
"disp": true,
"width": "6",
"collapse": true
},
{
"id": "d2bfb34b.1c943",
"type": "ui_group",
"z": "",
"name": "Temperatura Curenta",
"tab": "af80de11.bfd15",
"order": 1,
"disp": true,
"width": "6",
"collapse": true
},
{
"id": "af80de11.bfd15",
"type": "ui_tab",
"z": "",
"name": "Sergiu",
"icon": "fa-thermometer-full",
"order": 4
}
]
The old thermostat was basically an automated relay switch. I have to make it smart and my best bet is a raspberry pi.
The increment part can replace the slider(I have Backups) and has to be triggered by a button in the Dashboard UI.
Everything except of what I mentioned works corectly.
Thank you for your help!! (or at least your time)
I am trying to plot the heatmap using 'heatmap js' library .
For some value of inputs if the min value is 0 and max value is 1 then whole heatmap will be red instead of plotting actual values.
It works fine if the max value is other than 1 (ex. min: 0, max 2 or min:0 , max: 3) but only for this case the heatmap fails to map the data.
var data = null;
/* this set of data works fine though */
values = [{
"uid": "1",
"x": 100,
"y": 200,
"value": 0
},
{
"uid": "2",
"x": 100,
"y": 220,
"value": 0
},
{
"uid": "22",
"x": 100,
"y": 240,
"value": 0
},
{
"uid": "30",
"x": 100,
"y": 260,
"value": 0
},
{
"uid": "39",
"x": 100,
"y": 280,
"value": 0
},
{
"uid": "70",
"x": 100,
"y": 300,
"value": 1
},
{
"uid": "75",
"x": 120,
"y": 200,
"value": 0
},
{
"uid": "84",
"x": 140,
"y": 200,
"value": 1
},
{
"uid": "85",
"x": 160,
"y": 200,
"value": 1
},
{
"uid": "104",
"x": 180,
"y": 200,
"value": 0
},
{
"uid": "105",
"x": 200,
"y": 200,
"value": 0
}
];
var heatmap = h337.create({
container: $("#testcanvas").get(0)
});
data = {
max: 1,
min: 0,
data: values
}
heatmap.setData(data);
heatmap.repaint();
#testcanvas {
width: 600px;
height: 600px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/pa7/heatmap.js/master/build/heatmap.js"></script>
<div id="testcanvas"></div>
If I understand correctly your problem then I guess Script understand 0 = false and 1 = true so you need to pass 0 as "0" and 1 as "1"
var data = null;
/* this set of data works fine though */
values = [{
"uid": "1",
"x": 100,
"y": 200,
"value": "0"
},
{
"uid": "2",
"x": 100,
"y": 220,
"value": "0"
},
{
"uid": "22",
"x": 100,
"y": 240,
"value": "0"
},
{
"uid": "30",
"x": 100,
"y": 260,
"value": "0"
},
{
"uid": "39",
"x": 100,
"y": 280,
"value": "0"
},
{
"uid": "70",
"x": 100,
"y": 300,
"value": "1"
},
{
"uid": "75",
"x": 120,
"y": 200,
"value": "0"
},
{
"uid": "84",
"x": 140,
"y": 200,
"value": "1"
},
{
"uid": "85",
"x": 160,
"y": 200,
"value": "1"
},
{
"uid": "104",
"x": 180,
"y": 200,
"value": "0"
},
{
"uid": "105",
"x": 200,
"y": 200,
"value": "0"
}
];
var heatmap = h337.create({
container: $("#testcanvas").get(0)
});
data = {
max: "1",
min: "0",
data: values
}
heatmap.setData(data);
heatmap.repaint();
#testcanvas {
width: 600px;
height: 600px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/pa7/heatmap.js/master/build/heatmap.js"></script>
<div id="testcanvas"></div>