@figlinq/react-chart-editor/lib/default_panels/GraphSubplotsPanel.js

plotly.js chart editor react component UI

import PropTypes from"prop-types";import{SubplotAccordion,RectanglePositioner,AxisOverlayDropdown,PlotlySection,TraceTypeSection,AxisAnchorDropdown,AxisSide,Dropdown,Radio,Numeric,ColorPicker,VisibilitySelect,NumericFraction}from"../components";import{TRACE_TO_AXIS}from"../lib/constants";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const GraphSubplotsPanel=(props,_ref)=>{let{localize:_}=_ref;return _jsxs(SubplotAccordion,{children:[_jsxs(PlotlySection,{name:_("Boundaries"),attr:"xaxis.domain[0]",children:[_jsx(AxisOverlayDropdown,{label:_("X Overlay"),attr:"xaxis.overlaying"}),_jsx(AxisOverlayDropdown,{label:_("Y Overlay"),attr:"yaxis.overlaying"})]}),_jsx(RectanglePositioner,{attr:"domain.x[0]"}),_jsx(RectanglePositioner,{attr:"xaxis.domain[0]",cartesian:true}),_jsxs(TraceTypeSection,{name:_("X Anchor"),traceTypes:TRACE_TO_AXIS.cartesian,children:[_jsx(AxisAnchorDropdown,{label:_("Anchor to"),attr:"xaxis.anchor",clearable:false}),_jsx(AxisSide,{label:_("Side"),attr:"xaxis.side"})]}),_jsxs(TraceTypeSection,{name:_("Y Anchor"),traceTypes:TRACE_TO_AXIS.cartesian,children:[_jsx(AxisAnchorDropdown,{label:_("Anchor to"),attr:"yaxis.anchor",clearable:false}),_jsx(AxisSide,{label:_("Side"),attr:"yaxis.side"})]}),_jsx(PlotlySection,{name:_("Aspect Ratio"),children:_jsxs(VisibilitySelect,{attr:"aspectmode",options:[{label:_("Auto"),value:"mode"},{label:_("Cube"),value:"cube"},{label:_("Data"),value:"data"},{label:_("Manual"),value:"manual"}],dropdown:true,clearable:false,showOn:"manual",defaultOpt:"mode",children:[_jsx(Numeric,{label:_("X"),attr:"aspectratio.x",step:0.1}),_jsx(Numeric,{label:_("Y"),attr:"aspectratio.y",step:0.1}),_jsx(Numeric,{label:_("Z"),attr:"aspectratio.z",step:0.1})]})}),_jsx(PlotlySection,{name:_("Projection"),children:_jsx(Dropdown,{label:_("Type"),attr:"camera.projection.type",options:[{label:_("Perspective"),value:"perspective"},{label:_("Orthographic"),value:"orthographic"}],clearable:false})}),_jsx(PlotlySection,{name:_("Canvas"),children:_jsx(ColorPicker,{label:_("Plot Background"),attr:"bgcolor"})}),_jsxs(PlotlySection,{name:_("Bar Options"),children:[_jsx(Radio,{label:_("Bar Mode"),attr:"barmode",options:[{label:_("Stack"),value:"stack"},{label:_("Overlay"),value:"overlay"}]}),_jsx(NumericFraction,{label:_("Bar Padding"),attr:"bargap",showSlider:true})]}),_jsx(PlotlySection,{name:_("Ternary"),children:_jsx(Numeric,{label:_("Sum"),attr:"sum"})}),_jsxs(PlotlySection,{name:_("Polar Sector"),children:[_jsx(Numeric,{label:_("Min"),attr:"sector[0]",min:-360,max:360,showSlider:true}),_jsx(Numeric,{label:_("Max"),attr:"sector[1]",min:-360,max:360,showSlider:true}),_jsx(NumericFraction,{label:_("Hole"),attr:"hole",min:0,max:100,showSlider:true})]})]})};GraphSubplotsPanel.contextTypes={localize:PropTypes.func};export default GraphSubplotsPanel;
//# sourceMappingURL=GraphSubplotsPanel.js.map