W3C/OGC Maps for the Web workshop

24 Sep 2020




UI patterns in existing web map widgets, Nic Chan

<tguild> Nic Chan's presentation video

<AmeliaBR> @Malvoz's review & discussion:

<AmeliaBR> https://github.com/Malvoz/web-maps-wcag-evaluation/blob/master/README.md

<AmeliaBR> https://github.com/Maps4HTML/chat/issues/10

<briankardell_twitter> note this is another place we might have a common lower level thing - tv and games also have spatial navigation needs

<thehabes> I am guilty. I like the `<a>` better than the `<button>` in Chota CSS. I'll rethink my habits.

<briankardell_twitter> there's an interesting conversation on a whatwg log in web components whatwg from like 09 on this example actually

<thehabes> The label thing is fascinating. I have never even thought about having to handle that in, like, Leaflet. I am not sure I would even be able to change that kind of behavior without some hefty helper function to traverse layers and find those darn things.

<briankardell_twitter> this was a good presentation, I'm not sure the nick but very interesting

<IvanSanchez_gitlab> I do remember there was one issue in the Leaflet bug tracker regarding the i18n of the alt text for the default controls (i.e. being able to translate "zoom in")

<zcorpan> Very insightful, thanks @nchan0154 !

<satakagi> :+1:

<thehabes> Yes, thank you @nchan0154 . It was tough to be called out, but these are the exact kind of oversights that happen with devs.

<fredesch> what screen reader are you using?

<briankardell_twitter> I lost connection for a minute - what is the talk now? I missed the title

<AmeliaBR> Nic's slides: https://wcag-maps.nicchan.me/

<AmeliaBR> (sorry we didn't have that link on the agenda)

<briankardell_twitter> it might be helpful if we added the topic and nick for the person here

<zcorpan> @briankardell_twitter Introduction to Digital Nonvisual Maps

Introduction to Digital Nonvisual Maps

<briankardell_twitter> thanks

<AmeliaBR> Brandon's slides as PowerPoint: https://www.w3.org/2020/maps/supporting-material-uploads/presentations/Brandon_Biggs.pptx

<tguild> Brandon Biggs' slides

<thehabes> 3D sound is such an interesting topic, and I struggle to understand it.

<thehabes> I want to know if you have every been approached by people who study poetry or music. Being able to know what things sound like from different points in a given space is a topic in the humanities

<AmeliaBR> https://xrnavigation.io/audiom-getting-started/

<fredesch> I use safari on a MacBook and stuff on the site did not work for me.

<thehabes> +1 for GeoJSON

<baditaflorin> https://github.com/Leaflet/Leaflet.Editable

<prushforth> http://www.cs.umd.edu/hcil/audiomap/

<baditaflorin> @bdon_gitlab and I would strip the lat/long to 6-7 decimals https://en.wikipedia.org/wiki/Decimal_degrees

<prushforth> http://www.cs.umd.edu/hcil/audiomap/

<prushforth> http://www.cs.umd.edu/hcil/audiomap/

<prushforth> https://github.com/Leaflet/Leaflet.Editable

<baditaflorin> Tool for finding the most used OSM tags in the world https://taginfo.openstreetmap.org/

<thehabes> I have a question on granularity...do you see this being granular enough to help someone get around their favorite baseball/soccer (football) (futbol) stadium?

<thehabes> Like could it help you get to the vendor you want, or the bathrooms nearby, etc.

<baditaflorin> https://overpass-turbo.eu/ for dinamic query of OSM and can return GeoJson

<thehabes> Nice, that's super cool. I wasn't sure if Mapbox or your geo system in the background even got that granular.

<thehabes> A Audio 3D preview of the venue you want to go to, to get your bearings ahead of time. Great question @AmeliaBR

<thehabes> Will it be able to support 3D "sound packs"? Not sure if that is a whole new filetype or something

<rahola_gitlab> In the future I wonder if this could link with sensor data to provide live navigation based on real conditions. E.g. if I'm walking and a sensor knows there is ice or a snowbank in front of me, I could be directed away from a hazard.

<AmeliaBR> > Not sure if that is a whole new filetype or something

<AmeliaBR> Interesting question. I wonder if surround-sound audio formats for movies & games could be adapted?

<thehabes> oh man the bushes. What a fringe case.

<baditaflorin> https://wheelmap.org/ showing locations in osm that are accessible/partial accessible or not accesible

<thehabes> I see, that makes sense. Again, the magic of 3D sound eludes me.

<AmeliaBR> [edit] > Not sure if that is a whole new filetype or something

<AmeliaBR> [edit] Interesting question.

<AmeliaBR> [edit]

<AmeliaBR> [edit] I wonder if surround-sound audio formats for movies & games could be adapted?

<tguild> people behind wheelmap.org started a W3C Community Group, Linked Data for Accessibility https://www.w3.org/community/lda/

<thehabes> No, it is not there yet. Much to the chagrin of the poet and music studies.

<thehabes> Like Waze tells you about road hazards...that's definitely it's own layer of complexity

<NicolasRafaelPalomino> > In the future I wonder if this could link with sensor data to provide live navigation based on real conditions. E.g. if I'm walking and a sensor knows there is ice or a snowbank in front of me, I could be directed away from a hazard.

<NicolasRafaelPalomino> > In the future I wonder if this could link with sensor data to provide live navigation based on real conditions. E.g. if I'm walking and a sensor knows there is ice or a snowbank in front of me, I could be directed away from a hazard.

<NicolasRafaelPalomino> Sensor data would have to interact with physical material information to give in-context and in-real time data throug audio. That extension could also help mapping

<NicolasRafaelPalomino> digital mapping*

<tguild> [intermission]

<tguild> scribenick: ted

The <map> and <layer> speculative polyfill (MapML)

<tguild> Breakout led by Peter Rushforth

<tguild> Peter: Part 2 of MapML proposal about why we believe maps needed for browser

<tguild> … explain tile coordinate reference system, effort to coordinate spatial reference systems to be implemented by browser

<tguild> … will cover details of the mapml proposal, seeking help to better define and improve how they are implementable

<tguild> … location in mapml is a general term by anything that can be represented by coordinates and zoom value

<fredesch> Why do you use an input element? There are enough input roles already.

<tguild> [discussion of position element. input types height and width to represent rectangle]

<tguild> [input type location, serializes parts. regular location and geometry]

<tguild> [anticipate possibility to rotate map]

<tguild> [location should always have a zoom level and accompanying scale]

<tguild> [example on tile events]

<IvanSanchez_gitlab> One of my wild ideas is to get rid of "zoom level", and specify the scale as the number of CRS units *on a diagonal*, to cover the use case of dynamic container sizes (i.e. when the map uses `vh` and/or `vw`)

<fredesch> I forget what happens with Mercator at the equator? Does't nothing shift by 10,000 or something?

<tguild> [meta element]

<thehabes> Comment on H and W : This is best to require with image "primitive" sources. You never know where that image might be used, and devs will need that H and W to have a ratio for the "like rectangle" math to draw things that specifically target the image, instead of the map. It is a granularity thing, it depends how much granular control you expect to give devs over the image specifically.

<tguild> [datalist, shard keyword]

<tguild> [select input]

<satakagi> @IvanSanchez_gitlab

<satakagi> The SVGMap.js I'm implementing doesn't have a concept of zoom levels either, because it's based on svg's viewBox.

<thehabes> Being a "all I have is that which I can target with a Web Annotation" guy, it is extremely important I get that ratio for things like media fragment syntax (https://www.w3.org/TR/media-frags/)

<tguild> [html uses opaque urls for js, css etc with link. href a hyperlink, glue for federated nature of web]

<IvanSanchez_gitlab> @fredesch The equator is the magical place where the CRS units of EPSG:3857 ("web mercator") in the longitude axis (the horizontal/x axis) equal meters. Anywhere else there's distortion.

<tguild> [advantage of sharing information via http. browsers synthesis and render]

<IvanSanchez_gitlab> re: `<layer>`, I refer to the part of my essay where I ask to stop calling things "layers"

<fredesch> I believe in Mercator projection Norhting shifts at the equator as the projection wants to avoid negative coordinates

<thehabes> @IvanSanchez_gitlab +1

<tguild> [layers, rel=legend]

<IvanSanchez_gitlab> @fredesch You might be referring to traverse mercator (UTM), which defines distinct north/south hemisphere CRSs to avoid negative northings

<tguild> Peter: part of the proposal for implementing alternate styles. additional rel value of self style, can similate eg satellite or hybrid view

<IvanSanchez_gitlab> not that there's anything wrong with a negative northing, though.

<satakagi> From the point of view of compatibility with CSS and SVG concepts, I believe that concepts such as zoom level and tile coordinate system, which are strongly dependent on the equally-divided tile pyramid of maps, have a large conceptual gap.

<tguild> … a key value is to separate content

<tguild> … small set of projections supported by proposal currently

<tguild> … if someone adds a projection layer that doesn't match the map, use alternate instead

<fredesch> @IvanSanchez_gitlab ahh, I think you are right about TM vs M

<tguild> … tiles images and features are synonymous, should be factored out into media types

<tguild> … we implemented a kind of link that allows you to set zoom in/out relation

<tguild> … we have query support for features

<tguild> … link rel=query

<fredesch> It seems this spec is pretty tile oriented

<satakagi> :+1:

<tguild> [link rel=query slide]

<tguild> [OGC features]

<tguild> [GeoJSON and HTML - combined strenghts]

<AmeliaBR> Fred… just when you thought it was all about tiles, here we get `<feature>`!

<satakagi> Tile is just one of the adaptive methods for delivering a portion of a huge map resource with reasonable performance.

<fredesch> Why won't SVG work?

<IvanSanchez_gitlab> I'm having a waking nightmare with the axis order (lat-lng lng-lat) right now

<IvanSanchez_gitlab> and flashbacks about WKT-in-GML

<IvanSanchez_gitlab> (also, GML already exists)

<satakagi> By the way, it's also a nightmare when the y direction is reversed.

<satakagi> [edit] By the way, it's also a nightmare that the y direction is reversed.

<tguild> [links slide, future usage for federation of services]

<fredesch> @satakagi very true

<tguild> [links stylable, can be activated]

<IvanSanchez_gitlab> This sounds reminiscent of XSLT over GML to get SVG

<tguild> [tile element slide]

<tguild> [img and other html tags]

<tguild> [useful for embedding meta data]

<fredesch> At SPSS we added the ability to make chloropeth maps by sucking in shp files. This looks worse for a developer.

<tguild> [OGC web services and APIs, mapml document element]

<tguild> [mapml abandoned xml namespace but can be corrected, using html5]

<nchan0154> (belated thank you for the kind words everyone! happy to answer any more specific accessibility related questions or test fixes if you are a library author wanting to improve!)

<tguild> Peter: what does it mean for a map to be accessible? Robert and Nic lent to that earlier

<tguild> … allowing websites to represent physical world in a standard way will enable necessary accessibility innovation

<tguild> … animation isn't something that has been considered yet, can be factored in future discussions

<tguild> … we need ability to create spatial content

<fredesch> What I don't like is reusing element names that exist in HTML. Validation tools already have a problem with false failures when SVG is in a web page. Reusing element names in MapML will make that problem worse.

<tguild> … more needed for DOM api of elements and attributes?

<tguild> … could DOM be leveraged for OpenLayers?

<tguild> … CORS considerations to reduce risk

<tguild> … not including JS potentially a saving grace

<tguild> … html parser should be used as mapml document requires it. when svg is parsed into an image, is a similar scenario

<tguild> … happy to do a demo or answer questions

<tguild> Amelia: I think we had some questions coming in on the chat, hope to go through a few of those but also see your polyfill demo

<thehabes> I have a couple questions. I will use the unmute method and ask when the moment feels right.

<tguild> … concern on complication and reusing html elements

<tguild> … do you want to explain the thinking that led to this proposal?

<tguild> Peter: we are not reusing but pushing extensions to existing elements

<tguild> … every new element and attribute an extension to html and comes with effort and expense

<tguild> … I believe html design principles encourages use for given semantic

<tguild> … reusing input element for instance seemed reasonable as this is another form of input

<tguild> Fred: using form elements for a different purpose will cause problems for validation and other tools

<tguild> Peter: I created parser and validator for mapml

<tguild> Fred: W3C has problems with embedded svg for example

<tguild> Doug: I don't think we should predicate particular enhancements on flaws of existing tools

<tguild> … understand issue of svg validation but that should not impose advances

<tguild> Peter: my understanding of html design principles you should build upon existing

<tguild> Fred: but input a form element

<tguild> Peter: it is bound to extent element and children

<tguild> … it provides scope for inputs and links in it

<tguild> … as well as action attribute

<tguild> … there is an overlap in the idea

<tguild> … form is bound to action value

<shepazu> I think the <feature> element might better be defined as custom roles (or attributes) to be applied to existing geometry-rendering syntax like the SVG path. I've made a simple GeoJSON-to-SVG converter, and it's pretty trivial. I don't think browsers will have much appetite for adding new syntax there

<tguild> Amelia: there is a core similarity, form and form inputs are used to access possibly infinite set of urls based on user action

<satakagi> The map element was originally a function called imagemap, which makes images clickable. It's relatively understandable since geographic maps include that function as well. However, I think it needs to continue to be a feature that encompasses uses other than map. On the other hand, I don't like the idea of changing a concept that's so heavily reliant on the geo-industry, and I don't think it's desirable in many ways.

<tguild> … extent inputs build up possibly infinite urls on user's panning and zooming on map, clear similarity

<tguild> … similar to parameters of a query to database server

<tguild> … I see the logic but understand Fred's concern on overloading an element

<tguild> Doug: we cannot even get new input elements of html5 consistent in browsers

<tguild> … which is to Fred's point

<tguild> … overloading input at this point asking alot of browsers. there is an elegance to it but less so when already overloaded

<tguild> Peter: I would point people back to html design principles. is something provides a variable value, should you invent a new mechanism or use existing?

<tguild> … inputs are what are used today

<tguild> … html isn't frozen

<tguild> Doug: theoretically you are correct but also need to look at recent history of how extending markup is viewed in html group

<tguild> … there is strong resistance to change

<satakagi> As for the input element, before that, there is a discussion about what to do with the template for the tiles. I commented on it on discourse.

<tguild> … long term it might be the better solution but extent you are changing inputs may make implementation more complicated

<tguild> Peter: if another mechanism would fly better, I say sure

<tguild> … we can redo that part of the proposal. I am saying they are like inputs in forms and want to start the debate at that point

<satakagi> [edit] As for the input element, before that, there is a discussion about what to do with the template for the tiles. I commented on it on discourse.

<satakagi> [edit] https://discourse.wicg.io/t/ogc-api-tiles-as-provider-of-tiles-and-mapml-documents/4811

<tguild> Fred: Google maps uses a zoom level and centerpoint and it is pretty simple, using raster tiles

<tguild> Peter: that was in part 1 presentation. long/lat as starting positions for map

<tguild> Fred: I saw that but today you were talking about corners and all sorts of stuff

<IvanSanchez_gitlab> The use case for *not* specifying map view as center/zoom is that a lot of people want to specify maximum map bounds

<IvanSanchez_gitlab> e.g. "display at most 180 degrees of longitude" as mapkit does

<tguild> Bryan: essentially what we have is forms and use them to avoid using js, using primitives...

<IvanSanchez_gitlab> and the casuistic of a bbox with different screen sizes is *hell*

<tguild> … want to be able to provide context. I am wondering if you are considering a rdf style or json-ld schema

<tguild> Peter: outside my expertise

<tguild> Bryan: you have to implement syntax to ensure proper parsing, so curious how you are going to express hierarchy in coordinates

<tguild> Peter: @@

<tguild> Bryan: ah you are going to use the coordinates themselves

<tguild> Peter: hyperlink anchors around coordinates or parts of coordinates

<tguild> … coordinates are lowest level element

<tguild> Bryan: can you nest them?

<tguild> Peter: no based on GeoJSON

<tguild> Bryan: good answer

<tguild> … when you did doctype mapml, was that like your schema?

<tguild> Peter: purpose is like a media type, next level processing

<tguild> … similar to accept headers

<tguild> … similar to a source attribute request, it gets drawn by renderer in coordinate space

<tguild> … fits within html parser

<tguild> … we haven't closed loop with Simon but pushing for that as a second tier media type indication

<tguild> Bryan: I have never asked why I need to do doctype html all these years, probably for the parser

<tguild> Peter: adding modes or changing expectations of parser makes them (browser vendors) nervous

<tguild> Bryan: where can I find more about features elenent

<tguild> Peter searching for link on current draft

<tguild> Peter: in our mapml repository

<tguild> @@uri

<tguild> … I could do a quick demo

<AmeliaBR> https://maps4html.org/ for more links

<tguild> Fred: do you have support for gazateer, geographic names

<tguild> [refering back to Ivan's typed question/comment]

<tguild> Amelia: bounding box can be more flexible than vector graph, you can have continuous zoom

<IvanSanchez_gitlab> Yeah, bounding boxes might be good, but then you got users with cellphones, they rotate the cellphone, and the bug reports start coming in

<tguild> Peter: you can set extent for visible behavior. use bbox to zoom to extent, is that good enough?

<tguild> [Peter shares screen]

<IvanSanchez_gitlab> I still think something like scale of CRS units on a diagonal might be better in the long run, but I'm not 100% sure

<tguild> Peter: this is polyfill based on leaflet

<tguild> … showing tile grid, properties of map

<satakagi> There was an action on introducing the concept of scale into CSS a few years ago.

<satakagi> http://svgmap.org/devinfo/devstd/CSS_Transforms_Diff/

<baditaflorin> https://umap.openstreetmap.fr/en/ is a great example of simple things for creating a map, and some of the settings that the have, like the limit of the extent and zoom for the specific map

<baditaflorin> https://umap.openstreetmap.fr/en/map/somes-delivery-somesul-din-cluj_499724#12/46.7754/23.6263

<tguild> … each layer has extent property, corners of corners of event are stored

<AmeliaBR> Ivan, that's why (the rotating view/changing screen dimension issue) you need SVG-style viewBox, which sets either the maximum or minimum coordinates to fit in the view, but lets the aspect ratio be maintained.

<tguild> … plan is to fit bbox at maximum possible zoom, save starting conditions as lat/long/zoom

<satakagi> I've been working on this document for a use case for a scalable map.

<tguild> Badita: you will zoom to an initial location but think question more about zooming to maximum extent eg beyond city of country level

<tguild> … there are cases where you want to confine them to a maximum

<tguild> Peter: no plan for that at present, could be an extension

<IvanSanchez_gitlab> The hell use case for this is users who want mapkitjs behaviour: a maximum *longitude span* of either 180° or 360° , but *no* maximum bbox

<tguild> [Peter continuing demo]

<fredesch> that's cool

<tguild> Peter: it works pretty well for WMS and styles

<tguild> … what I was showing earlier is ability to query at particular locations

<tguild> … geo server returning elements with map feature in it, properties shown in leaflet popup

<tguild> … one of the challenges is in how to allow slideouts and capture event

<tguild> … web designers will have their own ideas on

<tguild> s/representatino/representations/

<tguild> … that is available in a custom element, we need to package it up but you should be able to download, unzip and use it

<tguild> … remote document is a simple view source type document

<tguild> … you can add layers willy nilly, there is a limit. a layer cannot contain other layers but as much template and content as you want

<tguild> … you can change their zed index like you can any other part of html and svg

<tguild> … this particular page breaks the back button but you can copy a location on page [but hey its a demo...]

<thehabes> @prushforth Filter Features by Prop.x and Prop.y is not really supported in many of the map stuff. I see you are filtering layers, is it robust neough to filter features by individual properties?

<tguild> … what else is there to show? the mapml extension to geoserver, you can set it up to cache tiles

<tguild> … captures things on first use

<tguild> … geospatial content management systems can pump out html+mapml on day 1

<tguild> … that's my pitch

<tguild> Badita: can you build in buffering?

<shepazu> One way of integrating CSS is to allow an outline on the tile grid elements

<tguild> Peter: it could be managed by api

<tguild> … browser engine can't do everything. developer ecosystem will be facilitated by this proposal but rendering is a full time job

<tguild> … I would encourage progressive enhancement, a js api you can build

<IvanSanchez_gitlab> *Ideally*, the DOM scripting interface would have the same functionalities as, say, Leaflet / OpenLayers / etc, so stuff like custom tile buffers could be in.

<tguild> Bryan: something I have trouble with in leaflet, when I have a ton of points is limit them to just the desired ones. reading all the properties to filter them is costly

<tguild> … do you think you can filter hide/show features by property?

<IvanSanchez_gitlab> @thehabes Define geojson filters, one `L.GeoJSON` per property, then the usual `map.fitBounds(myDesiredFilteredGeoJsonGroup.getBounds())`

<tguild> Bryan: I can seethat the kind of thing that can be in the api, that isn't something you can do with mapbox and leaflet

<IvanSanchez_gitlab> the trick here is digesting the data in filtered groups

<shepazu> That should be another CSS integraation, based on selectors

<tguild> Peter: I have a number of WMS by layer id and I tie that on the server

<shepazu> (clientside, I mean)

<tguild> … user can query that file by clicking on control

<AmeliaBR> @shepazu that sounds nice, but currently selectors only work if the properties are attributes, and not if the properties are child elements in the DOM…

<AmeliaBR> (I mean, I'd love for CSS selectors to be able to filter by child elements, but there's been a lot of push back about implementing that.)

<tguild> Badita: could there be another layer showing eg trees, would that be rendered before, after or random?

<tguild> Peter: at DOM level? image element is base layer, done by document order

<tguild> … if you have layers stacked up, you can make/use your own controls via html

<tguild> … you should be able to get the same events, providing boost in performance of browser engine

<tguild> … this is an area we played with. input can be a useful thing to work with here instead of reinvent - even though everyone hates them...

<satakagi> In SVGMap.js, I made this kind of custom form functionality free to design in the webApps, assigning it all to each layer.

<thehabes> @IvanSanchez_gitlab oo that's tricky. I like that, good tip.

<tguild> Amelia: all of this is on github, join the Community Group and discussion

<tguild> Peter: core of the extension model of leaflet is motivation here

<fredesch> leaflet has a react wrapper - (you can get a leaflet react component)

<karenmyers> See you tomorrow!

<tguild> … thank you very much everyone

<satakagi> :wave:

<karenmyers> oops...next week

<tguild> Amelia: see you next week, same times per day as this week

<tguild> [adjourned]

<thehabes> @karenmyers 2020-09-28 04:00UTC

<thehabes> yeah, you got it

Summary of Action Items

Summary of Resolutions

    [End of minutes]

    Minutes manually created (not a transcript), formatted by David Booth's scribe.perl version 1.154 (CVS log)
    $Date: 2018/09/25 16:35:56 $