recently I am developing a game using Phaser.js, I have come to need my tile map objects and I have come to see this video.
The only problem is that the "sprites make objects" seeing this example, this method is used map:
map.createFromObjects('Object Layer 1', 34, 'coin', 0, true, false, coins);
Where 34 is the "gid" ... How can I add this value to JSON? Because when creating the tilemap and objects, no object is assigned a "gid". Do I have to set it manually ._. ?
I use Tiled Map Editor Can anyone help me?
I'm experiencing the same problem. I don't know a good solution, but I've just been manually adding in the gid, by opening the .json file with a text editor. Look for something that says
"name":(Your object layer name),
"objects":[
{
first object properties...
},
{
second object properties...
}
Now, for each object that you want to assign a gid, add this text to the top of it's properties.
"gid":(Desired gid),
It is important that you put the comma at the end.
Here is an example of one:
"name":"mainObjects",
"objects":[
{
"gid":34,
"height":32,
"id":6,
"name":"",
"properties":
{
},
"rotation":0,
"type":"fire",
"visible":true,
"width":32,
"x":352,
"y":1248
},
{
"gid":34,
"height":32,
"id":7,
"name":"",
"properties":
{
},
"rotation":0,
"type":"fire",
"visible":true,
"width":32,
"x":384,
"y":1248
}],
Notice how for each object I added the "gid" property, and assigned it a value of 34, this value can be whatever you want though.
Now this will be annoying, because each time you export the tiled map, it removes the gid. Like I said, this isn't a great solution, but it will work until someone can respond with a better one.
#weastie Yes, it is an acceptable solution. However, if I have 20 or 100 objects could be torture. I have come to a solution and it is this and maybe you can serve you and to other than this at this juncture.
function create() {
...
map = game.add.tilemap('map');
map.addTilesetImage('ground_1x1');
map.addTilesetImage('walls_1x2');
map.addTilesetImage('tiles2');
...
map.objects.Objects.forEach(function(element) {
element.gid = 34;
}, this);
...
map.setCollisionBetween(1, 12);
layer = map.createLayer('Tile Layer 1');
layer.resizeWorld();
map.createFromObjects('Object Layer 1', 34, 'coin', 0, true, false, coins);
}
map.objects
is the object that has the array of objects ("Object Layer 1"). All you have to do is access the array name and modify each object with a foreach. It is a simple way ...
Related
still quite new to higher order functions and trying to use them correctly here if possible.
I have a array of objects being returned from an api constructed like so:
[ {"gymId":3467, "halls": [{ "hallId": "25828", "instructorId": 1064,
"slotIds": [2088,2089], "sessionId":8188},
{"hallId": "25848", "instructorId": 1067, "slotIds": [2088,2089], "sessionId": 8188 }]}]
Expected result I want to achieve is to create a list of objects such as this from the array above ...
{2088: [{ "hallId":"25828", "instructorId":1064, "sessionId":8188 },
{ "hallId":"25848", "instructorId":1067, "sessionId":8188 }],
2089: [{ "hallId":"25828", "instructorId":1064, "sessionId":8188 },
{ "hallId":"25848", "instructorId":1067, "sessionId":8188 }]
}
I was thinking something along the lines of this
halls.reduce((acc, hall) => {
hall.slotIdIds.forEach(slotId => {
acc[slotId] = {
//expected object properties as above here.
};
});
return acc;
}, {}),
Problem is when I reduce in this way only one hallId is being returned and not the two matching hall ids where the slots exist.
Bit perplexed as to how to solve this one and would really appreciate any tips.
Could anyone make me understand the below scenario because I tried searching the web and unable to find any info.
I have the below code which does not work because infox is null. But when i change it "infox: []" then it works fine. I need to understand why is it so ?
data:{
infox:null
}
methods: {
loadmore: function () {
axios.get(this.url)
this.infox.push(...response.data);
}}
Next I want to understand what does the three dot stands for in ...response.data and why I cannot code in the below manner without three dots which makes more sense. I would really appreciate if you could point me to the source.
methods: {
loadmore: function () {
axios.get(this.url)
this.infox.push(response.data);
}}
Below is my JSON data
[
{
"Categories": "Fashion",
"Clicked": 30,
"EndDate": "2019-08-21",
"HomepageSpotlight": "No",
"ImageMainPage": "/static/images/fashion16.jpg",
"MainPage": "Yes",
"Mainhomepage": "No",
"Rating": 5,
"SlugTitle": "buy-clothes-with-50-Off",
},
{
"Categories": "Fashion",
"Clicked": 145,
"EndDate": "2019-08-21",
"HomepageSpotlight": "No",
"ImageMainPage": "/static/images/fashion10.jpg",
"MainPage": "Yes",
"Mainhomepage": "No",
"SlugTitle": "get-upto-60-off-on-jeans",
}
]
The this.infox variable refers to the infox:null in your example, so it does not work because null, obviously, does not have the method push.
When you change the infox to an Array like infox: [] then it works because an Array does have the method push.
Three dots operator is a new feature in ES6, you can read about it in a lot of articles, for example here: https://dev.to/sagar/three-dots---in-javascript-26ci
In your case the this.infox.push(...response.data) will populate each element of the data into the infox array. Your data is the array it'self, so it will copy the data array to the infox array.
The this.infox.push(response.data) string will result in putting all the data array in just one element of the infox array.
What I am trying to do is to get data from the server and then putting it all in an observable and then make all the properties observable. The issue I am facing is that it does not make all my properties observable and I need them all to be observable as sometimes depending on the data it makes some properties observable and sometimes it doesn't.
var viewModel = this;
viewModel.Model = ko.observable();
viewModel.SetModel = function (data) {
viewModel.Model(ko.mapping.fromJS(data));
}
The data that I am receiving from the server is like this for example: normaldata,items(this is an array with unknown number of elements).
so if i try to access data like viewModel.Model().Items[0]().Layer() i sometimes have Layer as a function and sometimes it is a normal element with observable elements.I want all my objects inside Items to have Layer as a function.
Server data example:
Name: "test"
Items: [Layer[ID: 132]]
In this example Name,Items and ID are observable but Layer is not.
Fiddle example:
jsfiddle.net/98dv11yz/3
So the problem is that sometimes the layer is null resulting in ko making the property observable but sometimes that property has id and ko makes only the child elements observable. The problem is that i have if's in the code and i want it to be a function so i can always reffer to it as layer() because now it is sometimes layer or layer()
An explenation for what's happening:
When the ko.mapping plugin encounters an object in your input, it will make the object's properties observable, not the property itself.
For example:
var myVM = ko.mapping.fromJS({
name: "Foo",
myObject: {
bar: "Baz"
}
});
Will boil down to:
var myVM = {
name: ko.observable("Foo"),
myObject: {
bar: ko.observable("Baz")
}
}
and not to:
var myVM = {
name: ko.observable("Foo"),
myObject: ko.observable({
bar: ko.observable("Baz")
})
}
The issue with your data structure is that myObject will sometimes be null, and sometimes be an object. The first will be treated just as the name property in this example, the latter will be treated as the myObject prop.
My suggestion:
Firstly: I'd suggest to only use the ko.mapping.fromJS method if you have a well documented and uniform data structure, and not on large data sets that have many levels and complexity. Sometimes, it's easier to create slim viewmodels that have their own mapping logic in their constructor.
If you do not wish to alter your data structure and want to keep using ko.mapping, this part will have to be changed client-side:
Items: [
{ layer: {id: "0.2"} },
{ layer: null}
]
You'll have to decide what you want to achieve. Should the viewmodel strip out the item with a null layer? Or do you want to render it and be able to update it? Here's an example of how to "correct" your data before creating a view model:
var serverData = {
Name: "Example Name",
Id: "0",
Items: [
{layer: {id: "0.2"} },
{layer: null}
]
};
var correctedData = (function() {
var copy = JSON.parse(JSON.stringify(serverData));
// If you want to be able to render the null item:
copy.Items = copy.Items.map(function(item) {
return item.layer ? item : { layer: { id: "unknown" } };
});
// If you don't want it in there:
copy.Items = copy.Items.filter(function(item) {
return item.layer;
});
return copy;
}());
Whether this solution is acceptable kind of relies on how much more complicated your real-life use will be. If there's more complexity and interactivity to the data, I'd suggest mapping the items to their own viewmodels that deal with missing properties and what not...
There is an nested object with certain properties which i don't want to be watched. It could be a pattern of properties starting with perhaps "_".
Here's a sample structure.
$scope.ObjectToBeWatched = {
"company": {
"ts": {
"_msg": {"nm":""},
"status": "success"
},
"ids": [
"000000010",
"000000011"
]
},
"_f": [
{
"code": "TY_IO",
"status": "fail"
}
]
}
Standard deep watch:
$scope.$watch("ObjectToBeWatched",function(newObj,oldObj){
},true);
Right now the watch is firing for any any change in any properties which is expected. So in above case any changes to properties
_msg, _f
should not fire.
Thanks for help.
You can try something like this:
$scope.$watch(function($scope) {
return $scope.listOfBigObjects.
map(function(bigObject) {
return bigObject.foo.
fieldICareAbout;
});
}, myHandler, true);
This grabs only the props you care about from the objects in an array. You can use an expression to check for certain field types inside the object map. If you don't have an array just skip that part.
Underscore has tons of functional methods to help w/ this as well if 'map' isn't exactly what you need to return fields you care about.
I have a JSON object which comes back like this from a JavaScript API call:
{
"myArray": [
{
"version": 5,
"permissionMask": 1
},
{
"version": 126,
"permissionMask": 1
}
]
}
How can I access the name of the array (i.e myArray) in JavaScript. I need to use the name of the array to determine the flow later on.
Use getOwnPropertyNames to get a list of the properties of the object in array form.
Example:
var myObj = {
"myArray": [
{
"version": 5,
"permissionMask": 1
},
{
"version": 126,
"permissionMask": 1
}
]
},
names = Object.getOwnPropertyNames(myObj);
alert(names[0]); // alerts "myArray"
Note: If the object can have more than one property, like myArray, myInt, and myOtherArray, then you will need to loop over the results of getOwnPropertyNames. You would also need to do type-testing, as in if(names[0] instanceof Array) {...} to check the property type. Based on your example in your question, I have not fleshed all of that out here.
Object.keys(data)[0]
# => "myArray"
A terminology note: This solution assumes you have a JavaScript object. You might have a JSON string, in which case this is the solution:
Object.keys(JSON.parse(data))[0]
# => "myArray"
However, "JSON object", in JavaScript, is just one - the one I used just now, that has JSON.parse and JSON.stringify methods. What you have is not a JSON object except perhaps in a trivial interpretation of the second case, where all values in JavaScript are objects, including strings.
The other answers are good if you have no control over the return format.
However, if you can, I'd recommend changing the return format to put the important values you care about as actual values instead of keys to make it clearer. For example, something like this:
result =
{
"name: "myArray",
"value": [
{
"version": 5,
"permissionMask": 1
},
{
"version": 126,
"permissionMask": 1
}
]
}
Then, it's a lot clearer to reliably access the property you care about: result.name