Use value of variable in javascript? - javascript

I'm trying to do a WEB based power management system and I'm using PLC Siemens S7-1200. I want to use some tags from PLC in javascript to build a chart. When I use:
var chartData = [{
country: "USA",
visits: 230
}, ];
In chart code this works fine.
Now I want to use instead of the fixed numeric value "230" a variable value with the label "Voltage" as tag in the PLC. How can I do this?


If you have the value in the variable voltage, just use that variable in the object:
var chartData = [{
country: "USA",
visits: voltage
} ];
DEMO

Related

Editing an object in nested data structure

I have a data structure like this:
var fieldTmp= [{
"CountryDetails":[{
"countryName":"Kerala",
"JobDetails":[{
"RequisitionId":"00020447961",
"City":"KOCHI",
"PostedDate":"2016-12-18"
},{
"RequisitionId":"26103",
"City":"TRIVANDRUM",
"PostedDate":"2016-12-12"
},{
"RequisitionId":"26077",
"City":"ALAPPEY",
"PostedDate":"2016-10-09"
},{
"RequisitionId":"00020774701",
"City":"KOTTAYAM",
"PostedDate":"2016-06-12"
},{
"RequisitionId":"26078",
"City":"ADOOR",
"PostedDate":"2016-05-19"}]
},
"countryName":"MADRAS",
"JobDetails":[{
"RequisitionId":"0025456",
"City":"CHENNAI",
"PostedDate":"2017-06-05"
},{
"RequisitionId":"69847562",
"City":"ADYAR",
"PostedDate":"2016-10-14"}]
},
{"countryName":"Tamil Nadu",
"JobDetails":[{
"RequisitionId":"00020550501",
"City":"CHENNAI",
"PostedDate":"2016-12-18"
},{
"RequisitionId":"00020786022",
"City":"KOVAI",
"PostedDate":"2016-09-01"
},{
"RequisitionId":"00020786071",
"City":"TRICHY",
"PostedDate":"2016-04-10"}]
}] }]
My requirement is, I need to add Job Details under MADRAS to Tamil Nadu and I need to sort the data based on one property -PostedDate.
So my result should be something like,
var fieldTmp= [{
"CountryDetails":[{
"countryName":"Kerala",
"JobDetails":[{
"RequisitionId":"00020447961",
"City":"KOCHI",
"PostedDate":"2016-12-18"
},{
"RequisitionId":"26103",
"City":"TRIVANDRUM",
"PostedDate":"2016-12-12"
},{
"RequisitionId":"26077",
"City":"ALAPPEY",
"PostedDate":"2016-10-09"
},{
"RequisitionId":"00020774701",
"City":"KOTTAYAM",
"PostedDate":"2016-06-12"
},{
"RequisitionId":"26078",
"City":"ADOOR",
"PostedDate":"2016-05-19"}]
},
{"countryName":"Tamil Nadu",
"JobDetails":[{
"RequisitionId":"0025456",
"City":"CHENNAI",
"PostedDate":"2017-06-05"
},{
"RequisitionId":"00020550501",
"City":"CHENNAI",
"PostedDate":"2016-12-18"
},{
"RequisitionId":"69847562",
"City":"ADYAR",
"PostedDate":"2016-10-14"
},{
"RequisitionId":"00020786022",
"City":"KOVAI",
"PostedDate":"2016-09-01"
},{
"RequisitionId":"00020786071",
"City":"TRICHY",
"PostedDate":"2016-04-10"}]
}] }]
I tried to extract Madras data and add that to under Tamil Nadu. But nothing is working.
I know how to extract single or multiple value from JSON object. But I need to edit that JSON and sort it. That I am able to do it.

I got the solution.
When the countryName is "Tamil Nadu" and "MADRAS",I extracted all the data and saved it in a new array using below code.
function mergingBothStateDetails(jsonJobDetails){
for(var j=0;j<jsonJobDetails.length;j++)
{
newTmpRecord.push({"RequisitionId":jsonJobDetails[j].RequisitionId,
"PostedDate":jsonJobDetails[j].PostedDate,
"City":jsonJobDetails[j].City});
}
}
Here newTmpRecord is an Array and is like universal variable
For sorting I used below codes
function sortNewList(){
newTmpRecord.sort(function(a, b){ // sort object by retirement date
var dateA=new Date(a.PostedDate), dateB=new Date(b.PostedDate)
return dateB-dateA //sort by date descending
});
}

You can simply extract the object "Madras" from the array and add all of its Jobdetails to the object "Tamil Nadu" in a for loop. You can either look where to add them in the loop by checking the dates, or you can write a sort function, which is pretty easy in javascript and well explained here:
You might want to look up objects
And here the sorting is explained.

How to assign value to javascript variable in django

I was trying to assign value to a javascript variable in django. I need the value of javascript variable like.
var chartData = [{
section: "Czech Republic",
attempted: 301.90
}, {
section: "Ireland",
attempted: 201.10
}];
In my django view I am using the following code to generate and render the json data.
i = 0
chart1Data = []
while(i<len(totalSectionsJson)):
chart1Data.append({'section':totalSectionsJson[i].encode('utf8'),'attempted':sectionTotalAttempted[i]})
i = i+1
chart1DataExport = json.dumps(chart1Data)
In the template I am using var chartData = {{chart1Data|safe}}; to assign the javascript variable. But I am getting the data like
var chartData = [{"attempted": 0, "section": "section"}, {"attempted": 0, "section": "section2"}, {"attempted": 0, "section": "section3"}];
I need to eliminate the quotes from attempted and section. How can I do that?

JSON - Accessing JSON Array and assigning variables

I have the following JSON in a file called census.json:
{
"areas": [
"UnitedStates", [{
"STATEORREGION": "United States",
"1910POPULATION": 92228531,
"1920POPULATION": 106021568,
"1930POPULATION": 123202660,
"1940POPULATION": 132165129,
"1950POPULATION": 151325798,
"1960POPULATION": 179323175,
"1970POPULATION": 203211926,
"1980POPULATION": 226545805,
"1990POPULATION": 248709873,
"2000POPULATION": 281421906,
"2010POPULATION": 308745538,
"1910CHANGE": 21,
"1920CHANGE": 15,
"1930CHANGE": 16.2,
"1940CHANGE": 7.3,
"1950CHANGE": 14.5,
"1960CHANGE": 18.5,
"1970CHANGE": 13.3,
"1980CHANGE": 11.5,
"1990CHANGE": 9.8,
"2000CHANGE": 13.2,
"2010CHANGE": 9.7
}],
"Alabama", [{
"STATEORREGION": "Alabama",
"1910POPULATION": 2138093,
"1920POPULATION": 2348174,
"1930POPULATION": 2646248,
"1940POPULATION": 2832961,
"1950POPULATION": 3061743,
"1960POPULATION": 3266740,
"1970POPULATION": 3444165,
"1980POPULATION": 3893888,
"1990POPULATION": 4040587,
"2000POPULATION": 4447100,
"2010POPULATION": 4779736,
"1910CHANGE": 16.9,
"1920CHANGE": 9.8,
"1930CHANGE": 12.7,
"1940CHANGE": 7.1,
"1950CHANGE": 8.1,
"1960CHANGE": 6.7,
"1970CHANGE": 5.4,
"1980CHANGE": 13.1,
"1990CHANGE": 3.8,
"2000CHANGE": 10.1,
"2010CHANGE": 7.5
}],
"Alaska", [{
"STATEORREGION": "Alaska",
"1910POPULATION": 64356,
"1920POPULATION": 55036,
"1930POPULATION": 59278,
"1940POPULATION": 72524,
"1950POPULATION": 128643,
"1960POPULATION": 226167,
"1970POPULATION": 300382,
"1980POPULATION": 401851,
"1990POPULATION": 550043,
"2000POPULATION": 626932,
"2010POPULATION": 710231,
"1910CHANGE": 1.2,
"1920CHANGE": -14.5,
"1930CHANGE": 7.7,
"1940CHANGE": 22.3,
"1950CHANGE": 77.4,
"1960CHANGE": 75.8,
"1970CHANGE": 32.8,
"1980CHANGE": 33.8,
"1990CHANGE": 36.9,
"2000CHANGE": 14,
"2010CHANGE": 13.3
}], ]
}
I am trying to access the different values stored in the array using the following:
$.getJSON("../data/census.json", function (json) {
var censusData = json;
console.log(censusData.areas);
});
This logs all the states to the console as an object, so I then tried to go down another level with:
$.getJSON("../data/census.json", function (json) {
var censusData = json;
console.log(censusData.areas.UnitedStates);
});
but this returns "undefined". How can I drill down another level? Ideally I would like to access each states population for a specific year and then assign it to a variable that I can use later.

the pattern here is after each string name we have an array of related information:
so you can convert it to an object like
var _result = {};
for ( var i=0;i<arr.length/2;i++){
_result[arr[i]] = arr[i+1];
}
then you can directly access those information by their string names
like this
censusData.areas.UnitedStates
will return an array after this transformation

There is currently no second level as there are commas instead of colons between the state names and their properties:
"Alaska", [{
"STATEORREGION":"Alaska",
"1910POPULATION":64356,
...
This makes the values "Alaska" and the dictionary of properties adjacent elements in a list. It seems what you want is:
"Alaska": [{
"STATEORREGION":"Alaska",
"1910POPULATION":64356,
...

your json data is invalid try this,
{"areas" : [
"UnitedStates", [{
"STATEORREGION":"United States",
"1910POPULATION":92228531,
"1920POPULATION":106021568,
"1930POPULATION":123202660,
"1940POPULATION":132165129,
"1950POPULATION":151325798,
"1960POPULATION":179323175,
"1970POPULATION":203211926,
"1980POPULATION":226545805,
"1990POPULATION":248709873,
"2000POPULATION":281421906,
"2010POPULATION":308745538,
"1910CHANGE":21,
"1920CHANGE":15,
"1930CHANGE":16.2,
"1940CHANGE":7.3,
"1950CHANGE":14.5,
"1960CHANGE":18.5,
"1970CHANGE":13.3,
"1980CHANGE":11.5,
"1990CHANGE":9.8,
"2000CHANGE":13.2,
"2010CHANGE":9.7
}],
"Alabama", [{
"STATEORREGION":"Alabama",
"1910POPULATION":2138093,
"1920POPULATION":2348174,
"1930POPULATION":2646248,
"1940POPULATION":2832961,
"1950POPULATION":3061743,
"1960POPULATION":3266740,
"1970POPULATION":3444165,
"1980POPULATION":3893888,
"1990POPULATION":4040587,
"2000POPULATION":4447100,
"2010POPULATION":4779736,
"1910CHANGE":16.9,
"1920CHANGE":9.8,
"1930CHANGE":12.7,
"1940CHANGE":7.1,
"1950CHANGE":8.1,
"1960CHANGE":6.7,
"1970CHANGE":5.4,
"1980CHANGE":13.1,
"1990CHANGE":3.8,
"2000CHANGE":10.1,
"2010CHANGE":7.5
}],
"Alaska", [{
"STATEORREGION":"Alaska",
"1910POPULATION":64356,
"1920POPULATION":55036,
"1930POPULATION":59278,
"1940POPULATION":72524,
"1950POPULATION":128643,
"1960POPULATION":226167,
"1970POPULATION":300382,
"1980POPULATION":401851,
"1990POPULATION":550043,
"2000POPULATION":626932,
"2010POPULATION":710231,
"1910CHANGE":1.2,
"1920CHANGE":-14.5,
"1930CHANGE":7.7,
"1940CHANGE":22.3,
"1950CHANGE":77.4,
"1960CHANGE":75.8,
"1970CHANGE":32.8,
"1980CHANGE":33.8,
"1990CHANGE":36.9,
"2000CHANGE":14,
"2010CHANGE":13.3
}]
]
}

So I was able to access the data by changing the structure of the JSON to the following:
{"areas" : [
[{
"STATEORREGION":"United States",
"POPULATION1910":92228531,
"1920POPULATION":106021568,
"1930POPULATION":123202660,
"1940POPULATION":132165129,
"1950POPULATION":151325798,
"1960POPULATION":179323175,
"1970POPULATION":203211926,
"1980POPULATION":226545805,
"1990POPULATION":248709873,
"2000POPULATION":281421906,
"2010POPULATION":308745538,
"1910CHANGE":21,
"1920CHANGE":15,
"1930CHANGE":16.2,
"1940CHANGE":7.3,
"1950CHANGE":14.5,
"1960CHANGE":18.5,
"1970CHANGE":13.3,
"1980CHANGE":11.5,
"1990CHANGE":9.8,
"2000CHANGE":13.2,
"2010CHANGE":9.7
}],
[{
"STATEORREGION":"Alabama",
"1910POPULATION":2138093,
"1920POPULATION":2348174,
"1930POPULATION":2646248,
"1940POPULATION":2832961,
"1950POPULATION":3061743,
"1960POPULATION":3266740,
"1970POPULATION":3444165,
"1980POPULATION":3893888,
"1990POPULATION":4040587,
"2000POPULATION":4447100,
"2010POPULATION":4779736,
"1910CHANGE":16.9,
"1920CHANGE":9.8,
"1930CHANGE":12.7,
"1940CHANGE":7.1,
"1950CHANGE":8.1,
"1960CHANGE":6.7,
"1970CHANGE":5.4,
"1980CHANGE":13.1,
"1990CHANGE":3.8,
"2000CHANGE":10.1,
"2010CHANGE":7.5
}],
[{
"STATEORREGION":"Alaska",
"1910POPULATION":64356,
"1920POPULATION":55036,
"1930POPULATION":59278,
"1940POPULATION":72524,
"1950POPULATION":128643,
"1960POPULATION":226167,
"1970POPULATION":300382,
"1980POPULATION":401851,
"1990POPULATION":550043,
"2000POPULATION":626932,
"2010POPULATION":710231,
"1910CHANGE":1.2,
"1920CHANGE":-14.5,
"1930CHANGE":7.7,
"1940CHANGE":22.3,
"1950CHANGE":77.4,
"1960CHANGE":75.8,
"1970CHANGE":32.8,
"1980CHANGE":33.8,
"1990CHANGE":36.9,
"2000CHANGE":14,
"2010CHANGE":13.3
}]
]
}
Then I used:
$.getJSON( "../data/census.json", function( json ) {
var censusData = json;
console.log(censusData.areas[0][0].POPULATION1910);
});
Also note that I had to change 1910POPULATION to POPULATION1910 in order to access it without getting an error. There may be a better way to do this than changing every key name for every state.
When I want to access the next state I just changed censusData[0][0] to censusData[1][0] and so on and so forth.

The string "United States" is the first element in a list.
The data for The United States is in censusData.areas[1]. The structure of the JSON looks a bit strange.

Create object array javascript

I have inherited a project and need to recreate an object in this format (dynamically) but have not sure how to do it. This is what I tried and it's almost there:
//this creates [{ "Country": ["Canada", "United States of America"] }]
filters = [];
var object = {};
object.Country = [];
object.Country.push('Canada', 'United States of America');
filters.push(object);
//alert(JSON.stringify(filters));
console.log(JSON.stringify(filters));
//currently getting this
//filters = [{ "Country": ["Canada", "United States of America"] }]
//need this
//filters = { 'Country': ['Canada', 'United States of America'] };
I have a form where the user will select the column in a table (Country) and then enter one or more countries. Currently the filter works based on the hard coded object above. I need to now change the object on the fly for other columns.
Any help would be much appreciated.

Write JSON parser to format data for pie chart (HighCharts)

I was fighting with HighCharts quite some hours for formatting the data input to the series option.
Finally I saw the link here solved my problem for data formatting and input.
The data format that would be recognized by HighCharts pie chart is like this (format 1) as indicated by the link above:
[["chrome",15],["firefox",20]]
I actually want dynamic data input from external URL and format the data so that HighCharts can recognized it. The data format I got from the URL is like this (format 2):
[
{
"status": "Stopped \/ Idle",
"val": 17.469444444444,
}, {
"status": "Working",
"val": 0,
}, {
"status": "Headland Turning",
"val": 0,
}, {
"status": "Transport",
"val": 0.15333333333333,
}
]
which is already in JSON format.
I just want to know that is that necessary for me to write a parser for the data from format 2 to format 1? Or Am I missing something that HighCharts can recognize the JSON format data and I don't actually need to write a parser?
I am new to HighCharts so feel free to point that out if some of my problem description does not make sense..Thank you!
EDIT: Thanks for all guys answering my question!

When a script expects data in specific format, you often have to map your data to fit format. This can be modified in server code or using javascript
Can use jQuery $.map to reconfigure an object or array to another array.
DEMO: http://jsfiddle.net/qpsSe/1
Note that trailing commas in sample JSON need removing to validate JSON
/* "json" is your response object, modify variable names to match */
var chartData=$.map( json, function( obj,i){
return [[ obj.status, obj.val]];
})
$.map API Docs
Alternate method in native javascript
var chartData=[];
for( i=0; i<json.length; i++){
chartData.push( [ json[i]['status'], json[i]['val'] ])
}

AFAIK that's just how Highcharts wants its data. That being said, the parser is pretty easy:
var data; // this is your received data
var highchartsData = []; // this is data for highcharts
$.each(data, function(i, e) {
highchartsData.push([e.status, e.val]);
});
One thing to note is that if the data you're receiving is in text (say, a response from an AJAX call) then you need to convert it to a javascript object like so:
var data = $.parseJSON(textData);

You need to make a parser when assigning options as stated in HighCharts preprocessing
Basically, you parse the data and include it in the options:
var serie1 = json.map( function(e) {
return [e.status, e.val];
});
options.series.push({data: serie1});
Here is a working example using $.map and options in Fiddle

Since Highcharts 3.0, categories can also be extracted by giving each point a name and setting axis type to "category".
For a column bar chart this would be:
xAxis: {
type: 'category',
},
series: [{
data: [{
name: 'Point 1',
color: '#00FF00',
y: 1
}, {
name: 'Point 2',
color: '#FF00FF',
y: 5
}]
}]

You can bind chart with JSON data, directly.
You just need to set the json property names as highchart standard.
'Y' for value and 'name' for label.
Your JSON should be as like follow:
[
{
name: "Stopped \/ Idle",
y: 17.469444444444
}, {
name: "Working",
y: 0
}, {
name: "Headland Turning",
y: 0
}, {
name: "Transport",
y: 0.15333333333333
}
]

Categories

Resources