@arcgis/core
Version:
ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API
3 lines (2 loc) • 7.44 kB
JavaScript
/* COPYRIGHT Esri - https://js.arcgis.com/5.0.19/LICENSE.txt */
import{__decorate as e}from"tslib";import t from"../Color.js";import{deprecatedModule as i}from"../core/deprecate.js";import r from"../core/Logger.js";import{watch as s}from"../core/reactiveUtils.js";import{property as a,subclass as n}from"../core/accessorSupport/decorators.js";import{Integer as o}from"../core/accessorSupport/ensureType.js";import l from"./Histogram.js";import d from"./Slider.js";import h from"./Widget.js";import u from"./HistogramRangeSlider/HistogramRangeSliderViewModel.js";import{getDeviationValues as m}from"./smartMapping/support/utils.js";import{globalCss as g}from"./support/globalCss.js";import{messageBundle as p,tsx as c}from"./support/widget.js";const v="esri-histogram-range-slider",b={base:v,sliderContainer:`${v}__slider-container`,histogramContainer:`${v}__histogram-container`,rangeTypePrefix:`${v}__range-type--`};let _=class extends h{constructor(e,s){super(e,s),this._barElements=[],this._histogram=null,this._slider=null,this.barCreatedFunction=null,this.dataLines=null,this.dataLineCreatedFunction=null,this.excludedBarColor=new t("#d7e5f0"),this.includedBarColor=new t("#599dd4"),this.messages=null,this.standardDeviationCount=1,this.viewModel=new u,i(r.getLogger("esri.widgets.HistogramRangeSlider"),"esri.widgets.HistogramRangeSlider",{replacement:"Use the Histogram and Slider components from the Common components package.",version:"5.0",see:"https://www.esriurl.com/common-components/",warnOnce:!0})}initialize(){const{average:e,bins:t,hasTimeData:i,max:r,min:a,viewModel:n}=this;this._updateBarFill=this._updateBarFill.bind(this),this._histogram=new l({suppressDeprecationWarning:!0,average:e,bins:t,barCreatedFunction:(e,t)=>{0===e&&(this._barElements=[]),this._barElements.push(t),this._updateBarFill(e,t),this.barCreatedFunction?.(e,t)},dataLines:this._getDataLines(),dataLineCreatedFunction:(e,t)=>{this.dataLineCreatedFunction?.(e,t)},labelFormatFunction:this.labelFormatFunction,layout:"horizontal",max:r,min:a}),this._slider=new d({labelFormatFunction:this.labelFormatFunction,layout:"horizontal",visibleElements:{labels:!0,rangeLabels:!0},rangeLabelInputsEnabled:!i,viewModel:n,suppressDeprecationWarning:!0}),this.addHandles([this._slider.on("max-change",e=>this.emit("max-change",e)),this._slider.on("min-change",e=>this.emit("min-change",e)),this._slider.on("segment-drag",e=>{this._updateBarFills(),this.emit("segment-drag",e)}),this._slider.on("thumb-change",e=>{this._updateBarFills(),this.emit("thumb-change",e)}),this._slider.on("thumb-drag",e=>{this._updateBarFills(),this.emit("thumb-drag",e)}),s(()=>this.bins,e=>{if(e&&this._histogram.bins){const t=this._histogram.bins.length-e.length;this._barElements.splice(-t,t)}else this._barElements=[];this._histogram.set({bins:e}),this._updateBarFills(),this.scheduleRender()}),s(()=>[this.max,this.min,this.rangeType,this.values],([e,t])=>{this._histogram.set({max:e,min:t}),this._updateBarFills(),this.scheduleRender()}),s(()=>[this.average,this.dataLines,this.standardDeviation,this.standardDeviationCount],([e])=>{this._histogram.set({average:e,dataLines:this._getDataLines()})}),s(()=>this.labelFormatFunction,e=>{this._histogram.set({labelFormatFunction:e})}),s(()=>this.hasTimeData,e=>{this._slider.set({rangeLabelInputsEnabled:!e})})])}get average(){return this.viewModel.average}set average(e){this.viewModel.average=e}get bins(){return this.viewModel.bins}set bins(e){this.viewModel.bins=e}get hasTimeData(){return this.viewModel.hasTimeData}set hasTimeData(e){this.viewModel.hasTimeData=e}get icon(){return"arrow-double-horizontal"}set icon(e){this._overrideIfSome("icon",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get labelFormatFunction(){return this.viewModel.labelFormatFunction}set labelFormatFunction(e){this.viewModel.labelFormatFunction=e}get max(){return this.viewModel.max}set max(e){this.viewModel.max=e}get min(){return this.viewModel.min}set min(e){this.viewModel.min=e}get precision(){return this.viewModel.precision}set precision(e){this.viewModel.precision=e}get rangeType(){return this.viewModel.rangeType}set rangeType(e){this.viewModel.rangeType=e}get standardDeviation(){return this.viewModel.standardDeviation}set standardDeviation(e){this.viewModel.standardDeviation=e}get values(){return this.viewModel.values}set values(e){this.viewModel.values=e}generateWhereClause(e){return this.viewModel.generateWhereClause(e)}render(){const{rangeType:e,viewModel:t,label:i}=this,r=this.classes(b.base,g.widget,`${b.rangeTypePrefix}${e}`,"disabled"===t.state?g.disabled:null);return c("div",{"aria-label":i,class:r},"disabled"===t.state?null:this._renderContent())}_renderContent(){return[this._renderHistogram(),this._renderSlider()]}_renderSlider(){return c("div",{class:b.sliderContainer,key:`${this.id}-slider-container`},this._slider.render())}_renderHistogram(){return c("div",{class:b.histogramContainer},this._histogram.render())}_getDataLines(){return[...this._getStandardDeviationDataLines(),...this.dataLines||[]]}_getStandardDeviationDataLines(){const{average:e,standardDeviation:t,standardDeviationCount:i}=this;return m(t,e,i).map(e=>({value:e}))}_updateBarFills(){this._barElements.forEach((e,t)=>this._updateBarFill(t,e))}_updateBarFill(e,t){t.setAttribute("fill",this._getFillForBar(e)?.toHex()??"")}_getFillForBar(e){const{bins:t,rangeType:i,values:r}=this;if(-1===e||!t?.length||!i||!r?.length)return null;const s=t[e];if(!s)return null;const{maxValue:a,minValue:n}=s,o=a-n,l=r[0]>n&&r[0]<a;switch(i){case"equal":case"not-equal":return this.includedBarColor;case"less-than":case"at-most":return l?this._getBlendedColor((r[0]-n)/o):a<=r[0]?this.includedBarColor:this.excludedBarColor;case"greater-than":case"at-least":return l?this._getBlendedColor(1-(r[0]-n)/o):n>=r[0]?this.includedBarColor:this.excludedBarColor;case"between":if(2===r.length)return r[0]>n&&r[0]<a?this._getBlendedColor(1-(r[0]-n)/o):r[1]>n&&r[1]<a?this._getBlendedColor((r[1]-n)/o):n>=r[0]&&a<=r[1]?this.includedBarColor:this.excludedBarColor;break;case"not-between":if(2===r.length)return r[0]>n&&r[0]<a?this._getBlendedColor((r[0]-n)/o):r[1]>n&&r[1]<a?this._getBlendedColor(1-(r[1]-n)/o):n>r[0]&&a<r[1]?this.excludedBarColor:this.includedBarColor}return this.includedBarColor}_getBlendedColor(e){return t.blendColors(this.excludedBarColor,this.includedBarColor,e)}};e([a()],_.prototype,"average",null),e([a()],_.prototype,"barCreatedFunction",void 0),e([a()],_.prototype,"bins",null),e([a()],_.prototype,"dataLines",void 0),e([a()],_.prototype,"dataLineCreatedFunction",void 0),e([a({type:t,json:{type:[o],write:!0}})],_.prototype,"excludedBarColor",void 0),e([a()],_.prototype,"hasTimeData",null),e([a({type:t,json:{type:[o],write:!0}})],_.prototype,"includedBarColor",void 0),e([a()],_.prototype,"icon",null),e([a()],_.prototype,"label",null),e([a()],_.prototype,"labelFormatFunction",null),e([a()],_.prototype,"max",null),e([a(),p("esri/widgets/HistogramRangeSlider/t9n/HistogramRangeSlider")],_.prototype,"messages",void 0),e([a()],_.prototype,"min",null),e([a()],_.prototype,"precision",null),e([a()],_.prototype,"rangeType",null),e([a()],_.prototype,"standardDeviation",null),e([a()],_.prototype,"standardDeviationCount",void 0),e([a()],_.prototype,"values",null),e([a({type:u})],_.prototype,"viewModel",void 0),_=e([n("esri.widgets.HistogramRangeSlider")],_);const w=_;export{w as default};