[js]Замена цвета на картинке.

12
dimidrol
На сайте с 29.09.2005
Offline
191
1658

Ситуация. Есть некий предмет который можно покрасить в любой цвет. Палитра - RAL. Задача - как сделать так чтобы при выборе цвета в списке менялся цвет на изображении. Вариант - нарендерить 100500 картинок, для каждого цвета своя, можно но очень муторно. Как вариант - картинка png с прозрачным слоем в тех местах, где красим и замена backgroundа. Есть мылсь - svg и закрашивание соответствующих слоев, но затырка с IE. Может http://raphaeljs.com/ ?

Иногда полезно проигрывать - это держит тебя в тонусе... Мне так рассказывали (с) Shark Покупаю сайты (стройка/отделка/стройматериалы) по адекватной цене. Предложения в личку. Траф - обязателен
Ayavryk
На сайте с 11.10.2003
Offline
209
#1
dimidrol:
Как вариант - картинка png с прозрачным слоем в тех местах, где красим и замена backgroundа

Непонятно, чем не устраивает? Отрисовка в векторе процедура намного более геморройная хотя бы в процессе подготовки данных. Да и в растре края закрашенной области, наверное будут лучше смотреться за счет блюра.

Тынгыр, мынгыр, комсомол (http://erum.ru). Ехари, ехари, (жалобно) аяврик. /народная тунгусская песня/
dimidrol
На сайте с 29.09.2005
Offline
191
#2

Тут еще такой момент - есть шанс что будет осуществлен pisding со стороны конкурентов по аналогичным товарам и поэтому в иделе хочется решения на стороне сервера и потом динамическая загрузка в браузер. Хотя решение с прозрачным png тоже видится наилучшим.

Ayavryk
На сайте с 11.10.2003
Offline
209
#3

А смысл? Картинки то у вас вряд ли уникальные. Или где-то стыренные или с фирменного каталога.

Я бы попробовал программно налепить на картинку рэндомную рамку + логотип. На сайте естественно рамка будет срезана (размер рамки передавать вместе с картинкой), а если кто стырит - придется руками резать. В коде вряд ли кто ковырять будет.

До кучи получите уникальность картинки.

Ну и + какой-нибудь стандартный набор - типа проверки referer

Ayavryk
На сайте с 11.10.2003
Offline
209
#4
rovers:
уникальностью картинок поисковики уже наелись
жадничать - смысла нынче особого нет

Можно подробнее? Если есть 10 одинаковых картинок они выложат все десять или все-таки одну из 10 наиболее релевантную?

astraliens
На сайте с 25.09.2009
Offline
54
#5

не обязательно сразу генерить 100500 картинок, можно изначально только 1 эталонную иметь, а остальные по мере поступления запросов из неё генерить динамически и "кэшировать" результат.

тянуть ваши фотки, при желании, всеравно будут, защититься на 100% нет способа

ASTRALiENS - разработка сайтов (http://astraliens.net)
Ayavryk
На сайте с 11.10.2003
Offline
209
#6
rovers:
в вашем вопросе - жуткое противоречие как одна из 10 одинаковых картинок может быть релевантнее?... ))

Запросто: Если на клетке слона прочтёшь надпись «буйвол», не верь глазам своим. (с) К.Прутков

Посмотрите выдачу по картинкам, например "холодильник" - двух одинаковых не найдете, но по каждой картинке можно найти сотни клонов. Пример

dimidrol
На сайте с 29.09.2005
Offline
191
#7
rovers:
у афтора - другой сюжет

попытка запихать 100500 практически одинаковых картинок в индекс - черевато

предмет синюшный, предмет фиолетовый, предмет в красный горошек и т.д.

Мне не нужно 100500 картинок, мне нужно при выборе товара и указании цвета показывать "слона" картинкой. Делать один прозрачный png + немного js -> получить такое же решение еще на 15 сайтах. А я этого не хочу. Поэтому рассматриваю вариант генерации картинки на сервере и подгрузки на страницу, там можно и ватермарк наклеить. Для примера - 63 позиции по 300 цветов - это уже почти хостинг картинов получается. Зачем мне столько места держать? Затырка в том что картинки через ajax не передаются. Что делать?

K
На сайте с 23.12.2014
Offline
5
#8
dimidrol:
Затырка в том что картинки через ajax не передаются. Что делать?

Конвертируйте на сервере картинку в base64 и передавайте по Ajax.

Вариант с canvas не рассматривали? Вроде он во всех ходовых браузерах сейчас работает...

WordPress для начинающих (http://belentsov.ru) Ваш личный помощник выполнит любую работу в ЛЮБОЕ время (http://www.work-zilla.com?ref=121253&sub=search)
K
На сайте с 03.06.2015
Offline
45
#9

Если у вас могут стырить картинки, это не значит что могут продать то же самое. А вот если могут продать то же самое вместо вас, значит найдут картинки и без вас и тогда все поменяется. Дело, конечно же, не в картинках, это был бы маркетинговый нонсенс, что продает тот, у кого есть картинка. Дело в маркетинге. Когда вы его осилили у вас и картинки не будут тырить - не нужны они будут никому больше, поскольку все равно не продашь.

По технике. В теории травить не обязательно если в ключевой цвет выкрашены только значимые пикселы. Меняйте оттенок. В RGB это сделать непросто, придется сначала определить порог и молотить по всему диапазону, поэтому конвертят в HSL - http://stackoverflow.com/questions/26894858/dynamically-animating-hue-shift-on-canvas-image

MYSQL PHP JS HTML CSS SEO TXT США СССР
Ayavryk
На сайте с 11.10.2003
Offline
209
#10
dimidrol:
же решение еще на 15 сайтах.

На каждый из 15 сайтов для каждой картинки лепите свою рамку со случайным позиционированием элемента

пример:

На сайте естественно рамки кропать.

все три картинки уникальны. за счет того что позиция картинки на плашке рэндомная автоматом ее выкусить будет сложно, а парсить лениво. Проще стырить этот холодильник у кого-то другого.

От накладных расходов в виде трафика никуда не деться

Как вариант снижения накладных расходов - склеить несколько видов продукции во фрейм. порядок видов перемешать для каждого сайта. подозреваю что и в этом варианте картинки будут уникальными.

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий