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

plotly.js chart editor react component UI

import PropTypes from"prop-types";import{SubplotAccordion,PlotlySection,Dropdown,MapboxStyleDropdown,MapboxLayersAccordion,Radio,Numeric,ColorPicker,MapboxSourceArray}from"../components";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const StyleMapsPanel=(props,_ref)=>{let{localize:_}=_ref;return _jsxs(SubplotAccordion,{children:[_jsx(PlotlySection,{name:_("Base Map"),attr:"style",children:_jsx(MapboxStyleDropdown,{label:_("Tile Source"),attr:"style"})}),_jsx(PlotlySection,{name:_("Layers"),attr:"style",children:_jsxs(MapboxLayersAccordion,{children:[_jsx(Radio,{attr:"below",options:[{label:_("Below Data"),value:"traces"},{label:_("Above Data"),value:""}]}),_jsx(MapboxSourceArray,{label:_("Tile Source URL"),attr:"source",show:true})]})}),_jsxs(PlotlySection,{name:_("Map Positioning"),children:[_jsx(Numeric,{label:_("Center Latitude"),attr:"center.lat"}),_jsx(Numeric,{label:_("Center Longitude"),attr:"center.lon"}),_jsx(Numeric,{label:_("Zoom Level"),attr:"zoom",min:0}),_jsx(Numeric,{label:_("Bearing"),attr:"bearing"}),_jsx(Numeric,{label:_("Pitch"),attr:"pitch",min:0}),_jsx(Dropdown,{label:_("Bounds Fitting"),attr:"fitbounds",options:[{label:_("Off"),value:false},{label:_("Locations"),value:"locations"},{label:_("GeoJSON"),value:"geojson"}],clearable:false})]}),_jsxs(PlotlySection,{name:_("Map Projection"),children:[_jsx(Dropdown,{label:_("Region"),attr:"scope",options:[{label:_("World"),value:"world"},{label:_("USA"),value:"usa"},{label:_("Europe"),value:"europe"},{label:_("Asia"),value:"asia"},{label:_("Africa"),value:"africa"},{label:_("North America"),value:"north america"},{label:_("South America"),value:"south america"}],clearable:false}),_jsx(Dropdown,{label:_("Projection"),attr:"projection.type",clearable:false,options:[{label:_("Equirectangular"),value:"equirectangular"},{label:_("Mercator"),value:"mercator"},{label:_("Orthographic"),value:"orthographic"},{label:_("Natural Earth"),value:"natural earth"},{label:_("Albers USA"),value:"albers usa"},{label:_("Winkel Tripel"),value:"winkel tripel"},{label:_("Robinson"),value:"robinson"},{label:_("Miller"),value:"miller"},{label:_("Kavrayskiy 7"),value:"kavrayskiy7"},{label:_("Eckert 4"),value:"eckert4"},{label:_("Azimuthal Equal Area"),value:"azimuthal equal area"},{label:_("Azimuthal Equidistant"),value:"azimuthal equidistant"},{label:_("Conic Equal Area"),value:"conic equal area"},{label:_("Conic Conformal"),value:"conic conformal"},{label:_("Conic Equidistant"),value:"conic equidistant"},{label:_("Gnomonic"),value:"gnomonic"},{label:_("Stereographic"),value:"stereographic"},{label:_("Mollweide"),value:"mollweide"},{label:_("Hammer"),value:"hammer"},{label:_("Transverse Mercator"),value:"transverse mercator"},{label:_("Aitoff"),value:"aitoff"},{label:_("Sinusoidal"),value:"sinusoidal"}]}),_jsx(Numeric,{label:_("Scale"),attr:"projection.scale",min:0}),_jsx(Numeric,{label:_("Center Latitude"),attr:"projection.rotation.lon",min:0}),_jsx(Numeric,{label:_("Center Longitude"),attr:"projection.rotation.lat",min:0}),_jsx(Numeric,{label:_("Roll"),attr:"projection.rotation.roll",min:0})]}),_jsxs(PlotlySection,{name:_("Base Map"),attr:"visible",children:[_jsx(Radio,{attr:"visible",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Radio,{label:_("Resolution"),attr:"resolution",options:[{label:_("1:110,000,000"),value:110},{label:_("1:50,000,000"),value:50}]})]}),_jsxs(PlotlySection,{name:_("Country Borders"),attr:"showcountries",children:[_jsx(Radio,{attr:"showcountries",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Numeric,{label:_("Border Width"),attr:"countrywidth",units:"px"}),_jsx(ColorPicker,{label:_("Border Color"),attr:"countrycolor"})]}),_jsxs(PlotlySection,{name:_("Sub-Country Unit Borders"),attr:"showsubunits",children:[_jsx(Radio,{attr:"showsubunits",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Numeric,{label:_("Border Width"),attr:"subunitwidth",units:"px"}),_jsx(ColorPicker,{label:_("Border Color"),attr:"subunitcolor"})]}),_jsxs(PlotlySection,{name:_("Coastlines"),attr:"showcoastlines",children:[_jsx(Radio,{attr:"showcoastlines",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Numeric,{label:_("Width"),attr:"coastlinewidth",units:"px"}),_jsx(ColorPicker,{label:_("Color"),attr:"coastlinecolor"})]}),_jsxs(PlotlySection,{name:_("Oceans"),attr:"showocean",children:[_jsx(Radio,{attr:"showocean",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(ColorPicker,{label:_("Color"),attr:"oceancolor"})]}),_jsxs(PlotlySection,{name:_("Land"),attr:"showland",children:[_jsx(Radio,{attr:"showland",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(ColorPicker,{label:_("Color"),attr:"landcolor"})]}),_jsxs(PlotlySection,{name:_("Lakes"),attr:"showlakes",children:[_jsx(Radio,{attr:"showlakes",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(ColorPicker,{label:_("Color"),attr:"lakecolor"})]}),_jsxs(PlotlySection,{name:_("Rivers"),attr:"showrivers",children:[_jsx(Radio,{attr:"showrivers",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Numeric,{label:_("Width"),attr:"riverwidth",units:"px"}),_jsx(ColorPicker,{label:_("Color"),attr:"rivercolor"})]}),_jsxs(PlotlySection,{name:_("Map Frame"),attr:"showframe",children:[_jsx(Radio,{attr:"showframe",options:[{label:_("Show"),value:true},{label:_("Hide"),value:false}]}),_jsx(Numeric,{label:_("Width"),attr:"framewidth",units:"px"}),_jsx(ColorPicker,{label:_("Color"),attr:"framecolor"})]})]})};StyleMapsPanel.contextTypes={localize:PropTypes.func};export default StyleMapsPanel;
//# sourceMappingURL=StyleMapsPanel.js.map