displacy
1.0.0
️ A partir da v2.0.0, os visualizadores de deslocamento agora estão integrados à biblioteca principal. Veja aqui para obter mais detalhes sobre como visualizar um objetoDocde dentro do Spacy. Também estamos trabalhando em um novo conjunto de ferramentas para servir e testar modelos espaciais. O código dos visualizadores independentes ainda estará disponível no GitHub, mas não mantido ativamente.
O Displacy.js é uma biblioteca de visualização moderna e independente de serviços. Esperamos que isso facilite a comparação de serviços diferentes e explore seus próprios modelos internos. Se você estiver usando o analisador sintático da Spacy, o descontrolado deve fazer parte do seu fluxo de trabalho regular. Como o analisador de Spacy é estatístico, geralmente é difícil prever como ele analisará uma determinada frase. Usando o Desponting, você pode simplesmente tentar ver. Você também pode compartilhar a página para discussão com sua equipe ou salvar o SVG para usar em outro lugar. Se você estiver desenvolvendo seu próprio modelo, você pode executar o serviço sozinho - é 100% de código aberto.
Para ler mais sobre Displacy.js, consulte a postagem do blog.
Esta demonstração é implementada em Jade (também conhecida como PUG), uma linguagem de modelos extensíveis que compila com HTML e é construída ou servida pela harpa. Para servi -lo localmente em http: // localhost: 9000, basta executar:
sudo npm install --global harp
git clone https://github.com/explosion/displacy
cd displacy
harp serverOu simplesmente instalá -lo no NPM:
npm install displacy-demoA demonstração está escrita no ECMAScript 6. Para compatibilidade completa e transversal, certifique-se de usar um compilador como Babel. Para mais informações, consulte esta tabela de compatibilidade.
Para usar o Displacy em seu projeto, faça o download displacy.js do GitHub ou via NPM:
npm install displacyEm seguida, inclua o arquivo e inicialize uma nova instância especificando a API e as configurações:
const displacy = new displaCy ( 'http://localhost:8000' , {
container : '#displacy' ,
format : 'spacy' ,
distance : 300 ,
offsetX : 100
} ) ;Nosso serviço que produz os dados de entrada também é de código aberto. Você pode encontrá-lo em serviços Spacy.
As seguintes configurações estão disponíveis:
| Contexto | Descrição | Padrão |
|---|---|---|
| recipiente | elemento para desenhar o deslocamento, pode ser qualquer seletor de consulta | #displacy |
| formatar | formato usado para gerar análise ( 'spacy' ou 'google' ) | 'spacy' |
| defaultText | Texto usado se o desligamento for executado sem texto especificado | 'Hello World.' |
| DefaultModel | Modelo usado se o desligamento for executado sem modelo especificado | 'en' |
| colapsopunct | Pontuação em colapso | true |
| colapsofrase | frases de colapso | true |
| distância | distância entre palavras em px | 300 |
| offsetx | Espaçamento no lado esquerdo do SVG em PX | 50 |
| setas | espaçamento entre as setas em px para evitar sobreposições | 20 |
| largura de seta | Largura da cabeça de flecha em px | 10 |
| Arrowstroke | largura de arco em px | 2 |
| Palavras | espaçamento entre palavras e arcos em px | 50 |
| fonte | font rosto para todo texto | 'inherit' |
| cor | cor de texto, nomes hexadecimal, rgb ou color | '#000000' |
| bg | Cor de fundo, nomes de fundo, hexadecimal, rgb ou colorido | '#ffffff' |
| OnStart | função a ser executada no início da solicitação do servidor | false |
| ONSUCCEST | Função de retorno de chamada a ser executada na resposta do servidor bem -sucedida | false |
| OnError | função a ser executada se a solicitação falhar | false |
O método parse() torna uma análise gerada pelo Spacy como um SVG no contêiner.
displacy . parse ( 'This is a sentence.' , 'en' , {
collapsePunct : false ,
collapsePhrase : false ,
color : '#ffffff' ,
bg : '#000000'
} ) ;As configurações visuais especificadas aqui substituem as configurações globais. As configurações disponíveis são colapsadas , colapso , shrase, fonte , cor e bg .
Como alternativa, você pode usar render() para renderizar manualmente um conjunto de arcos e palavras formatados por JSON:
const parse = {
arcs : [
{ dir : 'right' , end : 1 , label : 'npadvmod' , start : 0 }
] ,
words : [
{ tag : 'UH' , text : 'Hello' } ,
{ tag : 'NNP' , text : 'World.' }
]
} ;
displacy . render ( parse , {
color : '#ff0000'
} ) ;As configurações visuais especificadas aqui substituem as configurações globais. As configurações disponíveis são de fonte , cor e BG .
Por padrão, o Displacy espera a saída JSON de Spacy no estilo a seguir:
{
"arcs" : [
{ "dir" : " left " , "end" : 4 , "label" : " nsubj " , "start" : 0 }
],
"words" : [
{ "tag" : " NNS " , "text" : " Robots " }
]
} Se format estiver definido como 'google' , a resposta da API será convertida no formato do Google. Para adicionar suas próprias regras de conversão, adicione um novo estojo ao handleConversion() :
handleConversion ( parse ) {
switch ( this . format ) {
case 'spacy' : return parse ; break ;
case 'google' : return ( { words : ... , arcs : ... } ) ; break ;
case 'your_format' : return ( { words : ... , arcs : ... } ) ; break ;
default : return parse ;
}
} Agora você pode inicializar o deslocamento com format: 'your_format' .
Você pode encontrar as configurações de tema atual em /assets/css/_displacy-theme.sass . Todos os elementos contidos na saída SVG vêm com tags e atributos de dados e podem ser estilizados com flexibilidade usando CSS. Por padrão, o currentColor do elemento é usado para colorir, o que significa que só precisa alterar a propriedade color no CSS.
As aulas a seguir estão disponíveis:
| Nome da classe | Descrição |
|---|---|
| .Displacy-Word | texto de palavra |
| .Displacy-Tag | Tag POS |
| .Displacy-Token | Contêiner de Word and POS Tag |
| .Displacy-arc | Arrow Arc (sem rótulo ou cabeça de seta) |
| .Displacy-label | tipo de relação (rótulo de seta) |
| .Displacy-Arrowhead | Cabeça de seta |
| .Displacy-Arrow | Contêiner de arco, etiqueta e cabeça de flecha |
Além disso, você pode usar esses atributos como seletores de atributos:
| Atributo | Valor | No elemento |
|---|---|---|
| Data-desbotamento | Valor da tag POS | .displacy-token , .displacy-word , .displacy-tag |
| Data-label | Valor do tipo de relação | .displacy-arrow , .displacy-arc , .displacy-arrowhead , .displacy-label |
| dados-av | direção da flecha | .displacy-arrow , .displacy-arc , .displacy-arrowhead , .displacy-label |
Usando uma combinação desses seletores e alguma lógica básica do CSS, você pode criar modelos bastante poderosos para estilizar os elementos com base em seu papel e função na análise. Aqui estão alguns exemplos:
/* Format all words in 12px Helvetica and grey */
. displacy-word {
font : 12 px Helvetica , Arial , sans-serif;
color : grey;
}
/* Make all noun phrases (tags that start with "NN") green */
. displacy-tag [ data-tag ^= "NN" ] {
color : green;
}
/* Make all right arrows red and hide their labels */
. displacy-arc [ data-dir = "right" ] ,
. displacy-arrowhead [ data-dir = "right" ] {
color : red;
}
. displacy-label [ data-dir = "right" ] {
display : none;
}
/* Hide all tags for verbs (tags that start with "VB") that are NOT the base form ("VB") */
. displacy-tag [ data-tag ^= "VB" ] : not ([ data-tag = "VB" ]) {
display : none;
}
/* Only display tags if word is hovered (with smooth transition) */
. displacy-tag {
opacity : 0 ;
transition : opacity 0.25 s ease;
}
. displacy-word : hover + . displacy-tag {
opacity : 1 ;
} A Despensa permite definir atributos personalizados através da representação JSON da análise nas words e nos arcs :
"words" : [
{
"tag" : " NNS " ,
"text" : " Robots " ,
"data" : [
[ " custom " , " your value here " ],
[ " example " , " example text here " ]
]
}
] Os atributos personalizados são adicionados como atributos de dados prefixados com data- para que seus nomes não entrem em espaços ou caracteres especiais. Se adicionado às words , os atributos de dados são anexados ao token ( .displacy-token ), se adicionados aos arcs , eles estão conectados à seta ( .displacy-arrow ):
< text class =" displacy-token " data-custom =" your value here " data-example =" example text here " > ... </ text >
