Smart Component 08
Green downhill arrows.
Green downhill arrows reuse the renderer's calibrated slope-arrow placement as an independent SVG layer. CADDIE.100 privately samples the putting surface and resolves either consolidated fluid fall lines or staggered traditional arrows for the exact artifact. The browser receives only final drawing geometry—not slope measurements or reusable terrain data.
Usage
Add the green downhill arrows to a graphic.
Include the component in the initial mount call, reconcile it through view.setSmartComponents, or append it with view.addSmartComponent. Types may repeat. Give repeated instances stable id values to style, show, hide, move, reset, or remove one instance independently. The selected Smart Component type, instance ID, render receipt, and protected selection options such as yardages, grid spacing, coverage, measured origin, buffer distance, detail, limits, or targets are sent to the overlay service. Marker-image origins, images, presentation styles, supported labels, and movement remain local.
const view = await caddie.mount(container, graphicRequest, [{
type: "green-downhill-arrows",
layout: "fluid",
density: "medium",
style: { color: "#142622", opacity: 1 },
}]);
// Presentation remains local after the protected geometry is resolved.
view.setSmartComponentStyle({
type: "green-downhill-arrows",
style: { color: "#FFFFFF", opacity: 0.8 },
});
view.setSmartComponentVisible("green-downhill-arrows", false);Defaults
Built-in presentation.
Component options
Configure behavior and presentation.
| Option | Type | Default | Description |
|---|---|---|---|
| type | "green-downhill-arrows" | Required | Requests downhill terrain-direction arrows for a Hole or Green graphic. |
| id | string | Automatic | Optional stable 1–64 character instance ID using letters, numbers, underscores, or hyphens. Use IDs to independently control repeated Smart Components of the same type. |
| layout | "fluid" | "grid" | "fluid" | Uses consolidated curved fall lines or the established staggered traditional straight-arrow design. |
| density | "light" | "medium" | "high" | "medium" | Controls protected placement density and spacing without exposing the source putting samples. |
| style.color | #RRGGBB | "#142622" | Local SVG path and arrowhead color. |
| style.opacity | number | 1 | Local SVG opacity from 0.1 through 1. |
Behavior
Important implementation details.
- Fluid paths trace and consolidate natural fall lines. Grid layout uses the renderer's traditional staggered straight shafts and triangular heads.
- The arrows indicate downhill terrain direction. They are not a predicted putt line and do not prescribe aim or speed.
- Changing layout or density requests new final drawing instructions against the cached sidecar. Changing color, opacity, or visibility is an immediate local SVG update.
- The clean graphic remains unchanged and downloadable without the arrows.
- The response contains only final path points, visible body widths, and arrowhead polygons. It excludes slope percentages, downhill bearings, elevations, putting samples, green boundaries, coordinates, transforms, and the internal sidecar.
- Green downhill arrows are locked and cannot be moved or reset.