Tag: canvas

La modificación de un canvas mediante la manipulación de píxeles de alguna manera no funciona del todo en IE9

En un primer bash de realizar una manipulación de píxeles en un canvas de HTML5, he escrito un código para cambiar una parte específica de una image de background. Estoy usando una image de máscara para marcar las partes específicas que deben cambiarse. Y dibujo dos líneas verticales de 1 píxel a la vez. Mi […]

Sobre la marcha image del cliente al convertidor webp … pero los png no son transparentes

este es un código de trabajo para convertir jpg o png a webp El nuevo formatting de image de Google es en promedio 30-40% más pequeño que el de jpg o png 1. Abrir con Chrome 2. Establecer la calidad 3. Despliegue una image dentro de la página 4.Espere (depende del tamaño … pruebe primero […]

EaselJS, Canvas, image de bitmap de baja calidad y punto de logging no funciona

Empecé a usar EaselJS para un proyecto en el que estoy trabajando y estoy un poco atrapado con la class Bitmap. Lo que hago es agregar una image de 3000 x 4000 al canvas / escenario y dejar que el usuario lo escale y lo gire. Principalmente estoy usando la siguiente function: @width = 3000 […]

Canvas o SVG para el proyecto de diseñador de sala

Estoy a punto de comenzar a trabajar en un proyecto de diseñador de habitaciones que te permitirá drag and drop panetworkinges / puertas / muebles, etc. en una grilla para diseñar una habitación. He decidido que drag and drop PNG transparentes y posicionarlos absolutamente no va a funcionar y no quiero usar flash, por lo […]

El object no admite esta propiedad o método IE8

Estoy usando este código de grises de HTML5: http://webdesignerwall.com/demo/html5-grayscale/. Sin embargo, en el javascript, IE8 devuelve el error "El object no admite esta propiedad o método". ¿Alguien sabe qué está mal con el JavaScript? Estoy bastante seguro de que esta línea está causando el error " var ctx = canvas.getContext('2d'); " Gracias. // $(".item img").css({"display":"none"); […]

canvas html5: ¿el ancho / alto debe definirse en línea?

He estado jugando con HTML5 / Javascript y encontré algo que no entiendo. Intenté escribir algunas rutinas básicas para trabajar con el canvas de HTML5 y descubrí que la function drawImage no dibujaba nada. Al imaginar que era mi código, utilicé el código de un tutorial existente, concretamente HTML5 Canvas Image Tutorial . Cuando incluí […]

Generar aleatoriamente objects HTML Canva

Estoy creando un patrón en un canvas HTML para un desafío. ¿Cómo generaría aleatoriamente forms como las codificadas a continuación para formar un patrón similar a la image? Creé una versión generando el código con DrawScript en Illustrator pero está lejos de ser ideal, ¿cómo podría hacer lo mismo con un ciclo? Gracias //triangles ctx.fillStyle="rgb(75,128,166)"; […]

Conecte dos objects usando tela js

Actualmente tengo una aplicación de canvas donde puedo agregar objects (forms). Aquí está mi FIDDLE . Básicamente, click una nueva simulación que inicializará el canvas, luego puede agregar un círculo o rectángulo. Estoy tratando de agregar una function llamada "Agregar hijo" donde puede hacer clic en algún object (forma), luego hacer clic en Agregar hijo […]

Cómo acceder al context del canvas en React

Hice un selector de color con React y Canvas. Actualmente, los componentes se representan en React y Canvas se hace con vainilla javascript. Me gustaría que los dos se engranen más, así que quiero que los events de clic se manejen con Reaccionar. Por ejemplo, esto colorStrip.addEventListener("click", click, false); function click(e) { x = e.offsetX; […]

Método para dibujar círculos en un patrón piramidal

Quiero dibujar bolas circulares en un canvas HTML en un patrón de pirámide. Me gusta esto: Fiddle donde puedes mostrarme el algorithm: https://jsfiddle.net/ofxmr17c/3/ var canvas = document.getElementById('canvas'); canvas.width = 400; canvas.height = 400; var ctx = canvas.getContext('2d'); var balls = []; var ballsLength = 15; var Ball = function() { this.x = 0; this.y = […]

Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.