2D renderização e zoom in com SVG
Pergunta
A minha tarefa é desenvolver um algoritmo que se encaixa diferentes tipos de curvas em um determinado ponto de seqüência em 2 espaço dimensional.
SVG Para ser capaz de testar o meu algoritmo, eu escolhi para exibir o resultado. Eu tenho vários problemas com ele.
Como pode haver muito diferentes entradas e saídas do meu algoritmo, é essencial que eu pudesse ver os arquivos SVG gerados com a capacidade de ampliar!
Mas um caminho em SVG podem ser exibidos apenas com uma determinada largura. Se eu aumentar o zoom, então a largura do caminho está ficando maior. Gostaria que a largura para ser, por exemplo 1 pixel em todos os níveis de zoom. Existe uma solução para isso?
também: pontos de exibição SVG pode? Sim,, pontos de matérias simples.? Eu descobri que ele não pode.
Obrigado
Solução
Muitos outros formatos vetoriais (como PostScript e PDF) permitirá que você use um golpe de largura de 0 para um acidente vascular cerebral "fio". Não é assim com SVG. No entanto, eu pensar você pode conseguir o que você quer se você usar uma porcentagem stroke-width. Consulte W3C especificações SVG para detalhes , mas, basicamente, você deve ser capaz de fazer algo parecido com isto:
stroke-width:"1%"
Isso deve derrame sua curva com uma largura de linha que é uma constante 1% do retângulo delimitador, independentemente do nível de zoom.
Quanto aos pontos, SVG não apoiá-los. Quando eu fiz isso no passado (usando PostScript) Eu sempre usei a arco com uma pequena redius para desenhar um pequeno círculo (que você pode preencher para fazer um ponto, se quiser).
@Zoli: Após o seu comentário, eu estava a ponto de sugerir que você olhar para PostScript para que você possa usar o fio stroke-width, quando me deparei com o non-scaling tempos vector efeito na especificação SVG :
vector-effect="non-scaling-stroke"
Basta adicionar este a sua curva e deve ser invariante a escala, de acordo com a especificação. Seus exemplo usa line
, mas deve trabalhar em suas curvas bem.
Outras dicas
Não há nenhuma
A solução é usar v.g.
A propriedade 'efeito vector' com o valor 'não-scaling-stroke' é o que você deve usar para dizer que o curso não deve escalar. Não é tão difícil de implementar uma solução de javascript que garante cursos estão devidamente escalados se 'vector efeito' não é suportado nativamente. Opera 9.5+ suporta nativamente.
Obrigado Naaff a ajuda. Acho que vou ficar com o Firefox, e eu vou especificar, para cada algoritmo de execução da linha de largura no arquivo SVG gerado. Que será adequado para mim.