GeoStyler - One Tool for all Styles
This is a modal window.
Das Video konnte nicht geladen werden, da entweder ein Server- oder Netzwerkfehler auftrat oder das Format nicht unterstützt wird.
Formale Metadaten
Titel |
| |
Serientitel | ||
Anzahl der Teile | 266 | |
Autor | ||
Lizenz | CC-Namensnennung 3.0 Deutschland: Sie dürfen das Werk bzw. den Inhalt zu jedem legalen Zweck nutzen, verändern und in unveränderter oder veränderter Form vervielfältigen, verbreiten und öffentlich zugänglich machen, sofern Sie den Namen des Autors/Rechteinhabers in der von ihm festgelegten Weise nennen. | |
Identifikatoren | 10.5446/66424 (DOI) | |
Herausgeber | ||
Erscheinungsjahr | ||
Sprache |
Inhaltliche Metadaten
Fachgebiet | ||
Genre | ||
Abstract |
|
FOSS4G Prizren Kosovo 2023174 / 266
10
17
23
44
45
46
47
48
49
50
52
53
80
84
85
91
110
116
129
148
164
167
169
173
174
181
182
183
186
187
199
202
204
206
209
215
241
248
265
00:00
DatenstrukturOrdnung <Mathematik>SoftwareSyntaktische AnalyseProgrammbibliothekMAPFilter <Stochastik>Kategorie <Mathematik>VektorraumGrenzschichtablösungElementargeometrieFunktionalHyperbelverfahrenKomplex <Algebra>Leistung <Physik>MereologieMultiplikationPolygonProjektive EbeneSpeicherabzugTabelleTeilmengeVersionsverwaltungServerTexteditorRenderingCASE <Informatik>PunktSchnittmengeOffene MengeKartesische KoordinatenBitmap-GraphikFokalpunktDateiformatFramework <Informatik>GraphfärbungPlastikkarteOpen SourceDifferenteMultiplikationsoperatorSchlussregelPlug inStandardabweichungMessage-PassingCliquenweiteDemo <Programm>BenutzerbeteiligungBildbearbeitungsprogrammSoftwareentwicklerApp <Programm>Nuklearer RaumTexteditorUmsetzung <Informatik>DateiformatKeller <Informatik>SoftwareentwicklerUMLXMLComputeranimationVorlesung/Konferenz
07:27
Attributierte GrammatikBenutzerfreundlichkeitBruchrechnungCodeDatenstrukturFormale SpracheSprachsyntheseSyntaktische AnalyseCodierungExpertensystemParserMAPFilter <Stochastik>Kategorie <Mathematik>VektorraumGruppenoperationMultiplikationRechenschieberSechseckZentrische StreckungServerTexteditorZeitrichtungCASE <Informatik>AbstraktionsebeneCoxeter-GruppeTranslation <Mathematik>TemplateAdditionSchnittmengeOffene MengeKartesische KoordinatenUmsetzung <Informatik>RichtungUmwandlungsenthalpieService providerMailing-ListeDateiformatArithmetischer AusdruckGraphfärbungPlastikkarteElektronische PublikationClientWeg <Topologie>NP-hartes ProblemDifferenteSymboltabelleMultiplikationsoperatorSchlussregelCliquenweiteMinkowski-MetrikBenutzerbeteiligungBildbearbeitungsprogrammVolumenvisualisierungExpertensystemBAYESGammafunktionWeitverkehrsnetzPunktOffene MengeUmsetzung <Informatik>DateiformatCLICliquenweiteComputeranimation
14:45
Attributierte GrammatikCodeInformationSchaltnetzSyntaktische AnalyseTransformation <Mathematik>TypentheorieVerschiebungsoperatorParserBildschirmfensterGeradeInverser LimesKette <Mathematik>PolygonPrinzip der gleichmäßigen BeschränktheitRechenschieberVerschlingungKonfigurationsraumVersionsverwaltungTexteditorCASE <Informatik>Anpassung <Mathematik>Zusammenhängender GraphDatenfeldBildschirmsymbolSchnittmengeEin-AusgabePixelKartesische KoordinatenUmsetzung <Informatik>UmwandlungsenthalpieHomepageDateiformatRadiusArithmetischer AusdruckMinimumWeb SiteNeuroinformatikWeb logObjekt <Kategorie>MinimalgradKontextbezogenes SystemMultiplikationsoperatorSchlussregelDemo <Programm>DefaultCodeInformationSyntaktische AnalyseParserBildschirmfensterHill-DifferentialgleichungMereologieSpeicherabzugKonfigurationsraumVersionsverwaltungSimulated annealingUmsetzung <Informatik>Arithmetischer AusdruckGenerizitätTLSCLIKontextbezogenes SystemSchlussregelDemo <Programm>DokumentenserverXMLComputeranimationVorlesung/Konferenz
22:04
AutorisierungDokumentenserverUMLComputeranimation
Transkript: Englisch(automatisch erzeugt)
00:08
Welcome to the GeoStyler talk, one tool for nearly all styles to be more precise in that case. I will shortly introduce myself. My name is Jan. I'm a full-stack developer at Torostos in Germany where we create web GIS applications.
00:25
And I'm also a core developer of the GeoStyler project. Today we will be talking about the concept that lies behind GeoStyler and its latest features that we just developed and also what happened within the GeoStyler community in the last time.
00:45
And of course we will take a look into the future and we will see what will be coming next in the GeoStyler project. So what is GeoStyler? We started in our company as we developed web GIS applications and we often had the case that our customers had the need to style their geo data.
01:04
So we created several editors for that. But at a point we said we don't want to create a specific editor just for each application. So we said why not create a generic library that we can use for styling the geo data. So one part of GeoStyler is a graphical editor where you can edit your styles and create your styles with.
01:26
Then we were continuing and thought, okay we are using open layers for map rendering but you are also using for example WMS and SLD for the server side rendering, let's call it like that. And so we had different styling formats that we needed to support.
01:43
And in order to do that we also thought it would be nice to be able to use the same editor for different styling formats. Because of that we created a concept that we are able to convert between different styling formats which I will explain in more detail later.
02:00
But the key feature here is that we can use one tool for multiple styles. And then afterwards we thought, okay this might be a problem that does not only exist in our own company but also in the whole geo community. So we thought as people who are probably pretty bad at marketing and pretty good at thinking about free and open source software
02:23
that GeoStyler itself might be a nice tool for the community itself. And so right now GeoStyler is also our geo community project. So talking about the graphical style editor, here you can see one example of GeoStyler.
02:43
This is our demo application where you can see or get a nice overview of the different features of GeoStyler. So you are able to style usually vector data but raster data is also supported. And we set it up pretty close to the structure of SOD.
03:01
So you have a set of rules and within a rule you can specify which features of a data set you should apply the style to. And then you can of course edit the style itself. So what you can see here on the left side is the tabular layout of GeoStyler where you have quite a compact overview of the rule set that you have.
03:23
You can get an overview of the filters that you set. And also in the last columns you can see how many features actually fit into that rule based on the data set you are applying to. And also if you have duplicates between the different rules that you created.
03:42
This is another example of GeoStyler. This is one of our own web GIS applications that we created in our company. So on the right side you see another layout of GeoStyler which is the new card layout. Which focuses to be a little more compact in the sense of horizontal width.
04:04
So you can also use it in for example mobile applications. And it has a little more modern feel to it instead of editing in a table. We also created GeoServer plugin. So if you install this plugin you are able to use the graphical editor of GeoStyler.
04:26
And style the SLD within GeoServer. So what you can see here in the middle or you can see the styling overview of GeoServer. And what's new is the part in the middle where you see again the tabular editor of GeoStyler.
04:42
So you don't have to edit the SLD by hand but you can use this graphical editor just within GeoServer. This is another example of GeoStyler which we there heavily configured. So we trimmed it down to just the base functionality. So in this case we only wanted the users to be able to edit polygons.
05:05
And also only a subset of the styling properties that you usually can edit on polygons. So for example, I guess it looks like it's in German but you can set the fill color. You can set the opacity and the stroke color and the stroke opacity.
05:23
But that's it. So GeoStyler is also highly configurable because we know there are very different needs and very different use cases when you want to style your data. And GeoStyler should enable all these different use cases. And we don't want to force users to just use one way of styling data.
05:40
But actually give the power to the users so they can edit it in their own ways and to their own needs. The main takeaway message in this case is that GeoStyler is not an application. GeoStyler itself is a library that you can then integrate into your own applications. More precisely it's written in JavaScript or TypeScript and uses the React framework.
06:07
But it also works. We have like a browser-ready version pre-bundled so that you can also integrate it into other frameworks. But the main focus is actually on React.
06:20
So that's one of the most important messages here today. That you can use GeoStyler for your own applications. It's not just the demo application. It's not an application itself but it is a library that you can use. As I said before, GeoStyler is not just an editor. But it's also a converter between different styling formats.
06:40
So how did we achieve that? We started with the need of supporting open layer styles and SLD. And so we thought, okay, we might be able to convert between these different formats. But as soon as there will be more formats, the complexity rises very, very strong. Or increases very, very strongly.
07:01
So we said, okay, it might be easier to create our own styling format. Which is not intended to be a new standard or anything. It's more seen as an interchange format. Or exchange format between the different, let's say, official styling formats. Which we call the GeoStyler style.
07:22
And our concept is that all we create tools we call parsers. That convert between the different styling formats. But always from an external format to the GeoStyler format. And from the GeoStyler format to that external format. And then you kind of achieve this transitivity.
07:42
So what this allows us for if we have multiple external formats that we support. And we can convert in both directions. That also means that we, for example, can convert from SLD to open layers. Or we can convert from open layers to Mapbox. Or we can convert from QJS to open layers if you want to switch from desktop applications to the web.
08:05
Right now we support the format that you can see here. Which is the SLD format as well as Mapbox or MapLeaper format. The open layer styles and QJS styles. And also MapServer. Please notice that on the MapServer parser you see the arrow just goes into one direction currently.
08:28
So we are working on also improving the parser bi-directionally. But so far we can only convert from MapServer styles to other formats.
08:42
Also, this list is not complete. If you have the need for other formats, please contact us. We try to engage and create a community around GeoStyler. And the more parsers we have that actually are useful for people, the better it is. So maybe if people are interested in, for example, an ArcGIS parser, that would be pretty cool.
09:04
So that we also get out of just this OSGeo bubble and maybe take a look a little further. So which problems does GeoStyler solve? Well, one thing is the editing of styles. So instead of writing within a text file, we have the simplicity of using a graphical editor.
09:26
That makes things easy. For example, when you think about colors, you usually never... You might know some hex codes and what that means, usually when they are all the same letters. But often times you don't know which color it is, so you need some other color. Pick another tool to actually decide how to set that property.
09:43
So it's usually easier to use a graphical editor for that. So this is one of the big benefits of GeoStyler. So you can edit styles and also you don't need expert knowledge anymore. Because it's just a graphical editor. Usually users, also not very technical users, are able to define colors and stroke widths and so on.
10:03
But it's a different kind of set if you have to think about the structure of a styling format. Or just clicking it in the UI. So also if you are for example working with multiple data formats, you have to know the specifications of the different data formats. Using GeoStyler, we have an additional level of abstraction using this UI.
10:26
And this enables users to directly work with different styles without the need of having this expert knowledge. Also, GeoStyler is suitable for automation. If you have seen the Map Server talk before by Seth,
10:40
you could see that he uses the GeoStyler command line interface to convert file-based styles to other styles. So we created a tool, that's the GeoStyler CLI, that allows you to convert multiple files with one command to any other format. So if you have a set of files, for example if you use Map Server and you have hundreds of layers and hundreds of styles,
11:06
you are able with one command to also convert this to any other format in case you want to use any other tool. Or you want for example a switch to vector styles and use it in the client so you convert it for example to open layers. It makes it pretty simple to do this.
11:22
You can of course add this command line interface into your backend and convert on the fly. If you don't want to use JavaScript for example. So this makes it really easy and gives a whole new space of usability for GeoStyler.
11:40
Let's talk about new features. We have new translations. So since the last presentation here at Phosphogee, we now also support French and Hungarian translations, additional to Chinese, English, German and Spanish that we already support. So that is pretty great.
12:01
If you want to contribute to GeoStyler, I guess the simplest way is to just provide new translations of languages that we do not support yet. Because this is really straightforward. Also as I mentioned before, we have a new layout, which we call the card layout. It's still more or less and better I would say.
12:22
But it is nearly feature complete so that it is on par with the tabular layout. And as I said before, it's especially useful when having limited width. So what you can see here is the overview of a style. So you see the different rules and a preview of the different rules that apply.
12:40
If you click on one of these rules, you get an overview of that single rule. So you can, for example, specify the scale denominators and specify the symbolizers and the filters. And then clicking on a symbolizer, you get to the editor where you can then edit a specific symbology.
13:02
This then can look like this. You don't have to use so much space as we did in this application. So you see there's a lot of horizontal white space. So this card layout can really be trimmed down and nicely be used in, for example, side draw, side bars, all of that where you have limited widths.
13:20
And there it comes in really, really handy. Also, we support attributive labels. So usually when you are labeling things, you don't want to have static labels, but you want them based on certain attributes of your dataset. And this is supported with GeoSteuler. Please excuse the German example.
13:40
I used this slide on a German speaking conference and I was a little too lazy to update it. So what you can do is you can create some templating style or text. And GeoSteuler or the editor then also autocompletes this templating. So if you start with the double curly braces, you directly get a dropdown of all the attributes that you have connected by your dataset.
14:06
And then, of course, the renderer itself, for example, in this case it's OpenLayers, then considers this and renders it based on this attribute. Talking about this, it's also quite clear that you can enhance this not only to labeling but also to the other features.
14:27
And this is something that you have already heard in the talk by Olivia in the talk about OpenLayers before on this track. And you heard it many times before as well because it's not completely new, but it is really changing the way on how you can create styles.
14:42
And this is expressions. So you can use attributes of styling instead of, for example, providing different rules and filters for one thing and hard code the values. You can really use the attributes and the data of your dataset as a base value for computations. And that leads to more compact rules and also it's kind of a shift in the mindset on how you want to style data.
15:08
So this really helps. Geostyler is not limited to one way or the other. It allows you to do both. And so, again, as a user, you can decide what's most useful for you. Talking about expressions, we updated the UI, so we now are able to edit expressions in the UI.
15:27
You don't need to have detailed knowledge of all of that. It's pretty straightforward. For example, in this case, if you want to set the radius dynamically using the population or the logarithmic value,
15:40
or at least have the size of five pixels in that case to set a minimum radius, you can just do this in the UI and edit it like this. So you can really just set the size of a feature, for example, with just one single rule,
16:01
and you don't have to do all the filtering by hand, and this really comes in handy. Please note that not all parsers yet support expressions, but OpenLayers does, Mapbox does, and SLD to a certain degree. We are currently working on that. We also changed how you can configure Geostyler.
16:24
Usually when you use React applications, you use the components down at the bottom. You use the style component for Geostyler, and we created a context for better being able to configure Geostyler. You can compose Geostyler with a context object.
16:43
For example, you can change the visibility of certain fields. If you want your users to not be able, for example, to edit the opacity field of the line editor in this case, you can just set it to false and it will not be rendered. For example, if you want to set default values to your input fields, you can also do this by just this one configuration object.
17:05
You can also include or exclude complete editors. If you want your users only to be able to style polygons and style lines, but not be able to apply icons to it, you can disable the icon editor.
17:20
It is really easy, it is just a configuration object to configure Geostyler to your needs. This object can also be used to overwrite the locates and provide your own labels to it. When you use the style component, you use it as usual. You add the style and use the chain handlers, and then you just wrap the context around it and apply as a value the configuration object to it.
17:49
Also, we have the Geostyler command line interface, I already introduced before. What is new is that we now provide executables, so you do not need Node.js anymore. The executables, on every release, we provide them on GitHub as a download, so it will be there as an asset.
18:06
It supports Linux, MacOS, and Windows. The nice thing is that these executables are self-contained, so you really download just this executable, you do not have to install anything, and then you can run Geostyler on the command line and do your automated transformations.
18:23
Also, we strongly improved the Mapbox parser, so it supports the latest version of our Geostyler style. As I mentioned before, it supports expressions, and by that it is now a first-class citizen within the Geostyler ecosystem. We also created a new demo application that just focuses on converting between styles.
18:45
So you have on the left side one editor, on the right side another editor. You can paste your own style, switch the different formats, and just copy your style, save your style, and use it. It just comes in handy when you want to quickly edit or copy a style, convert one style,
19:01
and just use it directly without having to install anything. Talking about the community, we had two code sprints in the last two years which were a great success. You can read about the blog post on the Geostyler homepage. The slides also are online. I shared the link on the first slide. It is on GitHub.
19:23
The slides will remain online, so you can also click on the links. I would like to thank all the participants. It was great fun. Also, we made second place on the pub quiz, so great work on that. Talking about a code sprint, we are also planning the next code sprint in 2024.
19:41
It is yet unclear when we will do it and where we are going to do it. If you are interested, I invite you to come to such a code sprint because it is great fun. Just check out the geostyler.org website because we will announce the code sprint there. At this place, I would like to thank all the contributors who constantly work on Geostyler and improve it.
20:01
It is really important that you have a community around that is really interested in the topic. Right now, even though we are still a small community, we are really motivated and engaged people. Thanks to all the contributors for your work so far. I think because of the time, I will skip one or two things.
20:20
Check out Geostyler on geostyler.org. There is all the information. Let us talk about what is going on in the future. As I said before, not all parsers yet support the expressions, which is, I think, really the killer feature of Geostyler in the future. We are working on the support for expressions for all the parsers that we support.
20:42
Also, we would like to create a new parser if you have been at the talk about the new SimCore specification yesterday by Jerome. It is really interesting. The new OGC API support or is introducing a new style specification. We are trying to create a parser for that.
21:02
So far, we only have the TypeScript typings. We still need to create the parser, but we hope that we can provide this in the future for better adaptation of this new parser, especially in combination with this conversion possibility. It might come in handy when you want to switch to the new format or just want to use it in your backend,
21:22
for example, with the OGC API styles endpoint that supports multiple styles. In that case, Geostyler probably will come in quite handy. Of course, we are also always eager to update and improving our docs and the tutorials and everything that helps onboarding making easier.
21:45
It is always a lot of work, and we just always have a limited amount of time. So if there are people who are trying to help us or who want to help us, want to contribute, that would be really great. At that point, I would really like to thank you for your attention and have a lot of fun on the Phospho G. Thank you.