Foros del Web » Creando para Internet » HTML »

¿Existe un "modelo de polígonos" para svg y canvas?

Estas en el tema de ¿Existe un "modelo de polígonos" para svg y canvas? en el foro de HTML en Foros del Web. Los elementos html son tratados como rectángulos porque css nos provee de un modelo de cajas. Los elementos svg, ¿como son tratados? (polígonos con vertices ...
  #1 (permalink)  
Antiguo 24/09/2012, 22:34
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 15 años, 5 meses
Puntos: 269
¿Existe un "modelo de polígonos" para svg y canvas?

Los elementos html son tratados como rectángulos porque css nos provee de un modelo de cajas.
Los elementos svg, ¿como son tratados? (polígonos con vertices rectos o curvos) ¿cual sería el equivalente al modelo de cajas?
Supongo que svg y canvas ocuparán el mismo "modelo de polígonos" (disculpen la ignorancia).

Muchas gracias.

PD: no sabía donde colocar este tema, si en html, en javascript, o en css.

Última edición por cristian_cena; 24/09/2012 a las 22:40
  #2 (permalink)  
Antiguo 25/09/2012, 04:16
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 7 meses
Puntos: 1284
Respuesta: ¿Existe un "modelo de polígonos" para svg y canvas?

Hola:

La verdad es que me he perdido en eso de vértices rectos o curvos, ya que son trazas entre puntos... y cerrados (me refiero a svg y el tag polygon).

Antes de continuar te comento que no tengo experiencia en canvas, así que mi respuesta se limita al formato svg.

Las coordenadas (points) equivalen a las coordenadas de las áreas de los mapas de imágenes, así que generar un svg a partir de los mapas existentes es trivial, y por eso en mi experiencia personal me ha sido muy sencillo convertir mi mapa de España a su formato svg.

Me suena que con canvas es una respuesta muy parecida.

Por cierto, tal vez la parte canvas sea más oportuno para javascript, pero la parte svg en mi opinión está bien colocada aquí, o sea que al ser una pregunta compuesta, en este foro está bien.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 25/09/2012, 08:49
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 15 años, 5 meses
Puntos: 269
Respuesta: ¿Existe un "modelo de polígonos" para svg y canvas?

Gracias caricatos, me refería a que desconozco si existe algo parecido (equivalente) a la css box model pero para svg / canvas.

Es decir, en css: margin, border, padding, width y height son propiedades que corresponden con el modelo de caja y se me ocurrió que svg y canvas podrían tener propiedades vinculadas a un "modelo de polígono" o algo así.

Gracias.
  #4 (permalink)  
Antiguo 25/09/2012, 09:43
txemaarbulo
Invitado
 
Mensajes: n/a
Puntos:
Respuesta: ¿Existe un "modelo de polígonos" para svg y canvas?

Cita:
Iniciado por cristian_cena Ver Mensaje
Gracias caricatos, me refería a que desconozco si existe algo parecido (equivalente) a la css box model pero para svg / canvas.

Es decir, en css: margin, border, padding, width y height son propiedades que corresponden con el modelo de caja y se me ocurrió que svg y canvas podrían tener propiedades vinculadas a un "modelo de polígono" o algo así.

Gracias.
Con el permiso de caricatos, que seguro tiene mucha más base sobre el tema, te muestro algunas opciones que nos permite canvas:

Código Atributos:
Ver original
  1. attr
  2. Cevent.attr(string attr, string value)
  3. Cevent.attr(obj attr-value)
  4. Modifica el valor de un atributo o grupo de atributos.
  5.  
  6. Atributos
  7. fill: string color rgb, rgba, #hex, name (default "#000")
  8. stroke: string color rgb, rgba, #hex, name (default "")
  9. lineWidth: int ancho de linea (default 1)
  10. rotation: int angulo en grados sexagecimal (default 0)
  11. lineJoin: string (default "miter")
  12. lineCap: string (default "butt")
  13. composite: string (default "sorce-over")
  14. shadowColor: string dafault "#000"
  15. shadowOffsetX: int default 0
  16. shadowOffsetY: int default 0
  17. shadowBlur: int default 0
  18. tx: int traslado en x (dafault 0)
  19. ty: int traslado en y (default 0)
  20. scaleX: int escalado en x (dafault 1)
  21. scaleY: int escalado en y (default 1)
  22. skewX: int default 0
  23. skewY: int default 0
  24.  
  25. los siguientes atributos tienen su propio método
  26. scale
  27. skewX
  28. skewY
  29. rotate
  30. translate

En canvas-event-js presentan amplia documentación y diversos tipos de trabajos

AQUI puedes encontrar algunas muestras con polígonos regulares y los códigos correspondientes.
  #5 (permalink)  
Antiguo 25/09/2012, 23:51
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 15 años, 5 meses
Puntos: 269
Respuesta: ¿Existe un "modelo de polígonos" para svg y canvas?

Antes que nada muchas gracias por responder.

Creo que no me he explicado bien (o no los he entendido):

Quisiera saber en base a que "modelo" se renderiza el svg. Si lo planteo en terminos de "analogia con css (en concreto: con el modelo de cajas)" es porque podemos dar estilos css a cualquier tag svg, pero es evidente que estos tags no usan el modelo de cajas de css. En consecuencia: si svg no usa el modelo de cajas para renderizarse, entonces: ¿que es lo que usa?.

Gracias

Etiquetas: css, modelo, svg
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:09.