<pre id="example_5" class="example" title="Assigning a pen color on PointerDown">

<code>&lt;div style="position:absolute; top:0px; left:0px; width:100px;height:100px;"&gt;&lt;/div&gt;

&lt;script&gt;

window.addEventListener("pointerdown", assignPenColor);

window.addEventListener("pointermove", assignPenColor);

const colorMap = new Map();

function assignPenColor(event) {

const uniqueId = event.persistentDeviceId;

// Check if a unique Id exists.

if (uniqueId == 0) {

return;

}

// Check if a color has been assigned to the device.

if (map.has(uniqueId)) {

return;

}

// Assign a color to the device.

let newColor = getNewColor();

map.set(uniqueId, newColor);

return newColor;

}

function getNewColor() {

/* return some color value */

}

&lt;/script&gt;</code>

long persistentDeviceId = 0;

readonly attribute long persistentDeviceId;

<dt><dfn>persistentDeviceId</dfn></dt>

<dd>

<p>A unique identifier for the pointing device. If the hardware supports multiple pointers, pointer events generated from pointing devices MUST only get a <code>persistentDeviceId</code> if those pointers are uniquely identifiable over the session. If the pointer is uniquely identifiable, the assigned <code>persistentDeviceId</code> to that pointing device will remain constant for the remainder of the session. The <code>persistentDeviceId</code> value of <code>0</code> MUST be reserved and used to indicate events whose generating device could not be identified. Like <a href="#dom-pointerevent-pointerid">pointerId</a>, to minimize the chance of fingerprinting and tracking across different pages or domains, the <code>persistentDeviceId</code> MUST only be associated explicitly with that particular pointing device for the lifetime of the page / session, and a new randomized <code>persistentDeviceId</code> MUST be chosen the next time that particular pointing device is used again in a new session.</p>

<div class="note">Due to digitizer and pointing device hardware constraints, a <code>persistentDeviceId</code> is not guaranteed to be available for all pointer events from a pointing device. For example, the device may not report its hardware id to the digitizer in time for <code>pointerdown</code> to have a <code>persistentDeviceId</code>. In such a case, the <code>persistentDeviceId</code> may initially be <code>0</code> and change to a valid value.</div>

</dd>

<pre id="example_6" class="example" title="Converting between tiltX/tiltY and altitudeAngle/azimuthAngle"><code>/* Converting between tiltX/tiltY and altitudeAngle/azimuthAngle */

<pre id="example_7" class="example" title="Disallowing all direct manipulation behaviors">

<pre id="example_8" class="example" title="Allowing horizontal panning only">

<pre id="example_9" class="example" title="Child regions that disallow direct manipulation behaviors for panning and zooming">

<pre id="example_10" class="example" title="Intermediate parent that disallows direct manipulation behaviors for panning and zooming">

<pre id="example_11" class="example" title="Intermediate parent that restricts allowed direct manipulation behaviors for panning and zooming">

<pre id="example_12" class="example" title="Basic canvas drawing application using the coalesced events list">

<pre id="example_13" class="example" title="Conceptual approach to drawing using coalesced events and predicted events">