Search Results

Search found 167 results on 7 pages for 'rgba'.

Page 6/7 | < Previous Page | 2 3 4 5 6 7  | Next Page >

  • Why is my Python OpenGL render2DTexture function so slow?

    - by Barakat
    SOLVED: The problem was actually using time.time() every CPU cycle to see whether the next frame should be drawn or not. The time it takes to execute time.time() was having an impact on the FPS. I made this function for drawing 2D textures as images in a 2D view in my OpenGL application. After doing some testing I found that it takes up 1-2 fps per texture. I know I am probably doing something wrong in this code. Any ideas? I am limiting the FPS to 60. Edit: When I disable the texture rendering it adds about 15% fps back. When I disabled text rendering it adds about 15% fps back. When i disable both barely any fps is consumed anymore. IE: 20 out of 60 fps with both on. 30 out of 60 when one is disabled. 58 out of 60 when both are disabled. When rendering the text on a button ( the control I'm using to test this ), it only "prepares" the text when the button label is set. Updated code, still running at the same speed but still works the same: def render2DTexture( self, texture, rect, texrect ): glEnable( GL_TEXTURE_2D ) glBindTexture( GL_TEXTURE_2D, texture ) glBegin( GL_QUADS ) glTexCoord2f( texrect.left, texrect.bottom ) glVertex2i( rect.left, self.windowSize[1] - rect.top ) glTexCoord2f( texrect.right, texrect.bottom ) glVertex2i( rect.left + rect.right, self.windowSize[1] - rect.top ) glTexCoord2f( texrect.right, texrect.top ) glVertex2i( rect.left + rect.right, self.windowSize[1] - ( rect.top + rect.bottom ) ) glTexCoord2f( texrect.left, texrect.top ) glVertex2i( rect.left, self.windowSize[1] - ( rect.top + rect.bottom ) ) glEnd() glDisable( GL_TEXTURE_2D ) def prepareText( self, text, fontFace, color ): self.loadFont( fontFace ) bmp = self.fonts[ fontFace ].render( text, 1, color ) return ( pygame.image.tostring( bmp, 'RGBA', 1 ), bmp.get_width(), bmp.get_height() ) def renderText( self, pText, position ): glRasterPos2i( position[0], self.windowSize[1] - ( position[1] + pText[2] ) ) glDrawPixels( pText[1], pText[2], GL_RGBA, GL_UNSIGNED_BYTE, pText[0] )

    Read the article

  • "image contains error", trying to create and display images using google app engine

    - by bert
    Hello all the general idea is to create a galaxy-like map. I run into problems when I try to display a generated image. I used Python Image library to create the image and store it in the datastore. when i try to load the image i get no error on the log console and no image on the browser. when i copy/paste the image link (including datastore key) i get a black screen and the following message: The image “view-source:/localhost:8080/img?img_id=ag5kZXZ-c3BhY2VzaW0xMnINCxIHTWFpbk1hcBgeDA” cannot be displayed because it contains errors. the firefox error console: Error: Image corrupt or truncated: /localhost:8080/img?img_id=ag5kZXZ-c3BhY2VzaW0xMnINCxIHTWFpbk1hcBgeDA import cgi import datetime import urllib import webapp2 import jinja2 import os import math import sys from google.appengine.ext import db from google.appengine.api import users from PIL import Image #SNIP #class to define the map entity class MainMap(db.Model): defaultmap = db.BlobProperty(default=None) #SNIP class Generator(webapp2.RequestHandler): def post(self): #SNIP test = Image.new("RGBA",(100, 100)) dMap=MainMap() dMap.defaultmap = db.Blob(str(test)) dMap.put() #SNIP result = db.GqlQuery("SELECT * FROM MainMap LIMIT 1").fetch(1) if result: print"item found<br>" #debug info if result[0].defaultmap: print"defaultmap found<br>" #debug info string = "<div><img src='/img?img_id=" + str(result[0].key()) + "' width='100' height='100'></img>" print string else: print"nothing found<br>" else: self.redirect('/?=error') self.redirect('/') class Image_load(webapp2.RequestHandler): def get(self): self.response.out.write("started Image load") defaultmap = db.get(self.request.get("img_id")) if defaultmap.defaultmap: try: self.response.headers['Content-Type'] = "image/png" self.response.out.write(defaultmap.defaultmap) self.response.out.write("Image found") except: print "Unexpected error:", sys.exc_info()[0] else: self.response.out.write("No image") #SNIP app = webapp2.WSGIApplication([('/', MainPage), ('/generator', Generator), ('/img', Image_load)], debug=True) the browser shows the "item found" and "defaultmap found" strings and a broken imagelink the exception handling does not catch any errors Thanks for your help Regards Bert

    Read the article

  • gl_FragColor and glReadPixels

    - by chun0216
    I am still trying to read pixels from fragment shader and I have some questions. I know that gl_FragColor returns with vec4 meaning RGBA, 4 channels. After that, I am using glReadPixels to read FBO and write it in data GLubyte *pixels = new GLubyte[640*480*4]; glReadPixels(0, 0, 640,480, GL_RGBA, GL_UNSIGNED_BYTE, pixels); This works fine but it really has speed issue. Instead of this, I want to just read RGB so ignore alpha channels. I tried: GLubyte *pixels = new GLubyte[640*480*3]; glReadPixels(0, 0, 640,480, GL_RGB, GL_UNSIGNED_BYTE, pixels); instead and this didn't work though. I guess it's because gl_FragColor returns 4 channels and maybe I should do something before this? Actually, since my returned image (gl_FragColor) is grayscale, I did something like float gray = 0.5 //or some other values gl_FragColor = vec4(gray,gray,gray,1.0); So is there any efficient way to use glReadPixels instead of using the first 4 channels method? Any suggestion? By the way, this is on opengl es 2.0 code.

    Read the article

  • Why pseudo-elements :before and :after appear in front of my DIV element and not behind?

    - by Dim13i
    I have a DIV element with this given class: .slideshow { background: white; width: 700px; height: 300px; padding:10px; margin: 0 auto; position: relative; box-shadow: 0px 0px 5px grey, 0px 10px 20px rgba(0,0,0,.1) inset; } I define those two pseudo-elements (:before and :after): .slideshow:before, .slideshow:after { content: " "; background: green; width: 50%; height: 50%; position: absolute; z-index: -10; } My problem is that those two pseudo-elements appear in front of my DIV and not behind. Is there any specific reason for this behaviour? Here is an example: EXAMPLE The Javascript part is a bit messy but i'm still working on it. Also I've noticed that if I delete all the JS part I don't have anymore this problem, but I don't think there is anything in the code that should modify the slideshow DIV SOLVED: The problem is in the javascript part where I have: $('.slideshow').css('-webkit-transform', 'rotate(0deg)'); Removing this line solved the problem. I guess that pseudo-elements :before and :after are not compatible with the property transform.

    Read the article

  • CSS Drop Down Menu

    - by cvandal
    I'm trying to make a simple CSS drop down menu that when you mouse over a link, the sub menu appears. I've managed to achieve this when you mouse over an li but can't figure out how to do it using a link. The reason why I'm trying to do this using a link rather than the li is that my menu width is 100% and the li spans a greater area than the link so if you mouse over that area, the sub menu appears when you don't want it to. My CSS is as follows: .menu { border: solid 1px red; font-size: 5em; font-family: 'Raleway', arial, serif; } .menu ul { } .menu ul.children { display: none; } .menu ul li { margin: 20px 0 10px 0; } .menu ul li:hover ul.children { display: block; position: absolute; } .menu ul li a { padding: 10px 10px 0 40px; background: rgba(0,0,0,0.5); color: #fff; text-decoration: none; }

    Read the article

  • Absolute Centering Not Working in IE

    - by Vikas Ghodke
    I have a div which is centered in parent div, it working on all browser but not in ie, can you help me out with this. JSFIDDLE span.qbg3 { display: block; text-align: center; background: url(http://powerblanket.com/may2014/wp-content/uploads/2014/05/qbg3.png) no-repeat center center; background-size:cover; padding: 50px 20px; color: #fff; font-weight: 400; font-size: 30px; position: relative; margin-top: -20px; min-height: 350px; } span.inqbg3 { max-height: 100px; display: block; text-align: center; color: #fff; font-weight: 400; font-size: 40px; position: absolute; margin: auto; top: 0px; right: 0; left: 0; bottom: 0px; background: rgba(0, 0, 0, 0.5); max-width: 700px; padding: 35px 0; } span.inqbg3 a { color: #fff; }

    Read the article

  • Child elements changing opacity with parent Image

    - by mitch
    I have a <div> element which has a background image. On top of that I have some text that is hidden but when the user hovers over the <div> element that text will show and the <div> opacity will lower. My problem is when you hover over the div all elements inside that change opacity as well. I have looked through stackoverflow to see if anyone has the same problem but all i found were answers that had RGBA using background colors (not images). Here is my css: .pic{ background-image:url(http://www.granitesportsinstitute.com/wp-content/uploads/2014/06/Green-Sea-Turtle-150x150.jpg); -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .textstuff{ visibility:hidden; } .pic:hover .textstuff{ visibility:visible; color:black; } .pic:hover{ filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3; } HTML HERE: <div class="pic" style="height:150px;width:150px;"> <div class="textstuff">this is text</div> </div>

    Read the article

  • Locking a GDI+ Bitmap in Native C++?

    - by user146780
    I can find many examples on how to do this in managed c++ but none for unmanaged. I want to get all the pixel data as efficiently as possible, but some of the scan0 stuff I would need more info about so I can properly iterate through the pixel data and get each rgba value from it. right now I have this: Bitmap *b = new Bitmap(filename); if(b == NULL) { return 0; } UINT w,h; w = b->GetWidth(); h = b->GetHeight(); Rect *r = new Rect(0,0,w,h); BitmapData *lockdat; b->LockBits(r,ImageLockModeRead,PixelFormatDontCare,lockdat); delete(r); if(w == 0 && h == 0) { return 0; } Color c; std::vector<GLubyte> pdata(w * h * 4,0.0); for (unsigned int i = 0; i < h; i++) { for (unsigned int j = 0; j < w; j++) { b->GetPixel(j,i,&c); pdata[i * 4 * w + j * 4 + 0] = (GLubyte) c.GetR(); pdata[i * 4 * w + j * 4 + 1] = (GLubyte) c.GetG(); pdata[i * 4 * w + j * 4 + 2] = (GLubyte) c.GetB(); pdata[i * 4 * w + j * 4 + 3] = (GLubyte) c.GetA(); } } delete(b); return CreateTexture(pdata,w,h); How do I use lockdat to do the equivalent of getpixel? Thanks

    Read the article

  • SetMatrix() does not copy all values to HLSL

    - by Tili
    Hi, I want to use the contents of a vector of D3DXMatrices to my shader. m_pLightMatrices->SetMatrixArray(&currentLightMatrices[0].m[0][0],0,numLights); As we know the internals of a vector this poses no problems (as it is just a dynamic array). Now when I access this matrix in hlsl to fill up a struct I get this strange behavior: struct LightTest { float3 LightPos; float LightRange; float4 LightDiffuse; float3 LightAtt; }; float4x4 currentLight = gLights[0]; LightTest lt; lt.LightPos = currentLight._m00_m01_m02; //{0,0,0} lt.LightDiffuse = currentLight[1].rgba; //{0,0,0,0} lt.LightRange = currentLight._m03; //this gives me a value lt.LightAtt = currentLight[2].xyz; //{0,0,0} While debugging I see that my matrix is nicely filled with the variables I want. When I try to hardcode check what is in the struct I get all zero's, except the LightRange. As you can see I tried different methods of accessing the float4x4 but without any other results. Why oh why is hlsl not copying all my variables ?

    Read the article

  • How Are These Styles Cascading?

    - by user1569275
    Problem is viewable at this link. http://dansdemos.info/prototypes/htmlSamples/responsive/step08_megaGridForward.html The three boxes need to have green backgrounds, but another style is taking precedence. I thought styles were supposed to take precedence based on where they appear in the style sheets, with styles lower in the style sheet cascading (taking precedence) over styles higher in the style sheet. I guess that is wrong, because the style sheet for the background colors of those boxes is here: #maincontent .col { background: #ccc; background: rgba(204, 204, 204, 0.85); } #callout1 { background-color: #00B300; text-align:center; } #callout2 { background-color: #00CC00; text-align:center; } #callout3 { background-color: #00E600; text-align:center; } When the style for "#maincontent .col" is removed, the green shows up (link)http://dansdemos.info/prototypes/htmlSamples/responsive/step08_megaGridForwardGreen.html, but I thought the green should show up because it is after the gray color specified higher up. I am finding a way to get what I need, but it would really make it a lot easier if I understood why the backgrounds are gray, instead of green. Any assistance would be extremely much appreciated. Thank you.

    Read the article

  • Blit SDL_Surface onto another SDL_Surface and apply a colorkey

    - by NordCoder
    I want to load an SDL_Surface into an OpenGL texture with padding (so that NPOT-POT) and apply a color key on the surface afterwards. I either end up colorkeying all pixels, regardless of their color, or not colorkey anything at all. I have tried a lot of different things, but none of them seem to work. Here's the working snippet of my code. I use a custom color class for the colorkey (range [0-1]): // Create an empty surface with the same settings as the original image SDL_Surface* paddedImage = SDL_CreateRGBSurface(image->flags, width, height, image->format->BitsPerPixel, #if SDL_BYTEORDER == SDL_BIG_ENDIAN 0xff000000, 0x00ff0000, 0x0000ff00, 0x000000ff #else 0x000000ff, 0x0000ff00, 0x00ff0000, 0xff000000 #endif ); // Map RGBA color to pixel format value Uint32 colorKeyPixelFormat = SDL_MapRGBA(paddedImage->format, static_cast<Uint8>(colorKey.R * 255), static_cast<Uint8>(colorKey.G * 255), static_cast<Uint8>(colorKey.B * 255), static_cast<Uint8>(colorKey.A * 255)); SDL_FillRect(paddedImage, NULL, colorKeyPixelFormat); // Blit the image onto the padded image SDL_BlitSurface(image, NULL, paddedImage, NULL); SDL_SetColorKey(paddedImage, SDL_SRCCOLORKEY, colorKeyPixelFormat); Afterwards, I generate an OpenGL texture from paddedImage using similar code to the SDL+OpenGL texture loading code found online (I'll post if necessary). This code works if I just want the texture with or without padding, and is likely not the problem. I realize that I set all pixels in paddedImage to have alpha zero which causes the first problem I mentioned, but I can't seem to figure out how to do this. Should I just loop over the pixels and set the appropriate colors to have alpha zero?

    Read the article

  • How can I fix Problems with interlaced video jerking/flicking when playedback on DVD players? (Mixin

    - by Simon P Stevens
    I'm trying to make a DVD and the final DVD jerks when played on standalone DVD players. It seems to play fine on PCs. I think the problem may be to do with interlacing settings when rendering the final output, but I'll outline the whole editing process I have followed in case I've made a mistake somewhere else. Most of the footage comes from a sony handy cam (one of those mini DVD ones) so isn't great quality. It was set to "high quality" (haha) and 16:9 aspect ratio when it was recorded. I copy the files directly from the mini DVDs onto the hard drive and import them into Cinelerra. In Cinelerra I set the format to 25fps, 720x576, RGBA-8bit, 16:9, interlaced bottom fields first. When I've finished the editing, I add a Fields to frames effect (set to bottom first) to each video track. I render to audio and video separately: Audio: AC3, 128kbps Video: YUV4MPEG steam, video pipe settings: ffmpeg -f yuv4mpegpipe -i - -y -target dvd -flags +ilme+ildct mpeg2video % Cinelerra often crashes during the rendering, so I set it to generate a new video file at each label, and combine them using cat when I've got a sucesful render of each one. Once I've combined them, I use mencoder to re-index them: mencoder -forceidx -oac copy -ovc copy merged.m2v -o mergedReIndexed.m2v I combine the audio and video files using ffmpeg: ffmpeg -i AudioFile.ac3 -i VideoFile.m2v -target dvd -flags +ilme+ildct FinalMovie.mpg Then I build the menus with spumux and I create the DVD file system with dvdauthor, and finally I write it do a dvd-r like this: nice -n -20 growisofs -dvd-compat -speed=2 -Z /dev/dvd -dvd-video -V VIDEO ./ && eject /dev/dvd Originally, when I did it the DVD flickered badly, so as suggested in a guide I added the fields to frames effect in cinelerra. Now it doesn't "flicker", but has become "jerky" when there is lots of motion, particularly when the camera is moving, so the whole background moves. This is what I've tried so far: Removed "mpeg2video" from cinelerra video render pipe. Removed +ilme from render pipe. Removed +ildct from render pipe. Removed +ilme from render audio/video rejoin command. Removed +ildct from render audio/video rejoin command. Added -alt to render pipe. Added -alt to render audio/video rejoin command. Tried with and without the frames to fields effect in Cinelerra. and various combinations of the above. I've also tried this: change the Cinelerra fps to 50, use fields to frames (instead of frames to fields), render to an intermediate QTforlinux jpeg video stream, re-importing that back into Cinelerra, adding a frames to fields effect and then rendering that output as normal (@25fps), and I still have the same problem. Has anyone experienced this "jerking" playback before? Can anyone give any suggestions on how to fix it? (Like I say, it plays back fine on a PC, but not on any of the standalone players I've tried)

    Read the article

  • How to move a rectangle properly?

    - by bodycountPP
    I recently started to learn OpenGL. Right now I finished the first chapter of the "OpenGL SuperBible". There were two examples. The first had the complete code and showed how to draw a simple triangle. The second example is supposed to show how to move a rectangle using SpecialKeys. The only code provided for this example was the SpecialKeys method. I still tried to implement it but I had two problems. In the previous example I declared and instaciated vVerts in the SetupRC() method. Now as it is also used in the SpecialKeys() method, I moved the declaration and instantiation to the top of the code. Is this proper c++ practice? I copied the part where vertex positions are recalculated from the book, but I had to pick the vertices for the rectangle on my own. So now every time I press a key for the first time the rectangle's upper left vertex is moved to (-0,5:-0.5). This ok because of GLfloat blockX = vVerts[0]; //Upper left X GLfloat blockY = vVerts[7]; // Upper left Y But I also think that this is the reason why my rectangle is shifted in the beginning. After the first time a key was pressed everything works just fine. Here is my complete code I hope you can help me on those two points. GLBatch squareBatch; GLShaderManager shaderManager; //Load up a triangle GLfloat vVerts[] = {-0.5f,0.5f,0.0f, 0.5f,0.5f,0.0f, 0.5f,-0.5f,0.0f, -0.5f,-0.5f,0.0f}; //Window has changed size, or has just been created. //We need to use the window dimensions to set the viewport and the projection matrix. void ChangeSize(int w, int h) { glViewport(0,0,w,h); } //Called to draw the scene. void RenderScene(void) { //Clear the window with the current clearing color glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT|GL_STENCIL_BUFFER_BIT); GLfloat vRed[] = {1.0f,0.0f,0.0f,1.0f}; shaderManager.UseStockShader(GLT_SHADER_IDENTITY,vRed); squareBatch.Draw(); //perform the buffer swap to display the back buffer glutSwapBuffers(); } //This function does any needed initialization on the rendering context. //This is the first opportunity to do any OpenGL related Tasks. void SetupRC() { //Blue Background glClearColor(0.0f,0.0f,1.0f,1.0f); shaderManager.InitializeStockShaders(); squareBatch.Begin(GL_QUADS,4); squareBatch.CopyVertexData3f(vVerts); squareBatch.End(); } //Respond to arrow keys by moving the camera frame of reference void SpecialKeys(int key,int x,int y) { GLfloat stepSize = 0.025f; GLfloat blockSize = 0.5f; GLfloat blockX = vVerts[0]; //Upper left X GLfloat blockY = vVerts[7]; // Upper left Y if(key == GLUT_KEY_UP) { blockY += stepSize; } if(key == GLUT_KEY_DOWN){blockY -= stepSize;} if(key == GLUT_KEY_LEFT){blockX -= stepSize;} if(key == GLUT_KEY_RIGHT){blockX += stepSize;} //Recalculate vertex positions vVerts[0] = blockX; vVerts[1] = blockY - blockSize*2; vVerts[3] = blockX + blockSize * 2; vVerts[4] = blockY - blockSize *2; vVerts[6] = blockX+blockSize*2; vVerts[7] = blockY; vVerts[9] = blockX; vVerts[10] = blockY; squareBatch.CopyVertexData3f(vVerts); glutPostRedisplay(); } //Main entry point for GLUT based programs int main(int argc, char** argv) { //Sets the working directory. Not really needed gltSetWorkingDirectory(argv[0]); //Passes along the command-line parameters and initializes the GLUT library. glutInit(&argc,argv); //Tells the GLUT library what type of display mode to use, when creating the window. //Double buffered window, RGBA-Color mode,depth-buffer as part of our display, stencil buffer also available glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL); //Window size glutInitWindowSize(800,600); glutCreateWindow("MoveRect"); glutReshapeFunc(ChangeSize); glutDisplayFunc(RenderScene); glutSpecialFunc(SpecialKeys); //initialize GLEW library GLenum err = glewInit(); //Check that nothing goes wrong with the driver initialization before we try and do any rendering. if(GLEW_OK != err) { fprintf(stderr,"Glew Error: %s\n",glewGetErrorString); return 1; } SetupRC(); glutMainLoop(); return 0; }

    Read the article

  • UIImagePickerController, UIImage, Memory and More!

    - by Itay
    I've noticed that there are many questions about how to handle UIImage objects, especially in conjunction with UIImagePickerController and then displaying it in a view (usually a UIImageView). Here is a collection of common questions and their answers. Feel free to edit and add your own. I obviously learnt all this information from somewhere too. Various forum posts, StackOverflow answers and my own experimenting brought me to all these solutions. Credit goes to those who posted some sample code that I've since used and modified. I don't remember who you all are - but hats off to you! How Do I Select An Image From the User's Images or From the Camera? You use UIImagePickerController. The documentation for the class gives a decent overview of how one would use it, and can be found here. Basically, you create an instance of the class, which is a modal view controller, display it, and set yourself (or some class) to be the delegate. Then you'll get notified when a user selects some form of media (movie or image in 3.0 on the 3GS), and you can do whatever you want. My Delegate Was Called - How Do I Get The Media? The delegate method signature is the following: - (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info; You should put a breakpoint in the debugger to see what's in the dictionary, but you use that to extract the media. For example: UIImage* image = [info objectForKey:UIImagePickerControllerOriginalImage]; There are other keys that work as well, all in the documentation. OK, I Got The Image, But It Doesn't Have Any Geolocation Data. What gives? Unfortunately, Apple decided that we're not worthy of this information. When they load the data into the UIImage, they strip it of all the EXIF/Geolocation data. Can I Get To The Original File Representing This Image on the Disk? Nope. For security purposes, you only get the UIImage. How Can I Look At The Underlying Pixels of the UIImage? Since the UIImage is immutable, you can't look at the direct pixels. However, you can make a copy. The code to this looks something like this: UIImage* image = ...; // An image NSData* pixelData = (NSData*) CGDataProviderCopyData(CGImageGetDataProvider(image.CGImage)); unsigned char* pixelBytes = (unsigned char *)[pixelData bytes]; // Take away the red pixel, assuming 32-bit RGBA for(int i = 0; i < [pixelData length]; i += 4) { pixelBytes[i] = 0; // red pixelBytes[i+1] = pixelBytes[i+1]; // green pixelBytes[i+2] = pixelBytes[i+2]; // blue pixelBytes[i+3] = pixelBytes[i+3]; // alpha } However, note that CGDataProviderCopyData provides you with an "immutable" reference to the data - meaning you can't change it (and you may get a BAD_ACCESS error if you do). Look at the next question if you want to see how you can modify the pixels. How Do I Modify The Pixels of the UIImage? The UIImage is immutable, meaning you can't change it. Apple posted a great article on how to get a copy of the pixels and modify them, and rather than copy and paste it here, you should just go read the article. Once you have the bitmap context as they mention in the article, you can do something similar to this to get a new UIImage with the modified pixels: CGImageRef ref = CGBitmapContextCreateImage(bitmap); UIImage* newImage = [UIImage imageWithCGImage:ref]; Do remember to release your references though, otherwise you're going to be leaking quite a bit of memory. After I Select 3 Images From The Camera, I Run Out Of Memory. Help! You have to remember that even though on disk these images take up only a few hundred kilobytes at most, that's because they're compressed as a PNG or JPG. When they are loaded into the UIImage, they become uncompressed. A quick over-the-envelope calculation would be: width x height x 4 = bytes in memory That's assuming 32-bit pixels. If you have 16-bit pixels (some JPGs are stored as RGBA-5551), then you'd replace the 4 with a 2. Now, images taken with the camera are 1600 x 1200 pixels, so let's do the math: 1600 x 1200 x 4 = 7,680,000 bytes = ~8 MB 8 MB is a lot, especially when you have a limit of around 24 MB for your application. That's why you run out of memory. OK, I Understand Why I Have No Memory. What Do I Do? There is never any reason to display images at their full resolution. The iPhone has a screen of 480 x 320 pixels, so you're just wasting space. If you find yourself in this situation, ask yourself the following question: Do I need the full resolution image? If the answer is yes, then you should save it to disk for later use. If the answer is no, then read the next part. Once you've decided what to do with the full-resolution image, then you need to create a smaller image to use for displaying. Many times you might even want several sizes for your image: a thumbnail, a full-size one for displaying, and the original full-resolution image. OK, I'm Hooked. How Do I Resize the Image? Unfortunately, there is no defined way how to resize an image. Also, it's important to note that when you resize it, you'll get a new image - you're not modifying the old one. There are a couple of methods to do the resizing. I'll present them both here, and explain the pros and cons of each. Method 1: Using UIKit + (UIImage*)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize; { // Create a graphics image context UIGraphicsBeginImageContext(newSize); // Tell the old image to draw in this new context, with the desired // new size [image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)]; // Get the new image from the context UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext(); // End the context UIGraphicsEndImageContext(); // Return the new image. return newImage; } This method is very simple, and works great. It will also deal with the UIImageOrientation for you, meaning that you don't have to care whether the camera was sideways when the picture was taken. However, this method is not thread safe, and since thumbnailing is a relatively expensive operation (approximately ~2.5s on a 3G for a 1600 x 1200 pixel image), this is very much an operation you may want to do in the background, on a separate thread. Method 2: Using CoreGraphics + (UIImage*)imageWithImage:(UIImage*)sourceImage scaledToSize:(CGSize)newSize; { CGFloat targetWidth = targetSize.width; CGFloat targetHeight = targetSize.height; CGImageRef imageRef = [sourceImage CGImage]; CGBitmapInfo bitmapInfo = CGImageGetBitmapInfo(imageRef); CGColorSpaceRef colorSpaceInfo = CGImageGetColorSpace(imageRef); if (bitmapInfo == kCGImageAlphaNone) { bitmapInfo = kCGImageAlphaNoneSkipLast; } CGContextRef bitmap; if (sourceImage.imageOrientation == UIImageOrientationUp || sourceImage.imageOrientation == UIImageOrientationDown) { bitmap = CGBitmapContextCreate(NULL, targetWidth, targetHeight, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo); } else { bitmap = CGBitmapContextCreate(NULL, targetHeight, targetWidth, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo); } if (sourceImage.imageOrientation == UIImageOrientationLeft) { CGContextRotateCTM (bitmap, radians(90)); CGContextTranslateCTM (bitmap, 0, -targetHeight); } else if (sourceImage.imageOrientation == UIImageOrientationRight) { CGContextRotateCTM (bitmap, radians(-90)); CGContextTranslateCTM (bitmap, -targetWidth, 0); } else if (sourceImage.imageOrientation == UIImageOrientationUp) { // NOTHING } else if (sourceImage.imageOrientation == UIImageOrientationDown) { CGContextTranslateCTM (bitmap, targetWidth, targetHeight); CGContextRotateCTM (bitmap, radians(-180.)); } CGContextDrawImage(bitmap, CGRectMake(0, 0, targetWidth, targetHeight), imageRef); CGImageRef ref = CGBitmapContextCreateImage(bitmap); UIImage* newImage = [UIImage imageWithCGImage:ref]; CGContextRelease(bitmap); CGImageRelease(ref); return newImage; } The benefit of this method is that it is thread-safe, plus it takes care of all the small things (using correct color space and bitmap info, dealing with image orientation) that the UIKit version does. How Do I Resize and Maintain Aspect Ratio (like the AspectFill option)? It is very similar to the method above, and it looks like this: + (UIImage*)imageWithImage:(UIImage*)sourceImage scaledToSizeWithSameAspectRatio:(CGSize)targetSize; { CGSize imageSize = sourceImage.size; CGFloat width = imageSize.width; CGFloat height = imageSize.height; CGFloat targetWidth = targetSize.width; CGFloat targetHeight = targetSize.height; CGFloat scaleFactor = 0.0; CGFloat scaledWidth = targetWidth; CGFloat scaledHeight = targetHeight; CGPoint thumbnailPoint = CGPointMake(0.0,0.0); if (CGSizeEqualToSize(imageSize, targetSize) == NO) { CGFloat widthFactor = targetWidth / width; CGFloat heightFactor = targetHeight / height; if (widthFactor > heightFactor) { scaleFactor = widthFactor; // scale to fit height } else { scaleFactor = heightFactor; // scale to fit width } scaledWidth = width * scaleFactor; scaledHeight = height * scaleFactor; // center the image if (widthFactor > heightFactor) { thumbnailPoint.y = (targetHeight - scaledHeight) * 0.5; } else if (widthFactor < heightFactor) { thumbnailPoint.x = (targetWidth - scaledWidth) * 0.5; } } CGImageRef imageRef = [sourceImage CGImage]; CGBitmapInfo bitmapInfo = CGImageGetBitmapInfo(imageRef); CGColorSpaceRef colorSpaceInfo = CGImageGetColorSpace(imageRef); if (bitmapInfo == kCGImageAlphaNone) { bitmapInfo = kCGImageAlphaNoneSkipLast; } CGContextRef bitmap; if (sourceImage.imageOrientation == UIImageOrientationUp || sourceImage.imageOrientation == UIImageOrientationDown) { bitmap = CGBitmapContextCreate(NULL, targetWidth, targetHeight, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo); } else { bitmap = CGBitmapContextCreate(NULL, targetHeight, targetWidth, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo); } // In the right or left cases, we need to switch scaledWidth and scaledHeight, // and also the thumbnail point if (sourceImage.imageOrientation == UIImageOrientationLeft) { thumbnailPoint = CGPointMake(thumbnailPoint.y, thumbnailPoint.x); CGFloat oldScaledWidth = scaledWidth; scaledWidth = scaledHeight; scaledHeight = oldScaledWidth; CGContextRotateCTM (bitmap, radians(90)); CGContextTranslateCTM (bitmap, 0, -targetHeight); } else if (sourceImage.imageOrientation == UIImageOrientationRight) { thumbnailPoint = CGPointMake(thumbnailPoint.y, thumbnailPoint.x); CGFloat oldScaledWidth = scaledWidth; scaledWidth = scaledHeight; scaledHeight = oldScaledWidth; CGContextRotateCTM (bitmap, radians(-90)); CGContextTranslateCTM (bitmap, -targetWidth, 0); } else if (sourceImage.imageOrientation == UIImageOrientationUp) { // NOTHING } else if (sourceImage.imageOrientation == UIImageOrientationDown) { CGContextTranslateCTM (bitmap, targetWidth, targetHeight); CGContextRotateCTM (bitmap, radians(-180.)); } CGContextDrawImage(bitmap, CGRectMake(thumbnailPoint.x, thumbnailPoint.y, scaledWidth, scaledHeight), imageRef); CGImageRef ref = CGBitmapContextCreateImage(bitmap); UIImage* newImage = [UIImage imageWithCGImage:ref]; CGContextRelease(bitmap); CGImageRelease(ref); return newImage; } The method we employ here is to create a bitmap with the desired size, but draw an image that is actually larger, thus maintaining the aspect ratio. So We've Got Our Scaled Images - How Do I Save Them To Disk? This is pretty simple. Remember that we want to save a compressed version to disk, and not the uncompressed pixels. Apple provides two functions that help us with this (documentation is here): NSData* UIImagePNGRepresentation(UIImage *image); NSData* UIImageJPEGRepresentation (UIImage *image, CGFloat compressionQuality); And if you want to use them, you'd do something like: UIImage* myThumbnail = ...; // Get some image NSData* imageData = UIImagePNGRepresentation(myThumbnail); Now we're ready to save it to disk, which is the final step (say into the documents directory): // Give a name to the file NSString* imageName = @"MyImage.png"; // Now, we have to find the documents directory so we can save it // Note that you might want to save it elsewhere, like the cache directory, // or something similar. NSArray* paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES); NSString* documentsDirectory = [paths objectAtIndex:0]; // Now we get the full path to the file NSString* fullPathToFile = [documentsDirectory stringByAppendingPathComponent:imageName]; // and then we write it out [imageData writeToFile:fullPathToFile atomically:NO]; You would repeat this for every version of the image you have. How Do I Load These Images Back Into Memory? Just look at the various UIImage initialization methods, such as +imageWithContentsOfFile: in the Apple documentation.

    Read the article

  • CSS3 Gradients to reproduce an 'inner glow' effect from Illustrator with border-radius applied

    - by iamfriendly
    Hello all! First post on here so please be kind :) I am in the process of trying to get my head properly around CSS3 Gradients (specifically radial ones) and in doing so I think I've set myself a relatively tough challenge. In Adobe Illustrator I have created a 'button' style which can be seen here: http://bit.ly/aePPtV (jpg image). To create this image I created a rectangle with a background colour of rgb(63,64,63) or #3F403F, then 'stylized' it to have a 15px border radius. I then applied an 'inner glow' to it with a 25% opacity, 8px blur, white from the center. Finally, I applied a 3pt white stroke on it. (I'm telling you all of this in case you wished to reproduce it, if the image above isn't sufficient.) So, my question is thus: is it possible to recreate this 'button' using CSS without the need for an image? I am aware of the 'limitations' of Internet Explorer (and for the sake of this experiment, I couldn't give a monkeys). I am also aware of the small 'bug' in webkit which incorrectly renders an element with a background colour, border-radius and a border (with a different color to the background-color) - it lets the background color bleed through on the curved corners. My best attempt so far is fairly pathetic, but for reference here is the code: section#featured footer p a { color: rgb(255,255,255); text-shadow: 1px 1px 1px rgba(0,0,0,0.6); text-decoration: none; padding: 5px 10px; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border: 3px solid rgb(255,255,255); background: rgb(98,99,100); background: -moz-radial-gradient( 50% 50%, farthest-side, #626364, #545454 ); background: -webkit-gradient( radial, 50% 50%, 1px, 50% 50%, 5px, from(rgb(98,99,100)), to(rgb(84,84,84)) ); } Basically, terrible. Any hints or tips gratefully accepted and thank you very much in advance for them!

    Read the article

  • C# or C++ game: many 16 color images loaded into RAM. Efficient solution?

    - by user560639
    I am in the planning stages of creating a fighting game and am unsure how to handle one issue relating to memory. Background info: - Still debating whether to use C# (XNA) or C++. We do not want to commit to either until we have explored how to solve this problem in both languages. - Using a max of 256MB RAM would be great if possible. - Two characters will be present at a time, and these characters can only change between battles. There is time to load/free memory between battles, but the game needs to run at a constant 60 drawn frames per second during combat. Each frame is 16.67ms - The total number of images per character is in the low hundreds. Each image is roughly 200x400 pixels. Only one image from each character will be displayed at any given moment. Uncompressed, each image takes roughly 300kb from my calculations; upwards of 100MB for a whole character. This is pushing too close to the 256MB limit given that memory will be needed for some other resources as well. Since each image can be made with a total of 16 colors. Theoretically I should be able to use 1/8th the space if I can take advantage of this. I've looked around but haven't found any word of native support for paletted images. (Storing each pixel using fewer bits that each map to a 32-bit RGBa color) I was considering making my own file format with 4 bits per pixel (and some extra palette info), loading all the images of this new format into RAM before battle, and then when drawing any specific image, decompress only that image into a raw image so it can be rendered properly. I don't know if it's realistic to perform so many assignment operations (appx 200x400 for each character = 160k) each frame. It sounds very hacky to me. Does anyone have advice on whether my solution sounds reasonable, and if there is perhaps a better one available? Thanks so much! (I also attempted to use an image with only 1 channel, then use a shader to perform a series of if statements to translate various values into other colors. Unfortunately, there were too many lines of code for the shader. It is also rather hacky and does not scale well.)

    Read the article

  • imagick showing script url instead of image

    - by Raz
    Hi, currently i'm trying to use imagick to generate some images without saving them on the server and then outputting to the browser, my method of choice was image magic with the imagick extension for php. I read the documentation, and i'm sure the package is installed on my machine (windows xp, with xampp). the class is installed imagick module enabled imagick module version 2.0.0-alpha imagick classes Imagick, ImagickDraw, ImagickPixel, ImagickPixelIterator ImageMagick version ImageMagick 6.3.3 04/21/07 Q16 http://www.imagemagick.org ImageMagick release date 04/21/07 ImageMagick Number of supported formats: 164 ImageMagick Supported formats A, ART, AVI, AVS, B, BIE, BMP, BMP2, BMP3, C, CACHE, CAPTION, CIN, CIP, CLIP, CLIPBOARD, CMYK, CMYKA, CUR, CUT, DCM, DCX, DFONT, DPS, DPX, EMF, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, FAX, FITS, FRACTAL, FTS, G, G3, GIF, GIF87, GRADIENT, GRAY, HISTOGRAM, HTM, HTML, ICB, ICO, ICON, INFO, JBG, JBIG, JNG, JP2, JPC, JPEG, JPG, JPX, K, LABEL, M, M2V, MAP, MAT, MATTE, MIFF, MNG, MONO, MPC, MPEG, MPG, MSL, MSVG, MTV, MVG, NULL, O, OTB, OTF, PAL, PALM, PAM, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PFA, PFB, PGM, PGX, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG24, PNG32, PNG8, PNM, PPM, PREVIEW, PS, PS2, PS3, PSD, PTIF, PWP, R, RAS, RGB, RGBA, RGBO, RLA, RLE, SCR, SCT, SFW, SGI, SHTML, STEGANO, SUN, SVG, SVGZ, TEXT, TGA, THUMBNAIL, TIFF, TILE, TIM, TTC, TTF, TXT, UIL, UYVY, VDA, VICAR, VID, VIFF, VST, WBMP, WMF, WMFWIN32, WMZ, WPG, X, XBM, XC, XCF, XPM, XV, XWD, Y, YCbCr, YCbCrA, YUV this is from the phpinfo so i know i have it installed, the thing is when i try to generate an image and save it, it works flawlessly, but when i try to output the image directly, i get the script url as an image $draw = new ImagickDraw(); $draw->setFont('AnkeCalligraph.TTF'); $draw->setFontSize(52); $draw->annotation(110, 110, "Hello World!"); $draw->annotation(50, 220, "Hello World!"); $canvas = new Imagick('./pictures/test_live.PNG'); $canvas->drawImage($draw); $canvas->setImageFormat('png'); header("Content-Type: image/png"); echo $canvas; this is the code used. if i use writeimage, then the file on the server is created with no problems. does anyone have any ideas what i'm doing wrong ?

    Read the article

  • HLSL tex2d sampler seemingly returning incorrect values; why?

    - by BlueNovember
    Hello all, I have code that needs to render regions of my object differently depending on their location. I am trying to use a colour map to define these regions, then get a value (0-14) representing this region by sampling the texture. The problem is when I sample from my colour map, I get collisions. Ie, two regions with different colours in the colourmap get the same value returned from the sampler. I've tried various formats of my colour map. I set the colours for each region to be "5" apart in each case; Indexed colour RGB, RGBA: region 1 will have RGB 5,5,5. region 2 will have RGB 10,10,10 and so on. HSV Greyscale: region 1 will have HSV 0,0,5. region 2 will have HSV 0,0,10 and so on. The tex2D sampler returns a value [0..1]. To get the "region number" I multiply this by 100 and divide by 5, expecting a number [0..20]. (But currently only using 0-14) I am using Shader Model 2 and FX Composer. //Colour map texture gColourmapTexture < string ResourceName = "Globe_Colourmap_Regions_Greyscale.png"; string ResourceType = "2D"; >; sampler2D gColourmapSampler : register(s1) = sampler_state { Texture = <gColourmapTexture>; #if DIRECT3D_VERSION >= 0xa00 Filter = MIN_MAG_MIP_LINEAR; #else /* DIRECT3D_VERSION < 0xa00 */ MinFilter = Linear; MipFilter = Linear; MagFilter = Linear; #endif /* DIRECT3D_VERSION */ AddressU = Clamp; AddressV = Clamp; }; ... //Then later, in a method float region = tex2D(gColourmapSampler,In.UV).x; //at this point I do not think it matters which of xyz components I pick; even in HSV they're all the same for my image. region *= 100; //Now in range [0..100] region /= 5; //Now in range [0..20] float3 levels[21]; //*Code populating "levels" array with what is essentially colour information * levels[1] = ... levels[2] = ... //Chose which level this region has, by looking up its region number float3 Level = levels[region];

    Read the article

  • OpenGL suppresses exceptions in MFC dialog-based application

    - by Mikhail
    Hello. I have an MFC-driven dialog-based application created with MSVS2005. Here is my problem step by step. I have button on my dialog and corresponding click-handler with code like this: int* i = 0; *i = 3; I'm running debug version of program and when I click on the button, Visual Studio catches focus and alerts "Access violation writing location" exception, program cannot recover from the error and all I can do is to stop debugging. And this is the right behavior. Now I add some OpenGL initialization code in the OnInitDialog() method: HDC DC = GetDC(GetSafeHwnd()); static PIXELFORMATDESCRIPTOR pfd = { sizeof(PIXELFORMATDESCRIPTOR), // size of this pfd 1, // version number PFD_DRAW_TO_WINDOW | // support window PFD_SUPPORT_OPENGL | // support OpenGL PFD_DOUBLEBUFFER, // double buffered PFD_TYPE_RGBA, // RGBA type 24, // 24-bit color depth 0, 0, 0, 0, 0, 0, // color bits ignored 0, // no alpha buffer 0, // shift bit ignored 0, // no accumulation buffer 0, 0, 0, 0, // accum bits ignored 32, // 32-bit z-buffer 0, // no stencil buffer 0, // no auxiliary buffer PFD_MAIN_PLANE, // main layer 0, // reserved 0, 0, 0 // layer masks ignored }; int pixelformat = ChoosePixelFormat(DC, &pfd); SetPixelFormat(DC, pixelformat, &pfd); HGLRC hrc = wglCreateContext(DC); ASSERT(hrc != NULL); wglMakeCurrent(DC, hrc); Of course this is not exactly what I do, it is the simplified version of my code. Well now the strange things begin to happen: all initialization is fine, there are no errors in OnInitDialog(), but when I click the button... no exception is thrown. Nothing happens. At all. If I set a break-point at the *i = 3; and press F11 on it, the handler-function halts immediately and focus is returned to the application, which continue to work well. I can click button again and the same thing will happen. It seems like someone had handled occurred exception of access violation and silently returned execution into main application message-receiving cycle. If I comment the line wglMakeCurrent(DC, hrc);, all works fine as before, exception is thrown and Visual Studio catches it and shows window with error message and program must be terminated afterwards. I experience this problem under Windows 7 64-bit, NVIDIA GeForce 8800 with latest drivers (of 11.01.2010) available at website installed. My colleague has Windows Vista 32-bit and has no such problem - exception is thrown and application crashes in both cases. Well, hope good guys will help me :) PS The problem originally where posted under this topic.

    Read the article

  • rounded corners in Qooxdoo - problems with ImageMagic and PNG

    - by lomme47
    Hi, I want to create a button with rounded corners in Qooxdoo but I'm having some problems. I guess it's a problem with ImageMagick and not my Qooxdoo code, but I'll post it anyway. So in order to create rounded corners I'm following this guide Guide this is what my image.json contains: { "jobs" : { "common" : { "let" : { "RESPATH" : "source/resource/custom" }, "cache" : { "compile" : "../cache" } }, "image-clipping" : { "extend" : ["common"], "slice-images" : { "images" : { "${RESPATH}/image/source/groupBox.png" : { "prefix" : "../clipped/groupBox", "border-width" : 4 } } } }, "image-combine" : { "extend" : ["common"], "combine-images" : { "images" : { "${RESPATH}/image-combined/combined.png": { "prefix" : [ "${RESPATH}" ], "layout" : "vertical", "input" : [ { "prefix" : [ "${RESPATH}" ], "files" : [ "${RESPATH}/image/clipped/groupBox*.png" ] } ] } } } } } } Here's what happens when I run image-clipping and image-combine: C:\customgenerate.py -c image.json image-clipping INITIALIZING: CUSTOM Configuration: image.json Jobs: image-clipping Resolving config includes... Resolving jobs... Incorporating job defaults... Resolving macros... Resolving libs/manifests... EXECUTING: IMAGE-CLIPPING Initializing cache... Done C:\customgenerate.py -c image.json image-combine INITIALIZING: CUSTOM Configuration: image.json Jobs: image-combine Resolving config includes... Resolving jobs... Incorporating job defaults... Resolving macros... Resolving libs/manifests... EXECUTING: IMAGE-COMBINE Initializing cache... Combining images... Creating image C:\custom\source\resource\custom\image-combined\combined.png Magick: no decode delegate for this image format \docume~1\lomme\lokala~1\ tmpql73hk' @ error/constitute.c/ReadImage/532. Magick: missing an image filename C:\custom\source\resource\custom\image-combined\combined.png' @ error/montage.c/MontageImageCommand/1707. The montage command (montage -geometry +0+0 -gravity NorthWest -tile 1x -background None @c:\docume~1\lomme\lokala~1\temp\tmpql73hk C:\custom\source\resources\custom\image-combined\combined.png) failed with the following return code:1 The image-clipping works like a charm but I get some kinda error message when I try to run image-combine. When I google the error messages it says ImageMagick is lacking PNG support but I can use other commands like "convert a.jpg b.png" so there must be some kinda png support? here's what "identify -list format" returns: PNG* PNG rw- Portable Network Graphics (libpng 1.2.43) See http://www.libpng.org/ for details about the PNG format. PNG24* PNG rw- opaque 24-bit RGB (zlib 1.2.3) PNG32* PNG rw- opaque or transparent 32-bit RGBA PNG8* PNG rw- 8-bit indexed with optional binary transparency So why do i get this error message: Magick: no decode delegate for this image format Looks to me like there's png support? I've never used ImageMagick before so I'm completely lost :D Thanks in advance

    Read the article

  • How do I do high quality scaling of a image?

    - by pbhogan
    I'm writing some code to scale a 32 bit RGBA image in C/C++. I have written a few attempts that have been somewhat successful, but they're slow and most importantly the quality of the sized image is not acceptable. I compared the same image scaled by OpenGL (i.e. my video card) and my routine and it's miles apart in quality. I've Google Code Searched, scoured source trees of anything I thought would shed some light (SDL, Allegro, wxWidgets, CxImage, GD, ImageMagick, etc.) but usually their code is either convoluted and scattered all over the place or riddled with assembler and little or no comments. I've also read multiple articles on Wikipedia and elsewhere, and I'm just not finding a clear explanation of what I need. I understand the basic concepts of interpolation and sampling, but I'm struggling to get the algorithm right. I do NOT want to rely on an external library for one routine and have to convert to their image format and back. Besides, I'd like to know how to do it myself anyway. :) I have seen a similar question asked on stack overflow before, but it wasn't really answered in this way, but I'm hoping there's someone out there who can help nudge me in the right direction. Maybe point me to some articles or pseudo code... anything to help me learn and do. Here's what I'm looking for: 1. No assembler (I'm writing very portable code for multiple processor types). 2. No dependencies on external libraries. 3. I am primarily concerned with scaling DOWN, but will also need to write a scale up routine later. 4. Quality of the result and clarity of the algorithm is most important (I can optimize it later). My routine essentially takes the following form: DrawScaled( uint32 *src, uint32 *dst, src_x, src_y, src_w, src_h, dst_x, dst_y, dst_w, dst_h ); Thanks! UPDATE: To clarify, I need something more advanced than a box resample for downscaling which blurs the image too much. I suspect what I want is some kind of bicubic (or other) filter that is somewhat the reverse to a bicubic upscaling algorithm (i.e. each destination pixel is computed from all contributing source pixels combined with a weighting algorithm that keeps things sharp. EXAMPLE: Here's an example of what I'm getting from the wxWidgets BoxResample algorithm vs. what I want on a 256x256 bitmap scaled to 55x55. And finally: the original 256x256 image

    Read the article

  • Javascript not getting keyDown input

    - by William
    For some reason my code just isn't wanting to fire off any kind of OnKeyDown event. I don't know why. Can anyone tell me what I'm doing wrong? <!DOCTYPE html> <html lang="en"> <head> <title>Canvas test</title> <meta charset="utf-8" /> <link href="/bms/style.css" rel="stylesheet" /> <style> body { text-align: center; background-color: #000000;} canvas{ background-color: #ffffff;} </style> <script type="text/javascript"> var x = 50; var y = 250; var speed = 5; function controls(event){ if(!e){ //for IE e = window.event; } if(e.keyCode==37){//keyCode 37 is left arrow x -= speed; } if(e.keyCode==39){ //keyCode 39 is right arrow x += speed; } if(e.keyCode==38){//keyCode 37 is up arrow y -= speed; } if(e.keyCode==40){ //keyCode 39 is down arrow y += speed; } } function update(){ document.onkeydown="controls(event);"; draw(); } function draw(){ var canvas = document.getElementById('screen1'); if (canvas.getContext){ var ctx = canvas.getContext('2d'); ctx.fillStyle = 'rgba(255,255,255,0.5)'; ctx.fillRect(0,0,500,500); ctx.fillStyle = 'rgb(236,138,68)'; ctx.fillRect(x,y,25,25); } } setInterval('update();', 1000/60); </script> </head> <body> <canvas id="screen1" width="500" height="500"></canvas> </body> </html>

    Read the article

  • HLSL tex2d sampler seemingly using inconsistent rounding; why?

    - by RJFalconer
    Hello all, I have code that needs to render regions of my object differently depending on their location. I am trying to use a colour map to define these regions. The problem is when I sample from my colour map, I get collisions. Ie, two regions with different colours in the colourmap get the same value returned from the sampler. I've tried various formats of my colour map. I set the colours for each region to be "5" apart in each case; Indexed colour RGB, RGBA: region 1 will have RGB 5%,5%,5%. region 2 will have RGB 10%,10%,10% and so on. HSV Greyscale: region 1 will have HSV 0,0,5%. region 2 will have HSV 0,0,10% and so on. (Values selected in The Gimp) The tex2D sampler returns a value [0..1]. [ I then intend to derive an int array index from region. Code to do with that is unrelated, so has been removed from the question ] float region = tex2D(gColourmapSampler,In.UV).x; Sampling the "5%" colour gave a "region" of 0.05098 in hlsl. From this I assume the 5% represents 5/100*255, or 12.75, which is rounded to 13 when stored in the texture OR when sampled by the sampler; can't tell which. (Reasoning: 0.05098 * 255 ~= 13) By this logic, the 50% should be stored as 127.5. Sampled, I get 0.50196 which implies it was stored as 128. the 70% should be stored as 178.5. Sampled, I get 0.698039, which implies it was stored as 178. What rounding is going on here? (127.5 becomes 128, 178.5 becomes 178 ?!) Edit: OK, http://en.wikipedia.org/wiki/Bankers_rounding#Round_half_to_even Apparently this is "banker's rounding". Is this really what HLSL samplers use? I am using Shader Model 2 and FX Composer. This is my sampler declaration; //Colour map texture gColourmapTexture < string ResourceName = "Globe_Colourmap_Regions_Greyscale.png"; string ResourceType = "2D"; >; sampler2D gColourmapSampler : register(s1) = sampler_state { Texture = <gColourmapTexture>; #if DIRECT3D_VERSION >= 0xa00 Filter = MIN_MAG_MIP_LINEAR; #else /* DIRECT3D_VERSION < 0xa00 */ MinFilter = Linear; MipFilter = Linear; MagFilter = Linear; #endif /* DIRECT3D_VERSION */ AddressU = Clamp; AddressV = Clamp; };

    Read the article

  • Is there anything wrong with my texture loading method ?

    - by José Joel.
    I'm a noob in openGL and trying to learn as much as possible. I'm using this method to load my openGL textures, loading every .png as RGBA4444. I'm doing anything incorrect ? - (void)loadTexture:(NSString*)nombre { CGImageRef textureImage =[UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:nombre ofType:nil]].CGImage; if (textureImage == nil) { NSLog(@"Failed to load texture image"); return; } textureWidth = NextPowerOfTwo(CGImageGetWidth(textureImage)); textureHeight = NextPowerOfTwo(CGImageGetHeight(textureImage)); imageSizeX= CGImageGetWidth(textureImage); imageSizeY= CGImageGetHeight(textureImage); GLubyte *textureData = (GLubyte *)calloc(1,textureWidth * textureHeight * 4); // Por 4 pues cada pixel necesita 4 bytes, RGBA CGContextRef textureContext = CGBitmapContextCreate(textureData, textureWidth,textureHeight,8, textureWidth * 4,CGImageGetColorSpace(textureImage),kCGImageAlphaPremultipliedLast ); CGContextDrawImage(textureContext, CGRectMake(0.0, 0.0, (float)textureWidth, (float)textureHeight), textureImage); //Convert "RRRRRRRRRGGGGGGGGBBBBBBBBAAAAAAAA" to "RRRRGGGGBBBBAAAA" void *tempData = malloc(textureWidth * textureHeight * 2); unsigned int* inPixel32 = (unsigned int*)textureData; unsigned short* outPixel16 = (unsigned short*)tempData; for(int i = 0; i < textureWidth * textureHeight ; ++i, ++inPixel32) *outPixel16++ = ((((*inPixel32 >> 0) & 0xFF) >> 4) << 12) | // R ((((*inPixel32 >> 8) & 0xFF) >> 4) << 8) | // G ((((*inPixel32 >> 16) & 0xFF) >> 4) << 4) | // B ((((*inPixel32 >> 24) & 0xFF) >> 4) << 0); // A free(textureData); textureData = tempData; CGContextRelease(textureContext); glGenTextures(1, &textures[0]); glBindTexture(GL_TEXTURE_2D, textures[0]); glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, textureWidth, textureHeight, 0, GL_RGBA, GL_UNSIGNED_SHORT_4_4_4_4 , textureData); free(textureData); glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR); glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); } And this is my dealloc method: - (void)dealloc { glDeleteTextures(1,textures); [super dealloc]; }

    Read the article

  • What's causing this background-image to display "incorrectly" in Opera and Firefox?

    - by Sukasa
    I know this is something I'm probably doing wrong, so please don't incinerate me for the thread title. I'm trying to put together a small personal website using HTML 5/CSS3. I've checked with the w3c validator and the site and CSS file fully conform according to the validator (However the validator has a warning attached that it might not be perfect). I'm not sure how to explain it without a picture, so here's a comparison of Chrome/Opera/Firefox: So, you can sorta see how in Chrome the background image is in one non-repeating piece, whereas in Opera/Firefox the image has, oddly, been broken up and placed slightly differently. I'm confident this is due to an error on my part, but I've had no luck at all figuring out why the image is being mangled in Opera and Firefox. Here's the CSS that's relevant to this issue: /* Content Pane */ .content { position: absolute; left: 220px; width: 800px; top: 80px; min-height: 550px; background-color: rgba(8,12,42,0.85); } /* Headers */ .content hgroup { background: url("Header_Flat.png") no-repeat left top; min-height: 38px; padding-left: 28px; text-shadow: 0 0 8px #FFA9FF; color: Black; text-decoration: none; } .content hgroup h1 { display: block; } .content hgroup h3 { display: inline; position: relative; top: -12px; left: 20px; text-shadow: 0 0 6px #AFF9FF; } .content hgroup h4 { display: inline; position: relative; top: -12px; left: 20px; font-size: xx-small; text-shadow: 0 0 6px #AFF9FF; } And the HTML: <hgroup> <h1>New Site!</h1> <h3>Now with Bloom!</h3> <h4> - Posted Tuesday, May 11th 2010</h4> </hgroup> Can anyone see what I'm doing wrong?

    Read the article

< Previous Page | 2 3 4 5 6 7  | Next Page >