Как стать автором
Обновить

Комментарии 43

Кстати раньше в colorpicker'ах ставили png-картинку с двумя градиентами (чёрный и белый), а цвет под ней рисовали.
colorpicker.com, например.
Когда-то увидев его подумал, что на javascript можно рисовать.
на яваскрипт можно рисовать для этого есть canvas
Это сейчас. А раньше-то и его не было…
И ещё SVG.
А для кроссбраузерности есть Dojo Toolkit, в котором есть Flash, Java, Silverlight, Canvas, SVG и VML.
canvas + ExplorerCanvas тоже как вариант кроссбраузерной реализации
А ещё есть реализация WebGL на Java
все гениальное просто. никогда не задумывался об этом :)
у меня была функция рисования градиента
сейчас по вашей схеме нарисовал эту картинку 4 строчками кода:

_holder.graphics.beginFill(0xFF0000);
_holder.graphics.drawRect(0, 0, 200, 200);
DrawUtils.drawLinearGradient(_holder.graphics, [0xFFFFFF, 0xFFFFFF], [1, 0], null, new Rectangle(0, 0, 200, 200), 0);
DrawUtils.drawLinearGradient(_holder.graphics, [0x000000, 0x000000], [0, 1], null, new Rectangle(0, 0, 200, 200), 90);

ну значит не зря я добавил линию на канве=)
Пример то работает, но код вообще не читабельный. Скажите, где вас учили так оформлять код?)
switch (lH){
      
      case 0: R = V; G = t; B = p; break;
            case 1: R = q; G = V; B = p; break;
              case 2: R = p; G = V; B = t; break;
               case 3: R = p; G = q; B = V; break;
                case 4: R = t; G = p; B = V; break;
                  case 5: R = V; G = p; B = q; break;}


Вот это конечно круто. Почему у вас новый case с дополнительным пробелом (а кое-где с доп. табуляцией)? Уровень вложенности одинаковый => отступ тоже одинаковый.
понял, спасибо за совет=)
И вот это тоже:
S /=100;
            V /=100;
     
           lH = Math.floor(H / 60);
      
              f = H/60 - lH;
                    
                     p = V * (1 - S); 
                     
                    q = V *(1 - S*f);
           
                       t = V* (1 - (1-f)* S);
просто вспомнил о кейсах, может кто воспользуется.
меня всегда убивал дополнительный уровень вложенности для многострочных кейсов.
потом как-то, не помню где, попался совет оформлять кейсы вообще с фигурными скобками:
case 0: {
    ...
    break;
}
я в колледже учусь, и нас нечему полезному за 3 года так и не научили. яваскрипт сам учу, а насчет код я пытаюсь с этим бороться =)
Маленький совет: постарайтесь получше освоить JS прежде чем писать статьи. Так лучше будет, честно.

И ещё. Лучше всего осваивать JS на практике. Самое лучшее здесь: напишите свой jQuery. Очень полезный опыт.
у меня такая же=)я долго мучался что бы от рисовать ее на канве но так и не смог. вот такую картинку я юзаю click me
Вы с собой разговариваете? :)
нет я пытался ответить на первый пост но не понятно по каким причинам после нажатия кнопки ответить мои комментарии оказуются в низу(походу кармой не вышел)=)
да только есть такой браузер ИЕ ;)
и тут есть хорошая табличка по которой можно понятно что юзать это мы будем не скоро=)
IE уже не так актуален, как раньше. Про IE6 лично я уже забыл
А почему-бы вместо канваса для радуги не использовать обычный linear-gradient в css?
потому что благодаря гугл есть такая библиотека ExplorerCanvas и она делает canvas относительно кроссбраузерным, а linear-gradient это css3 (а css3 пока не очень кроссбраузерный)
Можно продолжить и спросить, а почему-бы не использовать обычный однопиксельный бэграунд радуги для этой цели, это будет несколько дешевле, но всего 5кб и возможность масштабирования — аргумент.
можно, но тут решать уже вам.
Просто я делаю рисовалку на канве и мне по любому пройдется подключить ExplorerCanvas (поэтому мне выгодней использовать канву)
да и еще я подумал что по теме будет показать как от рисовать шкалу на канве картинку вставить любой дурак сможет
Пожалуй, сделать такую картинку не намного проще, чем запрограммировать.
Раньше ie9, кстати говоря, это не работает.
>>Раньше ie9, кстати говоря, это не работает.
вы на последнем демо проверяли?

>>Пожалуй, сделать такую картинку не намного проще, чем запрограммировать.
2 вариант:
— гугл
— photoshop градиент (делается на ура;))
Да, на последнем демо. У вас есть другие?
нет просто там не подключена эта библиотека =)
Вообще верно, буду внимательней. explorercanvas, видимо, вплоть до 6-го работает.
А для CSS3 есть css3pie
И он сможет нарисовать CSS3-градиент со спектром? Сильно сомневаюсь.
В IE есть градиентный фильтр, но он поддерживает только простые 2-цветные градиенты «от-до», без промежуточных колор-стопов.
Или там через VML?..
Двухцветные можно, а вот спектром… Не знаю, честно говоря, но это можно провернуть через несколько div-ов
потратил ровно 2 минуты
Вы не так меня поняли — запрограммировать такой градиент не намного сложнее, чем нарисовать. Это задачи одного порядка сложности.
Месяц назад передо мной встала точно такая-же проблема, решил вот так.
у вас получилось от рисовать левый блок на канве как я понял?
Да, см. строки 65-75 в client/colorpicker.js в репозитории. А в чем, собственно, проблема?
Ой, левый блок. Его отрисовывает ф-ция drawPicker на 77-93 строчке, но фон я ему задаю через CSS.
щас посмотрим =)
если завтра разберусь то добавлю в пост=)
Зарегистрируйтесь на Хабре , чтобы оставить комментарий

Публикации

Истории