タグ付けされた質問 「image-resizing」

18
HTML5キャンバスでの画像のサイズ変更
javascriptとcanvas要素を使用してクライアント側でサムネイル画像を作成しようとしていますが、画像を縮小するとひどく見えます。リサンプリングがバイキュービックではなく「ニアレストネイバー」に設定されているため、フォトショップで縮小されたように見えます。このサイトを正しく表示することは可能です。はキャンバスを使用しても問題なく実行できるすることは可能です。「[Source]」リンクに示されているのと同じコードを使用してみましたが、それでもひどいようです。私が見逃しているもの、設定する必要のある設定などはありますか? 編集: jpgのサイズを変更しようとしています。リンク先のサイトとフォトショップで同じjpgのサイズを変更してみましたが、サイズを小さくすると問題ありません。 関連するコードは次のとおりです。 reader.onloadend = function(e) { var img = new Image(); var ctx = canvas.getContext("2d"); var canvasCopy = document.createElement("canvas"); var copyContext = canvasCopy.getContext("2d"); img.onload = function() { var ratio = 1; if(img.width > maxWidth) ratio = maxWidth / img.width; else if(img.height > maxHeight) ratio = maxHeight / img.height; …

19
レスポンシブCSSの背景画像
私はウェブサイト(g-floors.eu)を持っていて、背景(cssではコンテンツのbg-imageを定義しました)も反応させたいです。残念ながら、私が考えることができる1つのことを除いて、これを行う方法についてはまったくわかりませんが、これはかなりの回避策です。複数の画像を作成し、CSS画面サイズを使用して画像を変更しますが、これを実現するためのより実用的な方法があるかどうか知りたいです。 基本的に私が達成したいのは、画像(ウォーターマーク 'G'付き)が自動的にサイズ変更され、表示される画像が少なくなることです。もちろん可能なら リンク:g-floors.eu これまでに持っているコード(コンテンツ部分) #content { background-image: url('../images/bg.png'); background-repeat: no-repeat; position: relative; width: 85%; height: 610px; margin-left: auto; margin-right: auto; }

2
ピカソで画像を全幅と固定高にサイズ変更
ImageViewピカソを使用して読み込まれたアイテムの1つである垂直のLinearLayoutがあります。画像の幅をデバイス全体の幅まで上げ、画像の中央部分を固定された高さ(150dp)でトリミングして表示する必要があります。私は現在次のコードを持っています: Picasso.with(getActivity()) .load(imageUrl) .placeholder(R.drawable.placeholder) .error(R.drawable.error) .resize(screenWidth, imageHeight) .centerInside() .into(imageView); 私はどちらの値をに入れなければならないscreenWidthとimageHeight(= 150DP型)?

7
Googleマップのマーカーアイコン画像のサイズ変更
マーカーのアイコンプロパティに画像を読み込むと、元のサイズで表示されます。これは本来のサイズよりもはるかに大きくなります。 標準よりも小さいサイズに変更したい。これを行う最良の方法は何ですか? コード: function addMyPos(latitude,longitude){ position = new google.maps.LatLng(latitude,longitude) marker = new google.maps.Marker({ position: position, map: map, icon: "../res/sit_marron.png" }); }

13
PHPで画像のサイズを変更する
フォームを介してアップロードした画像を自動的に147x147pxにサイズ変更するPHPコードを書きたいのですが、どうすればよいかわかりません(私は比較的PHPの初心者です)。 これまでのところ、画像は正常にアップロードされ、ファイルタイプは認識され、名前は整理されていますが、サイズ変更機能をコードに追加したいと思います。たとえば、2.3MB、1331x1331のサイズのテスト画像があり、コードでサイズを小さくしたいと思います。画像のファイルサイズも大幅に圧縮されると思います。 これまでのところ、私は次のものを持っています: if ($_FILES) { //Put file properties into variables $file_name = $_FILES['profile-image']['name']; $file_size = $_FILES['profile-image']['size']; $file_tmp_name = $_FILES['profile-image']['tmp_name']; //Determine filetype switch ($_FILES['profile-image']['type']) { case 'image/jpeg': $ext = "jpg"; break; case 'image/png': $ext = "png"; break; default: $ext = ''; break; } if ($ext) { //Check filesize if ($file_size …

14
EC2はサイズを増やした後にボリュームのサイズを変更できません
EC2ボリュームのサイズ変更の手順に従いました インスタンスを停止しました 現在のボリュームのスナップショットを取った 以前のスナップショットから、同じリージョンでサイズの大きい新しいボリュームを作成しました インスタンスから古いボリュームを切り離しました 同じマウントポイントでインスタンスに新しいボリュームを接続しました 古いボリュームは5GBで、私が作成したボリュームは100GBですが、インスタンスを再起動して実行すると、df -h Iこれが表示されます Filesystem Size Used Avail Use% Mounted on /dev/xvde1 4.7G 3.5G 1021M 78% / tmpfs 296M 0 296M 0% /dev/shm これは私が走っているときに得られるものです sudo resize2fs /dev/xvde1 The filesystem is already 1247037 blocks long. Nothing to do! 私が走れば私cat /proc/partitionsは見る 202 64 104857600 xvde 202 65 …

12
Node.js:ImageMagickを使用しない画像のサイズ変更
Node.js(+ Express 4)で、ユーザーがプロフィール画像をサーバーにアップロードして設定できるWebアプリを開発しています。ファイルのmimetypeと最大ファイルサイズはすでに制限されているため、ユーザーは200KBを超えるpngまたはjpeg画像をアップロードできません。 問題は、アップロードされた画像の解像度を200x200にサイズ変更(サーバーサイド)して、ページの読み込みを改善し、ディスク上のスペースを節約したいということです。いくつかの調査の後、すべての回答は、ImageMagickまたはGraphicsMagickに基づくモジュールの使用を示していました。 ただし、単純な画像のサイズ変更を行うためにImageMagick / GraphicsMagickをインストールする必要があるのは、私にはやり過ぎに思えます。それで、Node.jsに対してこれ以外の解決策はありますか? 編集:以前のソリューション(lwip)が維持されなくなったため、受け入れられたソリューションをシャープに変更しました。すべてのフィードバックをありがとう!

6
CSSで画像の最大幅を設定する方法
私のウェブサイトでは、ユーザーがアップロードした画像を特定のサイズ(width: 600px)の新しいウィンドウに表示したいと思います。問題は、画像が大きくなる可能性があることです。したがって、これらよりも大きい場合は600px、アスペクト比を維持したままサイズを変更したいと思います。 max-widthCSSプロパティを試しましたが、機能しません。画像のサイズは変更されません。 この問題を解決する方法はありますか? HTML: <div id="ImageContainerr"> <img src="DisplayImage.do?ad_id=${requestScope.advert.id}" class="Image" /> </div> CSS: img.Image { max-width: 100%;} div#ImageContainer { width: 600px; } max-width: 600px画像の設定も試みましたが、うまくいきません。画像はサーブレットからストリーミングされます(Tomcatのwebappsフォルダーの外部に保存されます)。
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.