forma-embedded-view-sdk
Version:
The Forma Embedded View SDK is a JavaScript library for creating custom extensions in Autodesk Forma (previously Spacemaker).
81 lines (80 loc) • 3.27 kB
JavaScript
/**
* Enables embedded views to add and remove a colorbar to the scene view.
*
* The colorbar is typically used to explain the color scale of analysis heatmap.
*
* <img src="../media/colorbar_wind_comfort_plot.png" width="800px"/>
*
* _Example: Wind comfort analysis where colorbar is used to explain the colors in the plot._
*
* @remarks
* Available via {@link auto.Forma | Forma}.{@link index.EmbeddedViewSdk.colorbar | colorbar}.
*/
export class ColorbarApi {
#iframeMessenger;
/** @hidden */
unsubscribe;
/** @hidden */
constructor(iframeMessenger) {
this.#iframeMessenger = iframeMessenger;
}
/**
* Add colorbar to the scene view.
*
* Only one colorbar can be added at a time. Only the most recently added colorbar will be visible.
*
@example Wind comfort colorbar
Add wind comfort colorbar. The labels are centered below the segments.
```ts
const comfortWindColors = ["#B2F8DA", "#55DCA2", "#FED52A", "#FFA900", "#FF463A"]
const comfortWindLabels = ["Sitting", "Standing", "Strolling", "Walking", "Uncomfortable"]
const labelPosition = "center"
await Forma.colorbar.add({colors: comfortWindColors, labelPosition, labels: comfortWindLabels})
```
<img src="../media/colorbar_wind_comfort.png" width="600px"/>
*
* @example Solar energy interactive colorbar
* Add interactive solar energy colorbar. Include colorbar unit showed to the left and labels on selected segment limits.
* ```ts
* const solarEnergyColors = ["#662818", "#80321E", "#D94E06", "#E46306", "#EE7606", "#F88A06", "#FFA005", "#FFBC04", "#FFD603", "#FFF101",]
* const solarEnergyLabels = ["", "700", "", "800", "", "900", "", "1000", ""]
* const labelPosition = "edge"
* const filterAnalysis = (rangeFilter: {lowerIndex: number, upperIndex: number}) => {
* // Do something with the range filter
* console.log(rangeFilter)
* }
* await Forma.colorbar.add({colors: solarEnergyColors, labelPosition, labels: solarEnergyLabels, unit: "kWh/m²", onRangeFilterChange: filterAnalysis})
* ```
* <img src="../media/colorbar_solar_energy.gif" width="600px"/>
*/
async add(request) {
if (this.unsubscribe) {
this.unsubscribe();
this.unsubscribe = undefined;
}
await this.#iframeMessenger.sendRequest("colorbar/add", {
colors: request.colors,
labelPosition: request.labelPosition,
labels: request.labels,
unit: request.unit,
isInteractive: request.onRangeFilterChange !== undefined,
});
if (request.onRangeFilterChange) {
const { unsubscribe } = await this.#iframeMessenger.createSubscription("colorbar/on-range-filter-change", request.onRangeFilterChange);
this.unsubscribe = unsubscribe;
}
}
/**
* Removes the colorbar added by this embedded view from the scene view.
*
* @example
* await Forma.colorbar.remove()
*/
async remove() {
await this.#iframeMessenger.sendRequest("colorbar/remove");
if (this.unsubscribe) {
this.unsubscribe();
this.unsubscribe = undefined;
}
}
}