@@ -4503,38 +4503,35 @@ <h5>Conclusion</h5>
4503
4503
< section id ="capability-implement-a-custom-control " data-ucr-role ="capability ">
4504
4504
< h4 > Implement a custom control</ h4 >
4505
4505
< p >
4506
- A custom control is a user interface element that is
4507
- integrated closely with the map's own user interface, and is
4508
- under the control of the map once it has ben added.
4506
+ Controls are user interface elements that enable interaction with the map.
4507
+ Map implementations typically provide a number of default controls supporting interactions such as zooming
4508
+ and switching layers.
4509
+ </ p >
4510
+ < p >
4511
+ A map implementation will typically provide the developer with various options for configuring controls.
4512
+ This will include such capabilities as adding and removing controls, showing or hiding them,
4513
+ and being notified of changes in their state.
4514
+ It is also necessary to provide support for controlling the positioning of controls,
4515
+ to avoid the situation where two controls occupy the same position on the map's UI.
4516
+ </ p >
4517
+ < p >
4518
+ Developers may wish to implement additional controls, either replacing the functionality of the map's default controls,
4519
+ or adding new functionality.
4520
+ Map implementations should provide APIs to support such custom controls,
4521
+ allowing them to integrate fully with the map at a level that is on a par with the map's own controls.
4509
4522
</ p >
4510
4523
< p class ="issue discussion " data-number ="57 ">
4511
4524
Discuss this section on GitHub.
4512
4525
</ p >
4513
4526
4514
4527
< h5 > Existing implementations</ h5 >
4515
4528
< p >
4516
- A custom control is a JavaScript object or a DOM element
4517
- that satisfies the API's requirements for it to be
4518
- integrated with the map.
4519
- Those requirements vary across APIs.
4520
- Generally, it is expected that a single DOM element
4521
- containing whatever other elements constitute the control UI
4522
- will be provided by the control.
4523
- In some cases the DOM element is passed to the API directly;
4524
- in others, a JavaScript object is passed to the API, which
4525
- is required to implement a method that returns the control's
4526
- containing DOM element.
4527
- Styling of the elements within the control is the
4528
- responsibility of the implementor.
4529
- </ p >
4530
- < p >
4531
- Assuming the API requirements are satisfied, the behaviour
4532
- and rendering of the control are then the responsibility of
4533
- the implementation.
4534
- Typically, a custom control will listen to events from the
4535
- DOM, or the map, or both.
4536
- In response to those events, it will then update the state
4537
- of the map, update its own representation, or both.
4529
+ Support for controls varies widely among existing map implementations.
4530
+ It is generally the developer's responsibility to create a suitable DOM construct,
4531
+ styled with CSS and augmented with JavaScript to provide behaviour, for use as a control.
4532
+ But though some implementations specify detailed APIs which controls should support
4533
+ in order to be properly integrated with the map, others provide minimal support and expect the
4534
+ developer to take full responsibility for responding to control lifecycle transitions.
4538
4535
</ p >
4539
4536
< dl data-ucr-role ="implementation-notes ">
4540
4537
<!-- Use dt elements to name the implementation, using the id string to create an auto-link.
@@ -4543,24 +4540,57 @@ <h5>Existing implementations</h5>
4543
4540
List full implementations first.
4544
4541
Group implementations (multiple dt for the same dd) when they have the same support.
4545
4542
-->
4546
- < dt > google-maps-api</ dt >
4547
4543
< dt > mapbox-gl-api</ dt >
4548
4544
< dt > leaflet-api</ dt >
4549
4545
< dt > open-layers-api</ dt >
4546
+ < dt > tomtom</ dt >
4550
4547
< dd > < a > full support</ a > :
4551
- These APIs all define requirements for a JavaScript object or DOM element
4552
- to be able to be used as a custom control.
4548
+ < p >
4549
+ All of these implementations fully support the concept of controls,
4550
+ including support for control implementations to be notifed when they are added to or removed from the map,
4551
+ so they can update their own internal state acordingly.
4552
+ They also allow controls to request their desired positioning within the map's UI,
4553
+ and will position controls using sensible defaults if developers choose not to implement that capability.
4554
+ </ p >
4555
+ < p >
4556
+ MapBoxGL specifies an interface to which controls are expected to conform.
4557
+ The map API provides methods for adding and removing controls to and from the map UI.
4558
+ </ p >
4559
+ < p >
4560
+ Leaflet, TomTom (which uses Leaflet), and OpenLayers provide base classes which controls extend,
4561
+ along with map methods for adding and removing controls.
4562
+ OpenLayers also exposes its control collection directly.
4563
+ </ p >
4564
+ </ dd >
4565
+ < dt > google-maps-api</ dt >
4566
+ < dd > < a > supported, with limitations</ a > :
4567
+ < p >
4568
+ While Google Maps supports the adding and removing of controls and the specifying of their placement
4569
+ within a number of predefined areas within the map's UI,
4570
+ there is no specific interface to which they are expected to conform.
4571
+ </ p >
4553
4572
</ dd >
4554
4573
< dt > bing-maps-api</ dt >
4574
+ < dd > < a > partial support</ a > :
4575
+ < p >
4576
+ Bing Maps expects controls to be implemented as a type of overlay.
4577
+ It provides no particular support for controls beyond that, not even for positioning them within the map UI,
4578
+ which is left to the developer to achieve using CSS positioning.
4579
+ </ p >
4555
4580
< dt > apple-mapkit-js-api</ dt >
4556
- < dd > < a > supported, with limitations</ a > :
4557
- Items having the form and behaviour of custom controls can
4558
- be implemented in the form of overlays, but there is no facility for
4559
- distinguishing such controls from other overlays.
4581
+ < dd > < a > no support</ a > a> :
4582
+ < p >
4583
+ Apple MapkitJS does not provide an interface that can be implemented to create a custom control,
4584
+ nor does it have any generic mechanism for adding and removing controls beyond those provided.
4585
+ </ p >
4560
4586
</ dd >
4561
4587
< dt > d3-geographies-api</ dt >
4562
4588
< dd > < a > not applicable</ a > :
4563
4589
<!-- details about what is/isn't supported -->
4590
+ < p >
4591
+ Although d3 supports a variety of user interactions, the concept of a user interface presenting a collection
4592
+ of controls to the user is not part of the library.
4593
+ </ p >
4564
4594
</ dd >
4565
4595
</ dl >
4566
4596
@@ -4569,7 +4599,9 @@ <h5>Supported use cases</h5>
4569
4599
4570
4600
< h5 > Uses beyond mapping</ h5 >
4571
4601
< p >
4572
- ToDo
4602
+ As controls are explicitly intended as part of the map's user interface,
4603
+ further uses for the concept might be found in other cases
4604
+ where complex interactive content is presented by an element, such as adding controls to media containers.
4573
4605
</ p >
4574
4606
4575
4607
< h5 > Related web specifications</ h5 >
@@ -4585,7 +4617,10 @@ <h5>Conclusion</h5>
4585
4617
See examples.
4586
4618
-->
4587
4619
< p >
4588
- Based on the limited data, we are < a data-ucr-role ="conclusion "> undecided</ a > about whether this should be a requirement.
4620
+ It might seem that, as controls are implemented using existing interactive HTML elements,
4621
+ there is no pressing need for them to be supported by additional APIS.
4622
+ However, the need for them to be closely integrated with a map's own UI, state, and lifecycle
4623
+ suggests that this functionality is a < a data-ucr-role ="conclusion "> requirement</ a > for modern web maps.
4589
4624
</ p >
4590
4625
< ul data-ucr-role ="conclusion-notes ">
4591
4626
<!-- bullet-point notes summarizing implementation details / blocking issues.
0 commit comments