FloatImageControl

Live example

Source

import 'normalize.css';

import React from 'react';
import ReactDOM from 'react-dom';

import FloatImageControl from 'paraviewweb/src/React/CollapsibleControls/FloatImageControl';
import jsonData from 'paraviewweb/src/React/CollapsibleControls/FloatImageControl/example/pipeline';

document.body.style.padding = '10px';

const layerMapByName = {};
const state = {
light: 200,
};
const model = {
dimensions: jsonData.dimensions,
onProbeChange() {
return null;
},
getTimeProbe() {
return {
enabled: false,
query: null,
draw: false,
};
},
getLayers() {
return jsonData.layers;
},
getLight() {
return state.light;
},
setLight(v) {
state.light = v;
},
isMultiView() {
return false;
},
updateMaskLayerVisibility(name, value) {
layerMapByName[name].meshActive = value;
render(); // eslint-disable-line
},
updateLayerVisibility(name, value) {
layerMapByName[name].active = value;
render(); // eslint-disable-line
},
updateLayerColorBy(name, value) {
layerMapByName[name].array = value;
render(); // eslint-disable-line
},
};

// Fill map
jsonData.layers.forEach((item) => {
layerMapByName[item.name] = item;
});

// Keep element for rerendering it
const element = <FloatImageControl model={model} />;

function render() {
ReactDOM.render(element, document.querySelector('.content'));
}

render();