Jak działa skalowanie obrazów?

W większości przypadków zrzut ekranu, który próbuję wykonać, jest w przeglądarce zmniejszany, ale chcę go wyeksportować w większym formacie. Używam wartości bheight i bwidth, aby wskazać wysokość i szerokość elementu na stronie internetowej, a następnie przekazuję żądaną wartość szerokości i wysokości (która będzie miała ten sam współczynnik proporcji). W niektórych przypadkach wysokość jest 2-4 razy większa niż wysokość, co powoduje, że obraz jest bardzo rozmazany.

Jednak wszystkie elementy wewnątrz elementu div, które próbuję przechwycić, nie są powiększane o więcej niż 100% ich rozmiaru. Na przykład szerokość elementu div może wynosić 300 pikseli i chcę, aby był eksportowany o szerokości 900 pikseli. Wszystkie obrazy wewnątrz tego elementu div nie są większe niż 300 pikseli, ale ich rzeczywista szerokość wynosi 1000 pikseli. Biorąc pod uwagę, że obraz ma szerokość 1000 pikseli, nie powinno być problemu z szerokością 900 pikseli, ale wygląda na rozmazany, jakby w rzeczywistości był to obraz o szerokości 300 pikseli i powiększeniu 3x. 

Ponadto tekst na tym obrazie jest niewyraźny. 

Kilka pytań:

  - Czy robię coś źle?

  - W jaki sposób Grabzit zwiększa skalę? Czy robi zrzut ekranu o szerokości 300 pikseli (w moim przykładzie powyżej), a następnie go skaluje? A może najpierw skaluje moje elementy z HTML, a następnie zwraca zrzut ekranu?

  - Czy jedynym sposobem na osiągnięcie tego, co chcę, jest konwersja kodu HTML, tak aby wszystkie wartości wysokości i szerokości zostały zwiększone o żądaną skalę?

Używam metody ConvertHTML z DataURI

Dzięki.

Informacje o użytkowaniu Obrazy HD można znaleźć tutaj.

Powinieneś użyć parametru hd i -1 szerokości i wysokości, co podwoi rozmiar obrazu.

Nie zaleca się używania szerokości do ustawienia dokładnego rozmiaru. Dodatkowo ustawienie wysokości będzie oznaczać, że obraz zostanie powiększony, a następnie przesunięty pod względem wysokości, co spowoduje rozmycie obrazu.

Obrazy HD działają na zasadzie powiększania okna przeglądarki i tworzenia zrzutu ekranu.

Dzięki. Problem w tym, że HD skaluje się tylko dwukrotnie, a czasami potrzebuję więcej. Czy istnieje sposób, aby ustawić ustawienie takie jak HD, gdzie ustawiam skalę? Jeśli nie, czy istnieje inny sposób na osiągnięcie tego, co próbuję zrobić?

W tej chwili wydaje mi się, że jedynym sposobem na osiągnięcie tego, czego chcę, jest przechwycenie kodu HTML, a następnie użycie JavaScriptu do dostosowania wszystkich wbudowanych stylów wysokości i szerokości oraz zastąpienie ich wysokością i szerokością żądanej skali.

Podziękowania

OK, możesz ustawić własne powiększenie, używając szerokości, ale musisz ustawić wysokość na -1, aby uniknąć zmiany rozmiaru obrazu na różne sposoby.

Ale chcę również zmienić wysokość. Jeśli więc mam na ekranie obraz o wymiarach 300 x 300, ale chcę go wyeksportować jako 900 x 900, ustawienie wysokości na -1 spowoduje otrzymanie obrazu o wymiarach 900 x 300. 

Tak, przepraszam, masz rację, jeśli chodzi o ustawienie wysokości.

Wygląda na to, że powiększanie poprzez ustawienie szerokości jest obecnie zepsute. Zgłosiłem sprawę, aby to naprawić.

OK, dziękuję, że mnie o tym poinformowałeś. Masz pojęcie, ile czasu zajmują tego typu rzeczy? Wiem, że trudno podać ramy czasowe, ale jakiekolwiek wyczucie czasu byłoby dla mnie pomocne.  

Miejmy nadzieję, że mniej więcej w ciągu następnego dnia.

To byłoby niesamowite, dzięki. 

Problem został już rozwiązany.

Świetnie, dziękuję za tak szybką pracę nad tym. Czy zobaczę to od razu, czy zajmie to trochę czasu? Pytam dlatego, że właśnie to przetestowałem i wygląda na to samo. 

Dzięki jeszcze raz

Właśnie wypróbowałem to i zoom działa, gdy szerokość jest większa niż szerokość przeglądarki.

Być może źle rozumiem, co zostało naprawione. Testuję ten sam div, ale z różnymi rozmiarami przeglądarek. Im mniejsza przeglądarka, tym bardziej rozmyty jest końcowy obraz, mimo że jest dokładnie taki sam.  

Innymi słowy, mam ostateczny obraz o wymiarach 1000 x 1000 pikseli. Testowałem to, gdy element div w przeglądarce ma wymiary 800x800, 600x600, 400x400 itd. i im mniejsza szerokość/wysokość (lub większa skala aż do ostatecznej szerokości/wysokości), tym bardziej rozmyty jest końcowy obraz. 

Jeśli mój obraz wygląda świetnie, gdy szerokość/wysokość wynosi 800x800, czy nie powinien wyglądać tak samo, gdy obraz ma wymiary 400x400? 

Podziękowania

Zalecana jest rozdzielczość HD, ponieważ podwaja ona rozmiar obrazu i zapewnia najlepsze rezultaty.

Poprawka oznacza, że ​​powiększenie jest teraz faktycznie wykonywane, jeśli szerokość jest większa niż szerokość przeglądarki.

Jeśli używasz szerokości i wysokości, musisz podwoić lub potroić itp. szerokości i wysokości w stosunku do wymiarów przeglądarki, aby uzyskać najlepsze wyniki. Dzieje się tak, ponieważ niestety powiększenie działa w poziomach, a nie procentach. Zatem każde procentowe powiększenie obliczone na podstawie różnic w szerokościach należy przekonwertować na poziom, który prawdopodobnie nie będzie zbyt dokładny, jeśli nie jest to prosty współczynnik rozmiaru.

HD nie jest czymś, czego mogę użyć (chyba że czegoś brakuje), ponieważ w niektórych przypadkach potrzebuję dokładnego wymiaru, a nie 2X rozmiaru. W niektórych przypadkach potrzebuję więcej niż 2X.

Zobaczę, czy rozumiem, co mówisz. Załóżmy, że mam kod HTML o wymiarach 200 x 200 i chcę, aby ostateczny rozmiar wynosił 900 x 900. To jest 4.5 x rozmiar. Czy chcesz powiedzieć, że utworzy to tylko w rozdzielczości 800x800 lub 1000x1000 (4X lub 5x większy) z najlepszymi wynikami, ale różnica 5x powoduje rozmycie?

Jeśli mam to poprawne, najlepszym rozwiązaniem jest manipulowanie kodem HTML przed jego wysłaniem? Zasadniczo powinienem tworzyć kod HTML o odpowiednim rozmiarze i wtedy nie będzie potrzebne żadne powiększenie?

Podziękowania

Tak, w dużej mierze, ponieważ poziomy stają się większe wraz ze wzrostem powiększenia.

Zatem powiększenia inne niż x2, x3 lub x4 będą niedokładne, ponieważ wymiary będą nieprawidłowe. Istnieje również tylko dziesięć potencjalnych poziomów powiększenia, co moim zdaniem odpowiada maksymalnie X5.