atributo de preenchimento de redefinição de caminho SVG que tem sido denominado de forma dinâmica através de uma classe adicionada

votos
0

Eu tenho um mapa SVG dos Estados Unidos, com um controle deslizante abaixo dela. O controle deslizante vai 2000-2018, e cada intervalo é de um ano. Quando você arrastar o controle deslizante para um ano, uma classe é anexado a cada estado, e o preenchimento muda.

As classes padrão são os nomes dos estados: .map3Alaska, .map3Alabama, etc.

Quando você move o cursor, o ano fica anexado como uma classe separada: .map3Alaska.obe2000, .map3Alaska.obe2001, etc. Isto é baseado em uma condição de saúde (neste caso, obesidade) e do ano.

Eu tenho uma função que remove cada classe adicional antes de um novo é adicionado, assim que você nunca ver qualquer coisa como .map3Alaska.obe2000.obe2001

Eu gostaria de um botão de reset que retorna o preenchimento para a cor padrão (branco). Eu tentei fazer isso através de uma função que adiciona conjuntos CSS: preenchimento para branco. Isso faz retornar o preenchimento de branco, mas, em seguida, se você mover o cursor novamente, o conjunto de enchimento pela classe anexada é negada pela regra CSS aplicado pela função de reset:

digite

Existe uma maneira de remover o atributo de preenchimento de todas as classes potenciais? Os seguintes formatos de classes são usadas (xx representa o ano, de 2000 a 2018):

  • Obe20xx (obesidade)
  • Dep20xx (depressão)
  • Ast20xx (asma)
  • Kid20xx (doença renal)
  • ha20xx (ataque cardíaco)

Eu tentei usar seletores de classe curinga, mas isso não funcionou:

    $([class^=dep], [class^=obe], [class^=ha], [class^=ast], [class^=kid], [class^=map3])
                    .removeAttr(
                        'fill'
                    )
Publicado 02/12/2019 em 23:59
fonte usuário
Em outras línguas...                            


1 respostas

atributo de preenchimento de redefinição de caminho SVG que tem sido denominado de forma dinâmica através de uma classe adicionada

votos
0

Eu tenho um mapa SVG dos Estados Unidos, com um controle deslizante abaixo dela. O controle deslizante vai 2000-2018, e cada intervalo é de um ano. Quando você arrastar o controle deslizante para um ano, uma classe é anexado a cada estado, e o preenchimento muda.

As classes padrão são os nomes dos estados: .map3Alaska, .map3Alabama, etc.

Quando você move o cursor, o ano fica anexado como uma classe separada: .map3Alaska.obe2000, .map3Alaska.obe2001, etc. Isto é baseado em uma condição de saúde (neste caso, obesidade) e do ano.

Eu tenho uma função que remove cada classe adicional antes de um novo é adicionado, assim que você nunca ver qualquer coisa como .map3Alaska.obe2000.obe2001

Eu gostaria de um botão de reset que retorna o preenchimento para a cor padrão (branco). Eu tentei fazer isso através de uma função que adiciona conjuntos CSS: preenchimento para "branco". Isso faz retornar o preenchimento de branco, mas, em seguida, se você mover o cursor novamente, o conjunto de enchimento pela classe anexada é negada pela regra CSS aplicado pela função de reset:

digite descrição da imagem aqui

Existe uma maneira de remover o atributo de preenchimento de todas as classes potenciais? Os seguintes formatos de classes são usadas (xx representa o ano, de 2000 a 2018):

  • Obe20xx (obesidade)
  • Dep20xx (depressão)
  • Ast20xx (asma)
  • Kid20xx (doença renal)
  • ha20xx (ataque cardíaco)

Eu tentei usar seletores de classe curinga, mas isso não funcionou:

    $("[class^=dep], [class^=obe], [class^=ha], [class^=ast], [class^=kid], [class^=map3]")
                    .removeAttr(
                        'fill'
                    )
Respondeu 02/12/2019 em 23:59
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more