Skip to first unread message
wi...@viadrupsteen.nl
Nov 15, 2018, 8:04:00 AM11/15/18
to cesium-dev
Hello guys,
I'm working on a mobile version of an application using cesium and I'm running into a showstopper.
The thing that we need to be able to support to make this project work with cesium is kml layers. Great thing is that it works perfectly on desktop.
However once switching to android I'm getting completely different result. Almost as if the mobile version is ignoring the settings given in order to place it on the terrain rather then under it.
I'm using the following code to setup the kml layer
private async addAllLayers() {
if (!this.kmlLayerCollection.ready) {
await new Promise<any>((resolve) => {
let unobserve = observe(this.kmlLayerCollection, "ready", change => {
if (this.kmlLayerCollection.ready) {
resolve();
unobserve();
}
})
})
}
let promises: Promise<any>[] = [];
this.kmlLayerCollection.layers.forEach(l => promises.push(this.addKmlLayer(l)));
let layers: any[] = await Promise.all(promises);
layers.forEach(l => this.cesiumStore.viewer.dataSources.add(l))
}
private addKmlLayer(kml: KmlLayerModel) {
return new Promise<any>((resolve) => {
Cesium.KmlDataSource.load(kml.src, {
camera: this.cesiumStore.viewer.scene.camera,
canvas: this.cesiumStore.viewer.scene.canvas,
clampToGround: true
}).then((r: any) => {
this.cesiumStore.activeKmlLayers.push({ cesiumLayer: r, model: kml });
let name = r.name as string;
if (!kml.name) kml.name = name.slice(0, name.length - 4);
resolve(r);
})
})
}
This code gets the following results, I'll post an image of the result I get on desktop and one of mobile. I'll post the specs under the image
Phone
Device: Huawei Mate 10 lite.
Browser: Chrome V70.0.3538.80
Desktop
Everything is working as intended on desktop so I don't see a reason to post those specs.
I need this to show the same result on desktop aswell as mobile. We're working on a new pilot for a platform that would go into the hands of alot of local residents. In the world of today that means that a majority of users are coming to the website using a mobile phone. Not being able to show the same results on mobile as on desktop would mean that we can't actually use cesium for this pilot. Which would suck because we really love using cesium.
Is there anything that can be done about this problem? Is it even a problem or have I simply not set some things the way they are supposed to?
Best regards,
Wilco de Boer
Omar Shehata
Nov 15, 2018, 10:42:05 AM11/15/18
to cesium-dev
The nice thing about a web engine is usually anything with a browser can run it, and since everything is standardized, it all works the same way, and it's the ultimate cross platform technology the world has ever known.
In practice, things are a little messier. This is quite a peculiar bug. Do you know for sure that the KML layers are under terrain, or are they not rendering at all? What happens if you disable terrain?
If you can reproduce this with a Sandcastle example (https://cesiumjs.org/Cesium/Build/Apps/Sandcastle) that'll help me a lot with narrowing it down. Have you checked if there are any warnings or errors in the dev console on Android?
Message has been deleted
wi...@viadrupsteen.nl
Nov 16, 2018, 8:10:56 AM11/16/18
to cesium-dev
I've got a sandcastle example here. The only problem is that I don't really know how to get the KML I use here in taht sandcastle example so I don''t have a way of testing that.
I'll include the kml file here so you can add it there and see for yourself. This does mean sadly that I can't actually see in the sandcastle example if its also broken on mobile.
I'll include the kml file here so you can add it there and see for yourself. This does mean sadly that I can't actually see in the sandcastle example if its also broken on mobile.
I've set the viewer to the exact setting we use here, aswell as some camera movement changes. A cartographicLimitRectangle and inside that a smaller bounding rectangle that limits the movement of the user.
Normally I have a sphere around the rectangle that acts as a skybox, but I can't show that here. Code would get too big.
I hope you can do something with this. And if you have a tip on how to get a file inside the sandcaste editor that would help alot in future examples
KML
As for if they are being drawn or not. If I give the polygons a specific height on mobile then they are shown.If i continue to not set a height or set height to undefined.
Which I believe you guys do inside cesium when clampToGround is set to true on the klml dataSource, then the polygons aren't being drawn on mobile. also not under the terrain
I also get no errors or warning from the console except for "
Cesium.js:2097 KML - Unsupported StyleMap key: highlight" Which i don't believe is of much importance.
Omar Shehata
Nov 16, 2018, 12:59:52 PM11/16/18
to cesium-dev
I'm getting an error when trying to run that Sandcastle (even without KML loading part):
An error occurred while rendering. Rendering has stopped.
undefined
DeveloperError: normalized result is not a number
DeveloperError@http://localhost:8080/Source/Core/DeveloperError.js:43:19
Cartesian3.normalize@http://localhost:8080/Source/Core/Cartesian3.js:421:19
updateMembers@http://localhost:8080/Source/Scene/Camera.js:600:22
get@http://localhost:8080/Source/Scene/Camera.js:746:17
get@http://localhost:8080/Source/Scene/Camera.js:806:25
update@http://localhost:8080/Apps/Sandcastle/templates/bucket.html:150:13
Event.prototype.raiseEvent@http://localhost:8080/Source/Core/Event.js:146:17
Scene.prototype.render@http://localhost:8080/Source/Scene/Scene.js:3160:13
CesiumWidget.prototype.render@http://localhost:8080/Source/Widgets/CesiumWidget/CesiumWidget.js:694:13
render@http://localhost:8080/Source/Widgets/CesiumWidget/CesiumWidget.js:69:25Are you seeing that as well? it seems to be coming from the update function at the bottom (if you comment it out it works fine but then the camera isn't set to the right position). I appreciate you providing you sample KML file. I think the easiest way to test this would be to run Sandcastle locally (see this tutorial https://cesiumjs.org/tutorials/Cesium-Workshop/) and then you can put your KML file under Apps/SampleData/kml. And then you should be able to load it with a URL like this:
Cesium.KmlDataSource.load('../../SampleData/kml/deelgebieden.kml', {
camera: viewer.scene.camera,
canvas: viewer.scene.canvas,
clampToGround: true
}).then(function(r) {
this.updateEntityForCesium(r);
viewer.dataSources.add(r);
});That way you can test it on Sandcastle and then I'd be able to run it locally in the same way.
It would also help to narrow down the issue by creating a minimal example that reproduces it. For example, I see you've got a lot of custom settings on the viewer/camera etc. Does the problem still happen if you leave the defaults for everything?
wi...@viadrupsteen.nl
Nov 19, 2018, 5:01:28 AM11/19/18
to cesium-dev
Weekend has passed so we're off again, I'll try it out with a minimal viewer and see how that goes. I'll keep you updated
wi...@viadrupsteen.nl
Nov 19, 2018, 7:07:39 AM11/19/18
to cesium-dev
In reply to that. I've tried it in a locally run sandcastle and I removed all of the viewer settings.
I made the host my ip in order to run it on mobile. The result was as followed.
KML Desktop: Working as intended;
I made the host my ip in order to run it on mobile. The result was as followed.
KML Desktop: Working as intended;
KML mobile:
Huawei Mate 10 Lite: No polygons are being shown;
Huawei P20: No polygons are being shown
This is the code I am running now
Omar Shehata
Nov 19, 2018, 12:03:44 PM11/19/18
to cesium-dev
Thanks for putting this example together! I'm able to recreate this now. I just tested it and the same issue happens on iPad as well.
I opened a GitHub issue to track this and get some more insight on why this might be happening:
Reply all
Reply to author
Forward
0 new messages