@ -14,8 +14,10 @@ import InputNumber from 'antd/lib/input-number';
import Button from 'antd/lib/button' ; import Button from 'antd/lib/button' ;
import notification from 'antd/lib/notification' ; import notification from 'antd/lib/notification' ;
import { Model , StringObject } from 'reducers/interfaces' ; import { Model , ModelAttribute , StringObject } from 'reducers/interfaces' ;
import CVATTooltip from 'components/common/cvat-tooltip' ; import CVATTooltip from 'components/common/cvat-tooltip' ;
import { Label as LabelInterface } from 'components/labels-editor/common' ;
import { clamp } from 'utils/math' ; import { clamp } from 'utils/math' ;
import consts from 'consts' ; import consts from 'consts' ;
import { DimensionType } from '../../reducers/interfaces' ; import { DimensionType } from '../../reducers/interfaces' ;
@ -23,28 +25,40 @@ import { DimensionType } from '../../reducers/interfaces';
interface Props { interface Props {
withCleanup : boolean ;
withCleanup : boolean ;
models : Model [ ] ;
models : Model [ ] ;
labels : any [ ] ;
labels : LabelInterface [ ] ;
dimension : DimensionType ;
dimension : DimensionType ;
runInference ( model : Model , body : object ) : void ;
runInference ( model : Model , body : object ) : void ;
} }
interface MappedLabel {
name : string ;
attributes : StringObject ;
}
type MappedLabelsList = Record < string , MappedLabel > ;
export interface DetectorRequestBody {
mapping : MappedLabelsList ;
cleanup : boolean ;
}
interface Match {
model : string | null ;
task : string | null ;
}
function DetectorRunner ( props : Props ) : JSX . Element { function DetectorRunner ( props : Props ) : JSX . Element {
const {
const {
models , withCleanup , labels , dimension , runInference ,
models , withCleanup , labels , dimension , runInference ,
} = props ;
} = props ;
const [ modelID , setModelID ] = useState < string | null > ( null ) ;
const [ modelID , setModelID ] = useState < string | null > ( null ) ;
const [ mapping , setMapping ] = useState < StringObject > ( { } ) ;
const [ mapping , setMapping ] = useState < MappedLabelsLis t> ( { } ) ;
const [ threshold , setThreshold ] = useState < number > ( 0.5 ) ;
const [ threshold , setThreshold ] = useState < number > ( 0.5 ) ;
const [ distance , setDistance ] = useState < number > ( 50 ) ;
const [ distance , setDistance ] = useState < number > ( 50 ) ;
const [ cleanup , setCleanup ] = useState < boolean > ( false ) ;
const [ cleanup , setCleanup ] = useState < boolean > ( false ) ;
const [ match , setMatch ] = useState < {
const [ match , setMatch ] = useState < Match > ( { model : null , task : null } ) ;
model : string | null ;
const [ attrMatches , setAttrMatch ] = useState < Record < string , Match > > ( { } ) ;
task : string | null ;
} > ( {
model : null ,
task : null ,
} ) ;
const model = models . filter ( ( _model ) : boolean = > _model . id === modelID ) [ 0 ] ;
const model = models . filter ( ( _model ) : boolean = > _model . id === modelID ) [ 0 ] ;
const isDetector = model && model . type === 'detector' ;
const isDetector = model && model . type === 'detector' ;
@ -57,24 +71,47 @@ function DetectorRunner(props: Props): JSX.Element {
if ( model && model . type !== 'reid' && ! model . labels . length ) {
if ( model && model . type !== 'reid' && ! model . labels . length ) {
notification . warning ( {
notification . warning ( {
message : 'The selected model does not include any lab l es',
message : 'The selected model does not include any lab el s',
} ) ;
} ) ;
}
}
function matchAttributes (
labelAttributes : LabelInterface [ 'attributes' ] ,
modelAttributes : ModelAttribute [ ] ,
) : StringObject {
if ( Array . isArray ( labelAttributes ) && Array . isArray ( modelAttributes ) ) {
return labelAttributes
. reduce ( ( attrAcc : StringObject , attr : any ) : StringObject = > {
if ( modelAttributes . some ( ( mAttr ) = > mAttr . name === attr . name ) ) {
attrAcc [ attr . name ] = attr . name ;
}
return attrAcc ;
} , { } ) ;
}
return { } ;
}
function updateMatch ( modelLabel : string | null , taskLabel : string | null ) : void {
function updateMatch ( modelLabel : string | null , taskLabel : string | null ) : void {
if ( match . model && taskLabel ) {
function addMatch ( modelLbl : string , taskLbl : string ) : void {
const newmatch : { [ index : string ] : string } = { } ;
const newMatch : MappedLabelsList = { } ;
newmatch [ match . model ] = taskLabel ;
const label = labels . find ( ( l ) = > l . name === taskLbl ) as LabelInterface ;
setMapping ( { . . . mapping , . . . newmatch } ) ;
const currentModel = models . filter ( ( _model ) : boolean = > _model . id === modelID ) [ 0 ] ;
const attributes = matchAttributes ( label . attributes , currentModel . attributes [ modelLbl ] ) ;
newMatch [ modelLbl ] = { name : taskLbl , attributes } ;
setMapping ( { . . . mapping , . . . newMatch } ) ;
setMatch ( { model : null , task : null } ) ;
setMatch ( { model : null , task : null } ) ;
}
if ( match . model && taskLabel ) {
addMatch ( match . model , taskLabel ) ;
return ;
return ;
}
}
if ( match . task && modelLabel ) {
if ( match . task && modelLabel ) {
const newmatch : { [ index : string ] : string } = { } ;
addMatch ( modelLabel , match . task ) ;
newmatch [ modelLabel ] = match . task ;
setMapping ( { . . . mapping , . . . newmatch } ) ;
setMatch ( { model : null , task : null } ) ;
return ;
return ;
}
}
@ -84,14 +121,72 @@ function DetectorRunner(props: Props): JSX.Element {
} ) ;
} ) ;
}
}
function updateAttrMatch ( modelLabel : string , modelAttrLabel : string | null , taskAttrLabel : string | null ) : void {
function addAttributeMatch ( modelAttr : string , attrLabel : string ) : void {
const newMatch : StringObject = { } ;
newMatch [ modelAttr ] = attrLabel ;
mapping [ modelLabel ] . attributes = { . . . mapping [ modelLabel ] . attributes , . . . newMatch } ;
delete attrMatches [ modelLabel ] ;
setAttrMatch ( { . . . attrMatches } ) ;
}
const modelAttr = attrMatches [ modelLabel ] ? . model ;
if ( modelAttr && taskAttrLabel ) {
addAttributeMatch ( modelAttr , taskAttrLabel ) ;
return ;
}
const taskAttrModel = attrMatches [ modelLabel ] ? . task ;
if ( taskAttrModel && modelAttrLabel ) {
addAttributeMatch ( modelAttrLabel , taskAttrModel ) ;
return ;
}
attrMatches [ modelLabel ] = {
model : modelAttrLabel ,
task : taskAttrLabel ,
} ;
setAttrMatch ( { . . . attrMatches } ) ;
}
function renderMappingRow (
color : string ,
leftLabel : string ,
rightLabel : string ,
removalTitle : string ,
onClick : ( ) = > void ,
className = '' ,
) : JSX . Element {
return (
< Row key = { leftLabel } justify = 'start' align = 'middle' >
< Col span = { 10 } className = { className } >
< Tag color = { color } > { leftLabel } < / Tag >
< / Col >
< Col span = { 10 } offset = { 1 } className = { className } >
< Tag color = { color } > { rightLabel } < / Tag >
< / Col >
< Col offset = { 1 } >
< CVATTooltip title = { removalTitle } >
< DeleteOutlined
className = 'cvat-danger-circle-icon'
onClick = { onClick }
/ >
< / CVATTooltip >
< / Col >
< / Row >
) ;
}
function renderSelector (
function renderSelector (
value : string ,
value : string ,
tooltip : string ,
tooltip : string ,
labelsToRender : string [ ] ,
labelsToRender : string [ ] ,
onChange : ( label : string ) = > void ,
onChange : ( label : string ) = > void ,
className = '' ,
) : JSX . Element {
) : JSX . Element {
return (
return (
< CVATTooltip title = { tooltip } >
< CVATTooltip title = { tooltip } className = { className } >
< Select
< Select
value = { value }
value = { value }
onChange = { onChange }
onChange = { onChange }
@ -130,16 +225,24 @@ function DetectorRunner(props: Props): JSX.Element {
disabled = { dimension !== DimensionType . DIM_2D }
disabled = { dimension !== DimensionType . DIM_2D }
style = { { width : '100%' } }
style = { { width : '100%' } }
onChange = { ( _modelID : string ) : void = > {
onChange = { ( _modelID : string ) : void = > {
const newmodel = models . filter ( ( _model ) : boolean = > _model . id === _modelID ) [ 0 ] ;
const chosenModel = models . filter ( ( _model ) : boolean = > _model . id === _modelID ) [ 0 ] ;
const newmapping = labels . reduce ( ( acc : StringObject , label : any ) : StringObject = > {
const defaultMapping = labels . reduce (
if ( newmodel . labels . includes ( label . name ) ) {
( acc : MappedLabelsList , label : LabelInterface ) : MappedLabelsList = > {
acc [ label . name ] = label . name ;
if ( chosenModel . labels . includes ( label . name ) ) {
}
acc [ label . name ] = {
return acc ;
name : label.name ,
} , { } ) ;
attributes : matchAttributes (
label . attributes , chosenModel . attributes [ label . name ] ,
setMapping ( newmapping ) ;
) ,
} ;
}
return acc ;
} , { } ,
) ;
setMapping ( defaultMapping ) ;
setMatch ( { model : null , task : null } ) ;
setMatch ( { model : null , task : null } ) ;
setAttrMatch ( { } ) ;
setModelID ( _modelID ) ;
setModelID ( _modelID ) ;
} }
} }
>
>
@ -154,45 +257,92 @@ function DetectorRunner(props: Props): JSX.Element {
< / Col >
< / Col >
< / Row >
< / Row >
{ isDetector &&
{ isDetector &&
! ! Object . keys ( mapping ) . length &&
Object . keys ( mapping ) . length ?
Object . keys ( mapping ) . map ( ( modelLabel : string ) = > {
Object . keys ( mapping ) . map ( ( modelLabel : string ) = > {
const label = labels . filter ( ( _label : any ) : boolean = > _label . name === mapping [ modelLabel ] ) [ 0 ] ;
const label = labels
. find ( ( _label : LabelInterface ) : boolean = > (
_label . name === mapping [ modelLabel ] . name ) ) as LabelInterface ;
const color = label ? label.color : consts.NEW_LABEL_COLOR ;
const color = label ? label.color : consts.NEW_LABEL_COLOR ;
const notMatchedModelAttributes = model . attributes [ modelLabel ]
. filter ( ( _attribute : ModelAttribute ) : boolean = > (
! ( _attribute . name in ( mapping [ modelLabel ] . attributes || { } ) )
) ) ;
const taskAttributes = label . attributes . map ( ( _attrLabel : any ) : string = > _attrLabel . name ) ;
return (
return (
< Row key = { modelLabel } justify = 'start' align = 'middle' >
< React.Fragment key = { modelLabel } >
< Col span = { 10 } >
{
< Tag color = { color } > { modelLabel } < / Tag >
renderMappingRow ( color ,
< / Col >
modelLabel ,
< Col span = { 10 } offset = { 1 } >
label . name ,
< Tag color = { color } > { mapping [ modelLabel ] } < / Tag >
'Remove the mapped label' ,
< / Col >
( ) : void = > {
< Col offset = { 1 } >
const newMapping = { . . . mapping } ;
< CVATTooltip title = 'Remove the mapped values' >
delete newMapping [ modelLabel ] ;
< DeleteOutlined
setMapping ( newMapping ) ;
className = 'cvat-danger-circle-icon'
onClick = { ( ) : void = > {
const newAttrMatches = { . . . attrMatches } ;
const newmapping = { . . . mapping } ;
delete newAttrMatches [ modelLabel ] ;
delete newmapping [ modelLabel ] ;
setAttrMatch ( { . . . newAttrMatches } ) ;
setMapping ( newmapping ) ;
} )
} }
}
/ >
{
< / CVATTooltip >
Object . keys ( mapping [ modelLabel ] . attributes || { } )
< / Col >
. map ( ( mappedModelAttr : string ) = > (
< / Row >
renderMappingRow (
consts . NEW_LABEL_COLOR ,
mappedModelAttr ,
mapping [ modelLabel ] . attributes [ mappedModelAttr ] ,
'Remove the mapped attribute' ,
( ) : void = > {
const newMapping = { . . . mapping } ;
delete mapping [ modelLabel ] . attributes [ mappedModelAttr ] ;
setMapping ( newMapping ) ;
} ,
'cvat-run-model-label-attribute-block' ,
)
) )
}
{ notMatchedModelAttributes . length && taskAttributes . length ? (
< Row justify = 'start' align = 'middle' >
< Col span = { 10 } >
{ renderSelector (
attrMatches [ modelLabel ] ? . model || '' ,
'Model attr labels' , notMatchedModelAttributes . map ( ( l ) = > l . name ) ,
( modelAttrLabel : string ) = > updateAttrMatch (
modelLabel , modelAttrLabel , null ,
) ,
'cvat-run-model-label-attribute-block' ,
) }
< / Col >
< Col span = { 10 } offset = { 1 } >
{ renderSelector (
attrMatches [ modelLabel ] ? . task || '' ,
'Task attr labels' , taskAttributes ,
( taskAttrLabel : string ) = > updateAttrMatch (
modelLabel , null , taskAttrLabel ,
) ,
'cvat-run-model-label-attribute-block' ,
) }
< / Col >
< Col span = { 1 } offset = { 1 } >
< CVATTooltip title = 'Specify an attribute mapping between model label and task label attributes' >
< QuestionCircleOutlined className = 'cvat-info-circle-icon' / >
< / CVATTooltip >
< / Col >
< / Row >
) : null }
< / React.Fragment >
) ;
) ;
} ) }
} ) : null }
{ isDetector && ! ! taskLabels . length && ! ! modelLabels . length && (
{ isDetector && ! ! taskLabels . length && ! ! modelLabels . length ? (
< >
< >
< Row justify = 'start' align = 'middle' >
< Row justify = 'start' align = 'middle' >
< Col span = { 10 } >
< Col span = { 10 } >
{ renderSelector (
{ renderSelector ( match . model || '' , 'Model labels' , modelLabels , ( modelLabel : string ) = > updateMatch ( modelLabel , null ) ) }
match . model || '' , 'Model labels' , modelLabels , ( modelLabel : string ) = > updateMatch ( modelLabel , null ) ,
) }
< / Col >
< / Col >
< Col span = { 10 } offset = { 1 } >
< Col span = { 10 } offset = { 1 } >
{ renderSelector (
{ renderSelector ( match . task || '' , 'Task labels' , taskLabels , ( taskLabel : string ) = > updateMatch ( null , taskLabel ) ) }
match . task || '' , 'Task labels' , taskLabels , ( taskLabel : string ) = > updateMatch ( null , taskLabel ) ,
) }
< / Col >
< / Col >
< Col span = { 1 } offset = { 1 } >
< Col span = { 1 } offset = { 1 } >
< CVATTooltip title = 'Specify a label mapping between model labels and task labels' >
< CVATTooltip title = 'Specify a label mapping between model labels and task labels' >
@ -201,8 +351,8 @@ function DetectorRunner(props: Props): JSX.Element {
< / Col >
< / Col >
< / Row >
< / Row >
< / >
< / >
) }
) : null }
{ isDetector && withCleanup && (
{ isDetector && withCleanup ? (
< div >
< div >
< Checkbox
< Checkbox
checked = { cleanup }
checked = { cleanup }
@ -211,8 +361,8 @@ function DetectorRunner(props: Props): JSX.Element {
Clean old annotations
Clean old annotations
< / Checkbox >
< / Checkbox >
< / div >
< / div >
) }
) : null }
{ isReId && (
{ isReId ? (
< div >
< div >
< Row align = 'middle' justify = 'start' >
< Row align = 'middle' justify = 'start' >
< Col >
< Col >
@ -254,18 +404,25 @@ function DetectorRunner(props: Props): JSX.Element {
< / Col >
< / Col >
< / Row >
< / Row >
< / div >
< / div >
) }
) : null }
< Row align = 'middle' justify = 'end' >
< Row align = 'middle' justify = 'end' >
< Col >
< Col >
< Button
< Button
disabled = { ! buttonEnabled }
disabled = { ! buttonEnabled }
type = 'primary'
type = 'primary'
onClick = { ( ) = > {
onClick = { ( ) = > {
runInference ( model , model . type === 'detector' ?
const detectorRequestBody : DetectorRequestBody = {
{ mapping , cleanup } : {
mapping ,
cleanup ,
} ;
runInference (
model ,
model . type === 'detector' ? detectorRequestBody : {
threshold ,
threshold ,
max_distance : distance ,
max_distance : distance ,
} ) ;
} ,
) ;
} }
} }
>
>
Annotate
Annotate
Boris Sekachev
4 years ago
committed by
GitHub