Serving vector data from Geoserver to Cesium

1,194 views
Skip to first unread message

paula....@gmail.com

unread,
Nov 30, 2017, 4:02:54 AM11/30/17
to cesium-dev
Hi!

I want to create vector layer on Geoserver and serve it to Cesium sandcastle application so that I can apply custom styles on entities from vector layer. If someone has an experience with creating vector layers on Geoserver and serving them to Cesium it would be most helpful.
I set up Geoserver and Cesium. I created workspace, store and layer on Geoserver.
All set up but somehow I'm missing this connection point between Geoserver and Cesium.

The questions are:

1. How to load layer from Geoserver to Cesium:
If it's even possible to do this, which method should I use? GeoJsonDataSource.load takes a layer from SampleData folder, but can I provide it an URL of my Geoserver layer (something like http://localhost:8080/geoserver/workspace:layer)?

2. Vector layer data format:
I've seen topics concerning this, but haven't found detailed explanation on how to do this exactly; someone mentioned that you can't create GeoJson layer on Geoserver but you can get GeoJson as an output? What does 'output' mean? I don't have much experience with Geoserver.

I need to do this because I want to make Cesium webGIS application which shows objects such as buildings, roads, infrastructure etc. as a part of larger webGIS solution, with all data stored on company's server.
The reason for GeoJson is because I have experience with styling GeoJson entities.

I'm using:
Cesium 1.39
Windows 7 64bit
Chrome browser
Geoserver not locally installed but on company's server

Gabby Getz

unread,
Dec 4, 2017, 3:37:30 PM12/4/17
to cesium-dev
Hi Paula,

For a GeoJson file, you would use GeoJsonDataSource.load, and you can indeed pass in any valid URL. The Cesium Workshop Tutorial shows some examples of loading and styling data, from KML, GeoJson, and the more Cesium-specific CZML formats.

I'm not familiar with Geoserver, so hopefully a member of the community can chime in on how to output a GeoJson.

Thanks!
Gabby

paula....@gmail.com

unread,
Dec 7, 2017, 3:34:46 AM12/7/17
to cesium-dev
Hi Gabby,

thanks for reply!
I found a plugin for WFS developed by Sushrut Shivaswamy --> https://groups.google.com/forum/#!topic/cesium-dev/Jkga8_8tPWA
And Sushrut was very kind and helpful, but I still didn't manage to implement it. I assume it's because of my lack of knowledge in programming. Can you help me with this or do you know if someone from community used this plugin before so I can see an example which can help me to implement this plugin?

I'm getting the "Uncaught TypeError: Cesium.WebFeatureServiceImageryProvider is not a constructor (on line 4)"

Thank you,
Paula

-----
This is the plugin
https://drive.google.com/open?id=1h3qYiqYMcMrqWUZIb9OdnRTjyDgEWGdP

-----
This is my html code for now

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="description" content="Use Viewer to start building new applications or easily embed Cesium into existing applications.">
<meta name="cesium-sandcastle-labels" content="Beginner, Showcases">
<title>Cesium Demo</title>
<script type="text/javascript" src="../Sandcastle-header.js"></script>
<script type="text/javascript" src="../../../Source/Scene/WFS.js"></script>
<script type="text/javascript" src="../../../ThirdParty/requirejs-2.1.20/require.js"></script>
<script type="text/javascript">
require.config({
baseUrl : '../../../Source',
waitSeconds : 60
});
</script>
</head>
<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
<style>
@import url(../templates/bucket.css);
</style>
<div id="cesiumContainer" class="fullSize"></div>
<div id="loadingOverlay"><h1>Loading...</h1></div>
<div id="toolbar"></div>
<script id="cesium_sandcastle_script">
function startup(Cesium) {
'use strict';

//Sandcastle_Begin

var viewer = new Cesium.Viewer('cesiumContainer');

//initialise WFS provider


var wfs = new Cesium.WebFeatureServiceImageryProvider({ //Uncaught TypeError: Cesium.WebFeatureServiceImageryProvider is not a constructor (on line 4)

url : "http://localhost:8081/geoserver/web",
layers : "myLayer",
viewer : viewer

});
//Sandcastle_End
Sandcastle.finishedLoading();
}
if (typeof Cesium !== "undefined") {
startup(Cesium);
} else if (typeof require === "function") {
require(["Cesium"], startup);
}
</script>
</body>
</html>

Gabby Getz

unread,
Dec 8, 2017, 3:45:46 PM12/8/17
to cesium-dev
Hi Paula,

I haven't used it myself yet, so I can't provide support, hopefully another member of the community could chime in. Offhand, it looks like you may not be able to use Cesium.WebFeatureServiceImageryProvider to create that imagery provider, as it is not in the Cesium namespace. Make sure the library is being loaded and try just WebFeatureServiceImageryProvider.

Thanks!
Gabby
Message has been deleted

prashanth...@gmail.com

unread,
Jan 2, 2019, 2:34:30 AM1/2/19
to cesium-dev
Hi Gabby,
I am facing the same issue as what Paula is facing. Is there any workaround for this issue?

Or , is there any other way to add WFS layer to Cesium map that you can share with us?! That will be of great help, thank you.

Thanks,
Prashanth

Omar Shehata

unread,
Jan 2, 2019, 4:56:30 PM1/2/19
to cesium-dev
I followed up on this here:


Hope that helps. 

prashanth...@gmail.com

unread,
Jan 3, 2019, 12:02:51 AM1/3/19
to cesium-dev
Thank you for the quick reply Omar, that helps!
Reply all
Reply to author
Forward
0 new messages