View as Property in Perspective Component

Module Development
1

Hello,

I'm working on a perspective component, and I'd like to be able to use a property with a path to a perspective view so that users can dynamically override the default view. How would I go about doing this in the REACT component, and the properties.json file in the common scope so that I get the view-picker?

Basically, I'm looking to implement something similar to your popups property on the map component.

image

2

For the JSON editor support, you just need to specify a format of view-path in your schema:

            "path": {
              "type": "string",
              "format": "view-path",
              "description": "Path to the view that will be used as the display for the control.",
              "default": ""
            },

At the JSX/React level, you embed a <View> from @inductiveautomation/perspective-client... which I'm not sure if you have access to? I don't know off the top of my head the publishing situation for our TS libs.
But, in theory:

                containerContent = (
                    <div>
                        <View
                            key={PageStore.instanceKeyFor(view.path, mountPath)}
                            store={this.props.store.view.page.parent}
                            mountPath={mountPath}
                            resourcePath={view.path}
                            outputListener={onViewOutputChanged}
                            params={view.params}
                            useDefaultWidth={true}
                            useDefaultHeight={true}
                        />
                        <ReactResizeDetector
                            handleHeight={true}
                            handleWidth={true}
                            onResize={this.updateViewContainerDimensions(ref)}
                        />
                    </div>
                );
2 Likes