Issue with iteration "Uncaught Error: coordinates is required" - javascript
I am using mapbox and turf.js to allow users to draw a polygon on the map and then in return get the perimeter distance. I am able to get it to do the function I want and I am receiving/displaying the correct measurements, but now I get "Uncaught Error: coordinates is required". I think that it is where I am trying to create a variable to iterate through the coordinates (var to and var from), but I haven't found a solution to fix it.
function measurements(e) {
var data = draw.getAll();
var answer = document.getElementById('calculated-perimeter');
if (data.features.length > 0) {
var coordinates = data.features[0].geometry.coordinates[0];
var calc_distances = []
var i;
for (i = 0; i<coordinates.length; i++){
var from = turf.point(coordinates[i]);
var to = turf.point(coordinates[i+1]);
var options = {units: 'kilometers'};
var distance = turf.distance(from, to ,options);
calc_distances.push(distance);
console.log(calc_distances);
var perimeter = calc_distances.reduce((a, b) => a + b, 0);
var strg_per = perimeter.toString();
var strg_per = Math.round(strg_per * 1000)
answer.innerHTML ='<p><strong>' + strg_per + '</strong></p><p>meters</p>';}
} else {
answer.innerHTML = '';
if (e.type !== 'draw.delete')
alert('Use the draw tools to draw a polygon!');
}
}
-------------------------------
EDIT : here is the full stack trace:
turf.min.js:1 Uncaught Error: coordinates is required
at Object.r [as point] (turf.min.js:1)
at r.measurements ((index):173)
at r.zt.fire (evented.js:119)
at r.i.fire (setup.js:52)
at q.Jt.onStop (draw_polygon.js:81)
at Object.stop (object_to_mode.js:57)
at Object.stop (mode_handler.js:57)
at Object.c [as changeMode] (events.js:169)
at q.changeMode (mode_interface_accessors.js:151)
at q.Jt.onKeyUp (draw_polygon.js:66)
The combination of these two lines looks wrong:
for (i = 0; i<coordinates.length; i++){
...
var to = turf.point(coordinates[i+1]);`
You will be calling turf.point(undefined).
Probably that first line should be:
for (i = 0; i<coordinates.length - 1; i++){
Related
Backpropagation in an Tensorflow.js Neural Network
When I have been attempting to implement this function tf.train.stg(learningRate).minimize(loss)into my code in order to conduct back-propagation. I have been getting multiple errors such The f passed in variableGrads(f) must be a function. How would I implement the function above into the code bellow successfully? and Why does this error even occur? Neural Network: var X = tf.tensor([[1,2,3], [4,5,6], [7,8,9], [10,11,12]]) var Y = tf.tensor([[0,0,0],[0,0,0], [1,1,1]]) var m = X.shape[0] var a0 = tf.zeros([1,3]) var y_hat = tf.zeros([1,3]) var parameters = { "Wax": tf.randomUniform([1,3]), "Waa": tf.randomUniform([3,3]), "ba": tf.zeros([1,3]), "Wya": tf.randomUniform([3,3]), "by": tf.zeros([1,3]) } function RNN_cell_Foward(xt, a_prev, parameters){ var Wax = parameters["Wax"] var Waa = parameters["Waa"] var ba = parameters["ba"] var a_next = tf.sigmoid(tf.add(tf.add(tf.matMul(xt, Wax), tf.matMul(a_prev , Waa)),ba)) return a_next } function RNN_FowardProp(X, a0, parameters){ var T_x = X.shape[0] var a_next = a0 var i = 1 var Wya = parameters["Wya"] var by = parameters["by"] var l = 1 for(; i <= T_x; i++){ var X_i = X.slice([i-1,0],[1,-1]) for(; l <= X.shape[1]; l++){ var xt = X_i.slice([0,l-1],[1,1]) var a_next = RNN_cell_Foward(xt, a_next, parameters) } var y_pred = tf.sigmoid((tf.add(tf.matMul(a_next, Wya), by))) l = 1 if (i == 1){ var y_pred1 = y_pred } else if (i == 2) { var y_pred2 = y_pred } else if (i == 3) { var y_pred3 = y_pred } } var y_predx = tf.concat([y_pred1, y_pred2, y_pred3]) return y_predx } const learningRate = 0.01; var optimizer = tf.train.sgd(learningRate); var model = RNN_FowardProp(X, a0, parameters) var loss = tf.losses.meanSquaredError(Y, model) for (let f = 0; f < 10; f++) { optimizer.minimize(loss) } This is a neural network for sentiment classification which has a many to one structure.
The error says it all: The f passed in variableGrads(f) must be a function optimizer.minimize is expecting a function as parameter and not a tensor. Since the code is trying to minimize the meanSquaredError, the argument of minimize can be a function that computes the meanSquaredError between the predicted value and the expected one. const loss = (pred, label) => pred.sub(label).square().mean(); for (let f = 0; f < 10; f++) { optimizer.minimize(() => tf.losses.meanSquaredError(Y, model)) } Does it solve the issue, not completely yet ? The error will change for something like: variableGrads() expects at least one of the input variables to be trainable What does it mean ? When the optimizer is used, it expects the function passed as argument to contains variables whose values will be updated to minimize the function output. Here is the changes to be made: var Y = tf.tensor([[0,0,0],[0,0,0], [1,1,1]]).variable() // a variable instead // var loss = tf.losses.meanSquaredError(Y, model) // computed below in the minimize function const learningRate = 0.01; var optimizer = tf.train.sgd(learningRate); var model = RNN_FowardProp(X, a0, parameters); const loss = (pred, label) => pred.sub(label).square().mean(); for (let f = 0; f < 10; f++) { optimizer.minimize(() => tf.losses.meanSquaredError(Y, model)) }
Inserting objects into array in Javascripts throws uncaught TypeError
I am creating pos objects and inserting them into an array. Following is perfectly fine code. var pos1={lat:25,long:56}; var pos2={lat:100,long:200}; var pos3={lat:-63,long:-29}; var objects=[]; objects.push(pos1); objects.push(pos2); objects.push(pos3); console.log(objects[0].lat+","+objects[0].long); console.log(objects[1].lat+","+objects[1].long); console.log(objects[2].lat+","+objects[2].long); Output Then I tried to insert some objects using random numbers inside a loop.It was precisely at this very point that it gave producing errors. Uncaught TypeError: When Pos Objects is Outside the loop var locations=[]; var pos={lat:0,long:0}; //Here post object is outside the loop size=10; for(var i=1;i<=size;i++){ var x=Math.floor(1+Math.random()*10); var y=Math.floor(1+Math.random()*10); pos.lat=x; pos.long=y; locations.push(pos); } for(var i=1;i<=size;i++){ console.log(locations[i].lat+","+locations[i].long); } Output Uncaught TypeError: When Pos Objects is Inside the loop var locations=[]; size=10; for(var i=1;i<=size;i++){ var pos={lat:0,long:0}; //pos object inside the loop var x=Math.floor(1+Math.random()*10); var y=Math.floor(1+Math.random()*10); pos.lat=x; pos.long=y; locations.push(pos); } for(var i=1;i<=size;i++){ console.log(locations[i].lat+","+locations[i].long); } Output I am NOT getting why I am getting these errors.My understanding is that when accessing the locations array I need to caste it to the pos object?
i should be start from 0 like this: for(var i=0;i < size;i++){ console.log(locations[i].lat+","+locations[i].long); } As array index starts from zero and ends with less than 1 of its size.
well in programming array index start from zero so when size is 5 for example indices are 0, 1, 2, 3, 4 .. see how the last index is 4 .. In your case you iterate till <=size which is trying to access element which is not there and thats why you are getting the error i = 0 ; i < 10 should fix it
Array indices starting with 0, so i must start with 0 and should only go < not <= var locations = []; size = 10; for (var i = 1; i <= size; i++) { var pos = { lat: 0, long: 0 }; //pos object inside the loop var x = Math.floor(1 + Math.random() * 10); var y = Math.floor(1 + Math.random() * 10); pos.lat = x; pos.long = y; locations.push(pos); } for (var i = 0; i < size; i++) { console.log(i, locations[i].lat + "," + locations[i].long); }
Split javascript string into array
I have this javscript string: response "[[[#],[b,#],[b,w,b,b,b,#],[b,#],[b,w,w,b,#]],[[b,#],[b,b,#],[b,b,w,#],[b,b,b,#],[b,b,#]],[[b,#],[b,b,b,b,#],[b,w,#],[b,b,b,#],[b,#]],[[b,#],[b,#],[w,w,w,#],[b,b,w,w,#],[b,w,#]],[[b,#],[b,b,b,b,#],[b,w,b,#],[b,w,#],[b,b,#]]]" This corresponds to a board game and which field (e.g [b,w,b,b,b,#]) is a cell with black and white pieces. The # is the top of the stack. I need to parse this in order to create an array of tiles. I have this: XMLscene.prototype.readBoard = function(data){ var response = data.target.response; console.log("REPONSE NO PARS" + response); response = response.split("],"); console.log("REPONSE " + response); response[0] = response[0].substring(1); response[5] = response[5].substring(0, response[5].length - 2); for(var i = 0; i < response.length; i++) { response[i] = response[i].substring(1); response[i] = response[i].split("),"); for(var j = 0; j < response[i].length; j++) response[i][j] = response[i][j].substring(5); } this.scene.board.loadTiles(response); //this.scene.client.getPrologRequest('quit', 0, 1); }; to be parsed in this function: gameBoard.prototype.loadTiles = function(board){ console.log("BOARD : " + board); this.tiles = []; for (var i = 0; i < board.length; i++){ for (var j = 0; j < board[i].length; j++){ var player = board[i][j].split(",")[0]; console.log("PLAYER : " + player); var type = board[i][j].split(",")[1]; console.log("Type : " + type); if (type != "e") { var tile = this.createTile(type, this.scene ,i*6 + j+100, player); tile.line = i; tile.col = j; this.tiles.push(tile); } } } } The board structure I want is something like this: for the first stack: [#] It's an empty cell [b,#] - A cell with one piece - black [b,w,w,b,#] - A cell with a black piece in the bottom, then two white pieces and a black on the top, therefore the black player is the owner of the stack! The stack owner is the player that have his piece on the top of the stack (closest to #) Is there any way to get an array with each stack being the element of it? Regards
You could transform the data to JSON like this, ignoring the hashes as they seem to give information that is already known (the stack ends at the right): var response = JSON.parse(response.replace(/,?#/g, '').replace(/[bw]/g, '"$&"')); Then you can for instance identify the current player for a stack at (i, j), like this: var player = board[i][j].slice(-1)[0]; // last element on the stack Snippet: // Sample data var response = "[[[#],[b,#],[b,w,b,b,b,#],[b,#],[b,w,w,b,#]],[[b,#],[b,b,#],[b,b,w,#],[b,b,b,#],[b,b,#]],[[b,#],[b,b,b,b,#],[b,w,#],[b,b,b,#],[b,#]],[[b,#],[b,#],[w,w,w,#],[b,b,w,w,#],[b,w,#]],[[b,#],[b,b,b,b,#],[b,w,b,#],[b,w,#],[b,b,#]]]"; // Convert to nested array var board = JSON.parse(response.replace(/,?#/g, '').replace(/[bw]/g, '"$&"')); // Print the stack at 3, 3 console.log(board[3][3].join(',')); // Print player for that stack: console.log(board[3][3].slice(-1)[0]);
A quick and dirty solution is to quote all your elements by using String.prototype.replace() and then put the entire result in an eval(): var str = "[[[#],[b,#],[b,w,b,b,b,#],[b,#],[b,w,w,b,#]],[[b,#],[b,b,#],[b,b,w,#],[b,b,b,#],[b,b,#]],[[b,#],[b,b,b,b,#],[b,w,#],[b,b,b,#],[b,#]],[[b,#],[b,#],[w,w,w,#],[b,b,w,w,#],[b,w,#]],[[b,#],[b,b,b,b,#],[b,w,b,#],[b,w,#],[b,b,#]]]"; var res = eval(str.replace(/[bw#]/g, "'$&'")); console.log(res);
Modify your string to look like this... var myString = '[[[#],[b,#],[b,w,b,b,b,#],[b,#],[b,w,w,b,#]],[[b,#],[b,b,#],[b,b,w,#],[b,b,b,#],[b,b,#]],[[b,#],[b,b,b,b,#],[b,w,#],[b,b,b,#],[b,#]],[[b,#],[b,#],[w,w,w,#],[b,b,w,w,#],[b,w,#]],[[b,#],[b,b,b,b,#],[b,w,b,#],[b,w,#],[b,b,#]]]' replace elements with "" Now run following: var myArrayObject = JSON.parse(myString); You just converted it to array. Sample code: https://fiddle.jshell.net/3gvzmwef/21/
Getting a Javascript error message saying that a defined array is not defined
At the start of my program, I am declaring and filling 4 arrays that are used throughout the rest of the program: var imageArrayGroup = []; var floatingButtonArrayGroup = []; for (i = 1; i < 3; i++) { imageArrayGroup[i] = document.createElement("img"); imageArrayGroup[i].type = "image"; floatingButtonArrayGroup[i] = document.getElementById('floatingButton' + (100 + i)); floatingButtonArrayGroup[i].style.paddingLeft = "35px"; floatingButtonArrayGroup[i].style.paddingTop = "5px"; } var imageArray = []; var floatingButtonArray = []; for (i = 1; i < 10; i++) { imageArray[i] = document.createElement("img"); imageArray[i].type = "image"; floatingButtonArray[i] = document.getElementById('floatingButton' + (i)); floatingButtonArray[i].style.paddingLeft = "35px"; floatingButtonArray[i].style.paddingTop = "5px"; } Later on in the code, I call a function that references the arrays. function clearThumbnails() { for (i = 1; i < 10; i++) { if (floatingButtonArray[i].hasChildNodes()) floatingButtonArray[i].removeChild(imageArray[i]); } for (i = 1; i < 3; i++) { if (floatingButtonArrayGroup[i].hasChildNodes()) floatingButtonArrayGroup[i].removeChild(imageArrayGroup[i]); } } When running this function, I get the error "Uncaught TypeError: Cannot read property '1' of undefined" Why is the variable undefined? Complete code can be found at: http://codepen.io/angstd/pen/ropca Click on the word "Garage" to get the error message.
You are getting the error TypeError: floatingButtonArrayGroup[i] is null, which seems to originate in your first loop. This is a runtime error, which will terminate the execution of the script at that point. That means the assignment var floatingButtonArray = []; is never executed. It looks like you are trying to get a reference to an element that doesn't exist at that moment. See Why does jQuery or a DOM method such as getElementById not find the element? for solutions to that problem.
Obtaining driving length between stops in ArcGIS
How can I obtain driving length between two stops in ArcGIS? I'm placing route from RouteTask service on a map and want to get lengths from that response too. I've thought about doing some iteration in DirectionsFeatureSet, but I already see that what I'm doing is complete nonsense. var directions = solveResult[0].directions; console.log(directions); var length = 0; var location = 0; var obj = {}; $.each(directions.features, function (ind, val) { var txt = val.attributes.text; var indexOfLocation = txt.indexOf('Location'); if (indexOfLocation != -1) { var digitTransform = txt.substring(indexOfLocation + 9); var digit = ""; for (var i = 0; i < digitTransform.length; i++) { var char = digitTransform[i]; if (isNumber(char)) { digit += char; } else break; } } }); That's what I already did and that makes no sense. In Google Maps API it's clear - every leg has it's own length. In ArcGIS responses I see no such easy approach.
The length is available as an attribute of each returned feature. So, given your directions variable, the following would give you the length of the first leg of the route: directions.features[0].attributes.length