Страницы

Поиск по вопросам

Показаны сообщения с ярлыком image. Показать все сообщения
Показаны сообщения с ярлыком image. Показать все сообщения

вторник, 9 июля 2019 г.

Конвертация в вектор растрового изображения с низким разрешением

Имеется картинка низкого разрешения 32*32px (пиксель-арт), которая при конвертации через potrace
convert input.png temp.pnm potrace temp.pnm -s -o output.svg
или через inkscape (вроде он тоже использует potrace), дает примерно такой результат.

Как при конвертации сохранить пропорции исходной картинки и не сглаживать так сильно?


Ответ

Можно попробовать разные настройки
potrace temp.pnm -s -t0 -u1 -o output.svg
Или отмасштабировать изображение в несколько раз:
convert input.png -scale 200% temp.pnm potrace temp.pnm -s -o output.svg
Результаты с различными настройками:

понедельник, 8 июля 2019 г.

Как нормально исключить из области обработки изображения некоторый массив Point (c#)?

Доброго времени суток, господа! Суть вопроса состоит в следующем: Я обрабатываю фото попиксельно:
Bitmap bit = new Bitmap(StartImage); Size size = bit.Size; for (int y = 0; y < size.Height; y++) for (int x = 0; x < size.Width; x++) { Color c = bit.GetPixel(x, y); ... Некоторые действия с пикселем ... }
Понадобилась возможность исключать из области обработки некоторые области. Ну, я подумал, что, мол, фигня вопрос: сейчас задам на вход массив точек, которые обрабатывать не нужно, а перед получением пикселя и его обработкой поставлю
if (ExceptPoints.Contains(new Point(x,y)))
и дело в шляпе! Но не тут-то было. Метод начал работать просто до чертиков медленно (а когда для тестирования я выбрал для исключения половину всего изображения, я не дождался результата и в течение 4 минут). Попробовал реализовать многопоточность для решения этой задачи. Но чуть не спалил себе ЦП (99% загрузки) хД В общем, нужно как-то сие дело оптимизировать (или реализовать некорявую многопоточность), но в голову не идут идеи, как же это сделать. Так что обращаюсь к вам за советом по сему нелегкому делу!
P.S. - исключаемые области изначально задаются кругами с рандомным радиусом. Но что проверять, входит ли точка в один из кругов, что проверять, есть ли она среди массива, содержащего все точки этих кругов, по времени выходит одно


Ответ

Есть два пути ускорения.
Во-первых, можно вместо линейной по количеству проверяемых точек проверке на вхождение в List (или Point[]) собрать точки в HashSet, у которого проверка на вхождение очень быстрая (O(1)).
Во-вторых, для работы с изображениями лучше всего отказаться от очень медленного GetPixel/SetPixel. Вместо этого имеет смысл получить «сырые» данные, используя LockBits (в статье на MSDN есть хороший пример), и работать с ними.

суббота, 6 июля 2019 г.

Изменение картинки в кнопке при наведении

Столкнулся с проблемой, есть кнопка с картинкой svg, при наведении на кнопку нужно поменять стиль кнопки и цвет этого изображения. Если первое не вызывает затруднений, то со вторым проблемы. Знаю что можно менять цвет картинки svg через fill, но чего-то не работает, возможно я сам не до конца понимаю как его использовать. Ещё как вариант вижу, просто заменить картинку на такую же, просто другого цвета, но не до конца понимаю как.
.imga{ color: rgb(35, 112, 142); } .imga:hover{ border-radius: 10px; color: red; font-size: 14px; }


Ответ

Обычно для такого используют css background. Если добавлять svg через тег img, то повлиять на стили нельзя. Сделайте две картинки (или спрайт), этого будет достаточно. Есть варианты использования keyframes, svg, анимации, анимации с javascript, но это уже избыточно. Пример анимации SVG-иконки.
.imga { color: rgb(35, 112, 142); height: 24px; width: 120px; background-size: 18px; background-repeat: no-repeat; background-position: 5px left; transition: all .2s; } .imga { background: url('https://www.shareicon.net/data/128x128/2016/07/10/119178_chat_512x512.png') 5px center no-repeat; background-size: 18px; } .imga:hover{ border-radius: 10px; color: red; font-size: 14px; background: url('https://www.shareicon.net/data/512x512/2016/01/03/697450_chat_512x512.png') 5px center no-repeat; background-size: 18px; }

среда, 19 июня 2019 г.

не получается масштабировать изображение под разные экраны

в папке assets лежит изображения, под обычные телефоны изображение норм, пробую адаптировать под планшеты и большие экраны, создал layout(large,xlarge), проставил размеры изображения, однако возникла проблема: если я ставлю у контейнера параметры wrap_content, то на маленьких экранах все ок, на больших оно мелкое, однако если ставлю match_parent ширину и высоту 350dp,550dp, то изображение растягивается по контейнеру, и становится как будто расплюченным... с параметром scaleType игрался, оно не играет влияния если параметры выставлены из последнего варианта.подскажите как быть? фото прилагаю


ссылки на изображения лежат в json файле в assets, загружаю так:
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setRetainInstance(true); if (savedInstanceState != null && savedInstanceState.containsKey(EXTRA_STATE_KEY)) position = savedInstanceState.getInt(EXTRA_STATE_KEY); mItem = (String) getArguments(). getSerializable(EXTRA_ITEM); LoadMediaTask loadMediaTask = new LoadMediaTask(); loadMediaTask.execute(mItem); try { mSubject = loadMediaTask.get(); } catch (InterruptedException | ExecutionException e) { e.printStackTrace(); } }
@Override public void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); outState.putInt(EXTRA_STATE_KEY, position); }
class LoadMediaTask extends AsyncTask {
@Override protected Subject doInBackground(String... params) { mgr = getActivity().getAssets(); ObjectMapper mapper = new ObjectMapper(); try { InputStream inputStream; inputStream = mgr.open(mItem); mSubject = mapper.readValue(inputStream, Subject.class); inputStream.close(); } catch (IOException e) { e.printStackTrace(); } return mSubject; } }
потом метод парсит ссылки:
public void OnChangePhoto() { mp.reset(); mgr = getActivity().getAssets(); if (mSubject.content != null) { try { Uri imgUri = Uri.parse(mSubject.content.get(position).photos); iteration_Change_Question(imgUri,mImageSwitcher);
String mName = mSubject.content.get(position).signature; tv.setText(mName);
Uri soundUri = Uri.parse(mSubject.content.get(position).sounds); String sound2 = soundUri.getPath().substring("/android_asset/".length());
AssetFileDescriptor afd = getActivity().getAssets().openFd(sound2); mp.setDataSource(afd.getFileDescriptor(), afd.getStartOffset(), afd.getLength()); afd.close(); mp.prepare(); mp.start(); } catch (IOException e) { e.printStackTrace(); } } }
и еще метод :
public void iteration_Change_Question(Uri imgUri, ImageSwitcher view) { String stream = imgUri.getPath().substring("/android_asset/".length()); String add = "assets://" + stream; ImageLoader.getInstance().displayImage(add, new CustomViewAware(view)); }
еще класс
public class CustomViewAware extends ViewAware { public CustomViewAware(View view) { super(view); }
@Override protected void setImageDrawableInto(Drawable drawable, View view) { view.setBackgroundDrawable(drawable); }
@Override protected void setImageBitmapInto(Bitmap bitmap, View view) { view.setBackgroundDrawable(new BitmapDrawable(bitmap)); } }
попробовал делать так:
@Override protected void setImageBitmapInto(Bitmap bitmap, View view) { bitmap.setDensity(DisplayMetrics.DENSITY_MEDIUM); view.setBackgroundDrawable(new BitmapDrawable(bitmap)); }
и так :
@Override protected void setImageBitmapInto(Bitmap bitmap, View view) { bitmap.setDensity(context.getResources().getDisplayMetrics().densityDpi); view.setBackgroundDrawable(new BitmapDrawable(bitmap)); } }
но не помогает((


Ответ

Проблема, что если изображение грузится не из ресурсов, то после загрузки надо выставить правильное значение density для него.
Bitmap bmp = ((BitmapDrawable)imageView.getDrawable()).getBitmap(); // custom density bmp.setDensity(DisplayMetrics.DENSITY_XXX); // or display density bmp.setDensity(getResources().getDisplayMetrics().densityDpi);
Посмотрите в этом направлении. Может проще положить все в ресурсы?

пятница, 14 июня 2019 г.

WPF. Image. Не отображает картинку

Есть картинка В конструкторе окна оно ее видит и отображает, при запуске программы - нет. Если инициализировать ее в конструкторе класса - пишет не удается найти ресурс, но как это, если в окне она ЕСТЬ!!!??? Помогите плиз!


Ответ

Исходя из /bin/debug/, думаю, вы делаете что-то не то.
Для начала, картинку нужно добавить в проект:

Убедитесь, что в качестве Build Action указано Resource, и отключено копирование в выходной каталог:

Теперь картинку можно подключать через путь внутри проекта:

Обратите внимание, что в проекте картинка лежит в каталоге Resources, и это соответствует пути в pack URI.

четверг, 30 мая 2019 г.

Библиотека под unix для работы с изображениями

Подскажите пожалуйста либу под unix, которая позволит выполнять все функции с изображениям: обрезать, склеивать, переворачивать, и т.д.
Желательно уже скомпилированную и с описанным API.


Ответ

вопрос не по стандартам, но
http://www.boost.org/doc/libs/1_61_0/libs/gil/doc/index.html http://www.imagemagick.org/Magick++/Image++.html - с чем в этом примере вы не смогли разобраться? еще более высокоуровневая либа http://cimg.eu/ что значит "уже скомпилированную"? если у вас проблемы со сборкой библиотеки с нуля - для убунты есть готовый пакет libmagick++-dev

среда, 22 мая 2019 г.

SASS, задать высоту изображению, исходя из его ширины

Изображение должно занимать 100% ширины блока. Блок резиновый, до определённых моментов. Мне нужно, чтобы высота изображения была в 3,3 раза меньше, чем ширина. Как это задать в SASS?


Ответ

Вариант с img {position: absolute;}
.container { max-width: 400px; width: 100%; } .image { height: 0; padding-bottom: 30%; position: relative; width: 100%; } img { display: block; height: 100%; left: 0; object-fit: cover; position: absolute; top: 0; width: 100%; }


Или смотреть на jsfiddle
Вариант с инлайновым background-image
.container { max-width: 400px; width: 100%; } .image { background-position: 50% 50%; background-size: cover; height: 0; padding-bottom: 30%; position: relative; width: 100%; }

Или смотреть на jsfiddle

вторник, 14 мая 2019 г.

Какого цвета больше на картинке.

Допустим есть несколько изображений. Нужно для них сгенерировать фон. Для первой картинки очевидно что он должен быть оранжевым, для второго темно-серым, для третьего не понятно)
Как програмно узнать (желательно imagemagick) какого цвета больше на картинке?


Ответ

Конвертнуть в indexed color формат, уменьшив число цветов до 256 или ещё меньше. imagemagick convert в histogram сосчитает кол-во упоминаний этих цветов, возьмите оттуда максимум.
Вот командная строка, которой я получил цвета для ваших примеров:
convert image.jpg -format %c -depth 8 histogram:info:histogram_image.txt && sort -n histogram_image.txt | tail -1
Для ваших трёх изображений (вырезал из примера), «победили» следующие цвета:

Вот так выглядит 10-пиксельная рамка соотв. цветов с исходными изображениями:

пятница, 26 апреля 2019 г.

Распознавание символов и работа с изображенями

Имеется нейронная сеть, способная распознавать символы. При загрузке рисунка из Paint размеров 150 на 150 всё работает нормально.Фон здесь белый, буква нарисована чёрным цветом.

При загрузке картинки ( также 150 на 150) с прозрачным фоном программа работает "наоборот"
Для удобства понимания вывел цвета пикселей( во втором случае первый пиксель, который является прозрачным, почему-то распознаётся как чёрный, а чёрный соответственно не является почему-то чёрным).
Первая и вторая картинка имеет одинаковый формат .png
Каким образом можно настроить программу для работы с изображением на прозрачном фоне?
Метод считывания картинки
public void get(Bitmap map) { for (int x = 0; x < mbut.GetLength(0); x++) { for (int y = 0; y < mbut.GetLength(1); y++) { Color col = map.GetPixel(x, y); if (col.R == 0 && col.B == 0 && col.G == 0) mbut[x, y] = true; else label9.Text = "Цвет пикселя номер " + x + ":" + y+" "+ Convert.ToString(map.GetPixel(x, y)); } } label10.Text = "Цвет первого пикселя: " + Convert.ToString(map.GetPixel(0, 0)); }
Метод прорисовки весов
public void draw(int n) { using (Bitmap map = new Bitmap(150, 150)) { for (int x = 0; x < weight.GetLength(0); x++) { for (int y = 0; y < weight.GetLength(1); y++) { if (weight[x, y] > 1) { map.SetPixel(x, y, Color.Black); } } } map.Save(String.Format("Pictures/{0}.png",n), System.Drawing.Imaging.ImageFormat.Png); } }


Ответ

Предполагаю что проблема в работе с каналами цветного изображения в цветовой схеме ARGB. Когда Paint сохраняет изображение, он приводит её к RGB и проблем не возникает. При других редакторах цветовая схема остается ARGB
Вот какая складывается ситуация:
Вы берете цветовой схемы, в первом случае это RGB, и по каналу R определяете черный это или не черный. В итоге инициализация проходит успешно.
Во втором случае с схемой ARGB, в которой изображение имеет прозрачность, первым каналом является A - alpha(оно-же прозрачность) вы пытаетесь по прозрачным цветам определить черный и сталкиваетесь с ситуацией когда все пиксели которые прозрачны - получают черный цвет а те которые не прозрачны остаются белыми. В этом и кроется секрет вашей хитроумной инверсии :)

воскресенье, 7 апреля 2019 г.

Как в C# конвертировать изображение произвольного формата в матрицу?

Можно ли создать Int24 (24-битовый тип) в C#?
Основная задача:
Залить каждую отдельную белую область на бинарном изображении уникальным цветом color формата Format24bppRgb (color++ для каждой очередной области). Получить полный список таких объектов, состоящих из конечного набора пикселей.


Ответ

Вы подошли к задаче не с той стороны. Вы, видимо, пытаетесь сделать 24х-битный тип данных чтобы расположить его в массиве, который повторит по структуре картинку. Но в C# так сделать затруднительно.
Вместо этого, можно сделать отдельный класс с индексатором, который будет выглядеть снаружи как массив - а внутри будет сам правильно раскладывать цвета пикселей по байтам:
public class BitmapAccessor { private byte[] scan0; // Или любое другое хранилище private int stride; // (3 * width + 3) / 4 * 4. Ну или можно взять это число из BitmapData.Stride
// ...
public Color this[int x, int y] { get { var index = 3 * x + stride * y; return Color.FromArgb(scan0[index], scan0[index+1], scan0[index+2]); // точный формат не помню, возможно аргументы надо поменять местами } set { var index = 3 * x + stride * y; scan0[index] = value.R; scan0[index+1] = value.G; scan0[index+2] = value.B; } } }

пятница, 5 апреля 2019 г.

Добавление изображения в файл .docx с помощью python

Обычными средствами не получается добавить изображение в конец файла. Код
old_image = open('Pupils.png', 'r').read() new_image = open('new_pro.docx', 'a') new_image.write(old_image) new_image.close()
Какие есть способы решить эту задачу?


Ответ

Python хорош тем что на каждый случай есть библиотека. В данном случае это либа docx. Сначала установим её (на Linux нужны права root)
pip install python-docx
А затем просто добавим изображение.
from docx import Document
document = Document("./foo.docx")
document.add_picture('./image-filename.png') document.save("./foo.docx")

понедельник, 1 апреля 2019 г.

Загрузка картинок из сети в приложение Android

Интересует вопрос подобной реализации, например: есть картинка на html странице, как мне загрузить её в приложение и показать в ImageView? В программировании новичок, может подскажете ресурсы и либы?


Ответ

Хороший пример с наследованием загрузчика картинки от AsyncTask и определением своего метода doInBackground(), взятый с английского SO, который взял его с Android Developers, который уже его убрал.
Сам AsyncTask представляет собой реализацию короткого асинхронного запроса для основного GUI потока без необходимости самому ковырятся с потоками.
// Показать картинку new DownloadImageTask((ImageView) findViewById(R.id.imageView1)) .execute("http://java.sogeti.nl/JavaBlog/wp-content/uploads/2009/04/android_icon_256.png"); }
public void onClick(View v) { startActivity(new Intent(this, IndexActivity.class)); finish();
}
private class DownloadImageTask extends AsyncTask { ImageView bmImage;
public DownloadImageTask(ImageView bmImage) { this.bmImage = bmImage; }
protected Bitmap doInBackground(String... urls) { String urldisplay = urls[0]; Bitmap mIcon11 = null; try { InputStream in = new java.net.URL(urldisplay).openStream(); mIcon11 = BitmapFactory.decodeStream(in); } catch (Exception e) { Log.e("Ошибка передачи изображения", e.getMessage()); e.printStackTrace(); } return mIcon11; }
protected void onPostExecute(Bitmap result) { bmImage.setImageBitmap(result); } }
И в манифесте для приложения нужно конечно же разрешить загрузку:

Если нужно быстро и без всякой асинхронности, обработки ошибок и.т.д.:
URL newurl = new URL(image_location_url); mIcon_val = BitmapFactory.decodeStream(newurl.openConnection() .getInputStream()); myImageView.setImageBitmap(mIcon_val);
Для совсем ленивых однострочник на Picasso
Picasso.with(context).load(myImageURL).into(imageView);

понедельник, 18 марта 2019 г.

Картинки по кириллическому адресу

Есть картинка расположенная по кириллическому адресу вида http://вася-пупкин.бел/NAME.jpg И когда я пытаюсь её загрузить при помощи Glide или Picasso то ничего не выходит, никакой реакции. Как можно декодировать URL в подходящий вид? Сразу скажу что пробовал и не помогло:
Uri.encode(url) IDN.toASCII(post.getImgUrl())


Ответ

Метод который поможет перевести адрес из кириллицы в Punycode
public static String convertUnicodeURLToAscii(String url) throws URISyntaxException { if (TextUtils.isEmpty(url)) return url; url = url.trim(); // Handle international domains by detecting non-ascii and converting them to punycode boolean isAscii = CharMatcher.ASCII.matchesAllOf(url); if (!isAscii) { URI uri = new URI(url); boolean includeScheme = true; // URI needs a scheme to work properly with authority parsing if (uri.getScheme() == null) { uri = new URI("http://" + url); includeScheme = false; } String scheme = uri.getScheme() != null ? uri.getScheme() + "://" : null; String authority = uri.getRawAuthority() != null ? uri.getRawAuthority() : ""; // includes domain and port String path = uri.getRawPath() != null ? uri.getRawPath() : ""; String queryString = uri.getRawQuery() != null ? "?" + uri.getRawQuery() : ""; // Must convert domain to punycode separately from the path url = (includeScheme ? scheme : "") + IDN.toASCII(authority) + path + queryString; // Convert path from unicode to ascii encoding url = new URI(url).toASCIIString(); } return url; }

суббота, 16 марта 2019 г.

Определение количества пикселей определенного цвета на луче из центра координат

Декартова система координат. Черно белое изображение. Центр находиться самостоятельно, основываясь на данных по общей площади изображения (центр тяжести).
Далее из центра нужно проводить лучи под углами от 0 до 360 с заданным шагом (например, 5 градусов). И для каждого луча, считать количество черных пикселей на нем.
Как пробовал считать я. Луч брал за гипотенузу, и через тангенс угла - находил противолежащий катет. Проделывал эту операцию для каждого пикселя по оси Х, и на пересечении координат пикселей Х и величины катета - проверял черный пиксель или нет.
Но данные какие то слишком неточные. Для изображения буквы "К" я получил почти одинаковые значения количества пикселей на всех лучах. Подозреваю, что я считаю не правильно. Делаю это на C# .NET.
Сама задача академическая. В чем суть. Строиться гистограмма, которая показывает отношение количества пикселей к углу луча. Для изображений символов, эти гистограммы субъективно похожи. Грубо говоря, для одного символа разных шрифтов - гистограммы будут схожи.
Координаты центра тяжести находятся по формулам.
Для координаты Х
Для координаты Y
Функция A(). Значение равно 1 - если пиксель черный, 0 - если белый.
Посоветуйте что-то или подскажите решение.


Ответ

Посмотрите картинку

Ваши лучи наложенные на пиксельную сетку дают большую погрешность. Судя по всему, дело именно в этом.
Вот еще хорошая картинка, на которой видно что как лучи пересекают пиксели.

пятница, 15 марта 2019 г.

Оптимизация алгортима перебора пикселей WPF C#

Здравствуйте, есть метод получения массива яркостей из BitmapSource для дальнейшего анализа:
public const float CoeffColor = ((float)100 / 255 * 3) / 10000; //... arrayPixelsImage = new byte[SizeArrayPixels]; source.CopyPixels(arrayPixelsImage, StriteImage, 0); //typeof(source) == BitmapSource float[,] massBrightness = new float[WidthImage, HeightImage]; Parallel.For(0, WidthImage, x => { for (int y = 0; y < HeightImage; y++) { int indx = y * WidthImage * 4 + 4 * x; float brightness = (float)(arrayPixelsImage[indx] + arrayPixelsImage[indx + 1] + arrayPixelsImage[indx + 2]) * CoeffColor; massBrightness[x, y] = brightness; } }); return massBrightness;
Интересует то, как можно его оптимизировать, в плане времени выполнения?


Ответ

Погонял алгоритм на fullHD jpeg'e. У меня на нём выходит чуть боле 2млн итераций суммарно.(внешний параллельный + внутренний) И тут, я боюсь оптимизировать особо не получится. Примерные затраты по коду:
int indx = y * WidthImage * 4 + 4 * x; -25%
float brightness = (float)(arrayPixelsImage[indx] + arrayPixelsImage[indx + 1] + arrayPixelsImage[indx + 2]) * CoeffColor; -70%
massBrightness[x, y] = brightness;-3%
сам цикл -2%
Учитывая общее кол-во итераций не лишним будет отметить, что накладные расходы на создание нового таска на каждой итерации Parallel.For практически нивелируют выигрыш от использования распараллеливания при сравнении с последовательным циклом с таким же кол-вом итераций. Т.е. цикл с 2М итераций с тем же телом выполняется почти за то же кол-во тиков.
Резюмируя свои мысли по поводу оптимизации данного кода:
На C# вряд ли удастся достичь хотя бы 2-х кратного прироста производительности. Можно оптимизировать все вычисления и операции доступа/присвоения, но максимум, чего удастся добиться это 30% прироста на "удачном" прогоне по отношению к среднему результату до оптимизации. Если учесть что винда система отнюдь не реального времени то даже оптимизированный вариант может ( и достаточно часто будет) отрабатывать дольше чем средне время для не оптимизированного варианта.
Если нужно "лопатить" большие объёмы данных и по другому никак при этом выполняя на каждом кванте (единице данных) достаточно простые/быстрые операции то я рекомендую смотреть вам в сторону использования ресурсов GPU (OpenCL или CUDA)
Для всех остальных случаев я бы смотрел в сторону упрощения алгоритма или уменьшения числа операций. Например понижал бы разрешение изображения пока это не сильно сказывается на результате. Ощутимо упростить что-либо в этих 3-х строчках кода вряд ли получится. Поэтому думайте как уменьшить число итераций.

воскресенье, 10 марта 2019 г.

Загрузка изображения в Image из бинарных данных

Доброго времени суток!
Необходимо загружать и выгружать данные из Image в бинарные данные, но не понимаю как. Ранее использовал binding к ресурсам или физическому файлу на диске.
Что я делал (код писал по памяти, потому могут быть опечатки или некоторые не точности)?
Создал окно, в которое поместил Image Source="{Binding myImage, converter={x:static StringToBitmapImageConverter}}" Как видно в свойстве myImage расположен string в формате base64 (данных загружаются из XML) и при помощи конвертера я их привожу в формат класса BitmapImage Конвертер, если получает пустую строку, или не валидные данные, загружает из ресурсов значок по умолчанию. При клике по картинке, открывается диалог выбора файла, откуда я считываю его бинарное представление и перевожу его в формат string Base64 После открытия файла - я не вижу картинку (она не отображается). Однако картинка по умолчанию загружается корректно.
Не могу понять в чем проблема.
Попробую привести пример кода, связанного с проблемным местом (как я думаю)
Конвертер
public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { if (value is string && targetType != null && targetType.Equals(typeof(ImageSource))) // здесь я экспериментировал с проверкой типа, по отладке понял, что от окна приходит ImageSource { var bitmap = new BitmapImage(); try { var buffer = System.Convert.FromBase64String(value as string); using (var ms = new MemoryStream()) { // Здесь загрузка проходит, но изображение не появляется на экране ms.Write(buffer, 0, buffer.Length); ms.Seek(0, SeekOrigin.Begin); bitmap.BeginInit(); bitmap.StreamSource = ms; bitmap.CreateOptions = BitmapCreateOptions.IgnoreColorProfile; bitmap.CacheOption = BitmapCacheOption.Default; bitmap.EndInit(); } } catch (Exception ex) { Trace.WriteLine(ex.Message); } return bitmap; } return GetDefaultBitmapImage(new Uri("pack://application:,,,/Money;Component/Ribbon/Coins/blue.png")); }
private object GetDefaultBitmapImage(Uri uri) { // Здесь загрузка проходит корректно var bitmap = new BitmapImage(); bitmap.BeginInit(); bitmap.UriSource = uri; bitmap.EndInit(); return bitmap; }
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { if (value is BitmapSource && targetType != null && targetType.Equals(typeof(string))) { var bitmap = value as BitmapImage; if (bitmap != null && bitmap.StreamSource.CanRead) { byte[] buffer = new byte[bitmap.StreamSource.Length]; var count = bitmap.StreamSource.Read(buffer, 0, buffer.Length); if (count == buffer.Length) { return System.Convert.ToBase64String(buffer, Base64FormattingOptions.InsertLineBreaks); } } } return string.Empty; }
Описание класса к которому идет привязка
public class CoinViewModel : Vm { private Guid _ID; public Guid ID { get => _ID; set => Set(ref _ID, value, nameof(ID)); }
private string _Front; public string Front { get => _Front; set => Set(ref _Front, value, nameof(Front)); }
private string _Back; public string Back { get => _Back; set => Set(ref _Back, value, nameof(Back)); }
public static explicit operator CoinDataView(CoinViewModel vm) { return new CoinDataView() { ID = vm.ID, Name = vm.Name, Count = vm.Count, SeriaID = vm.SeriaID, Back = vm.Back, Front = vm.Front }; } }
ну и собственно говоря, так происходит привязка


Ответ

Ваша ошибка в том, что вы освобождаете поток с данными, который использует BitmapImage, этого не надо делать — уберите using и напишите просто:
bitmap.StreamSource = new MemoryStream(buffer);

понедельник, 4 марта 2019 г.

Opencv python конвертация изображения

После выполнения, кода я получаю черно-белое изображение, которое состоит из двух измерений (ширина высота) и само значение от 0 до 255 - от черного до белого. Для дальнейшего использования мне необходимо конвертировать его в rgb8. Например функция cv2.floodFill не принимает изображение, которое я получил. Вот сам код:
import sys import cv2 import numpy as np import time from matplotlib import pyplot as plt
img = cv2.imread('2.jpg') gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY) ret, thresh = cv2.threshold(gray, 0, 255, cv2.THRESH_BINARY_INV+cv2.THRESH_OTSU) # noise removal kernel = np.ones((3, 3), np.uint8) opening = cv2.morphologyEx(thresh, cv2.MORPH_OPEN, kernel, iterations = 2) # sure background area sure_bg = cv2.dilate(opening, kernel, iterations=3) # Finding sure foreground area dist_transform = cv2.distanceTransform(opening, cv2.DIST_L2, 5) ret, sure_fg = cv2.threshold(dist_transform, 0.55 * dist_transform.max(), 255, 0) # Finding unknown region sure_fg = np.uint8(sure_fg) unknown = cv2.subtract(sure_bg, sure_fg) # Marker labelling ret, markers = cv2.connectedComponents(sure_fg) # Add one to all labels so that sure background is not 0, but 1
markers = markers+10 # Now, mark the region of unknown with zero markers[unknown == 255] = 0 markers = cv2.watershed(img, markers) img[markers == -1] = [255, 0, 0] cv2.imwrite('6.jpg', markers)
Есть ли возможность конвертировать markers в нормальное изображение?


Ответ

Команда
np.ndarray.astype(np.uint8)
помогла

среда, 12 декабря 2018 г.

Сгенерировать изображения заданного размера

Хочу сделать простенький генератор товаров для интернет-магазина. Нужно сгенерировать картинки-заглушки для каждого товара. Что-то типа этого:
Нужен скрипт или подсказка как это сделать.
Если есть какой-то бесплатный ресурс, который отдает разные изображения через api, то тоже пойдет.


Ответ

С robohash.org можно получать шикарные разноцветные глазасто-ушастые тостеры
Ссылка такого вида:
https://robohash.org/какая-то_строчка?set=set3

(сгенерированы по строчкам stackoverflow.png и ru.stackoverflow.png)
Алгоритм детерминированный, по одной и той же строчке будет выдаваться одна и та же картинка.
Чтобы не слишком плющить этот сервис, можете поднять его у себя из исходников (Python!), можно даже на собственном наборе составляющих, более подходящих под ваши цели. Или хотя бы кэшировать ответы на собственном сервере.

вторник, 27 ноября 2018 г.

Выделение кривой области WPF

Здравствуйте, есть карта страны(изображение). Нужно обработать клик по областям. Никогда не работал на WPF, по координатам получится криво, уже пробовал, что можно еще сделать? Нужно обработать клик по области, ну и при наведении мыши на область подсветку границы области.

private void Clicked(object sender, MouseButtonEventArgs e) { //string pos = "X - " + e.GetPosition(this).X + " Y - " + e.GetPosition(this).Y; //MessageBox.Show(pos); //if (e.GetPosition(this).X >= 232 && e.GetPosition(this).X <= 566 && //e.GetPosition(this).Y >= 27 && e.GetPosition(this).Y <= 147) //MessageBox.Show(e.Source.ToString()); }
все что у меня есть


Ответ

Этого можно добиться, хотя и не совсем просто.
Для начала, вам нужно получить картинки каждой из областей. Обратитесь за этим к вашему граф. дизайнеру. На картинке должна быть только область, а остальное обязано быть транспарентным.
Теперь, нам нужно определить клик на нетранспарентной области. Для этого проще всего использовать специализированный контрол, и переопределить hit testing. Тогда мы сможем воспользоваться встроенными в WPF процедурами.
Наследуемся от Image
public class OpaqueClickableImage : Image { static int transparentAlpha = 128;
protected override HitTestResult HitTestCore(PointHitTestParameters hitTestParameters) { if (Source == null) return null; var source = Source as BitmapSource; if (source == null) throw new NotSupportedException("Need BitmapSource"); if (source.Format != PixelFormats.Bgra32) throw new NotSupportedException("Need 32-bit pixel format with alpha channel");
// Get the pixel of the source that was hit var x = (int)(hitTestParameters.HitPoint.X / ActualWidth * source.PixelWidth); var y = (int)(hitTestParameters.HitPoint.Y / ActualHeight * source.PixelHeight);
var pixel = new byte[4]; source.CopyPixels(new Int32Rect(x, y, 1, 1), pixel, 4, 0);
if (pixel[3] < transparentAlpha) return null;
return new PointHitTestResult(this, hitTestParameters.HitPoint); } }
(Код украден с благодарностью украден здесь.)
Отлично, попробуем использовать. На клик навесим наш обработчик, а на IsMouseOver добавим glow-эффект через стиль.

(Я специально нарисовал картинку с сердечком, можно использовать на 8-ое марта.)
Результат (на второй анимации для примера несколько одинаковых картинок рядом):

понедельник, 26 ноября 2018 г.

Какой тег лучше использовать что бы добавить SVG изображение?

Object:

Embed:

iframe:

IMG:

background-image:
#image { background-image: url(image.svg); }


Ответ

Лучший тег для svg - это svg! Потому что только так вы в дальнейшем сможете им манипулировать. А вообще все зависит от целей, если просто показать картинку - img, если фоном пустить - то используйте background-image.