Search Results

Search found 9 results on 1 pages for 'worldmap'.

Page 1/1 | 1 

  • When mapping the surface of a sphere with tiles, how might you deal with polar distortion?

    - by clweeks
    It's easy to deal with the way locations interact on a clean Cartesian grid. It's just vanilla math. And you can kind of ignore the geometry of the sphere's surface for a bunch of it if you want to just truncate the poles or something. But I keep coming up with ideas for games where the polar space matters. Geo-coded ARGs and global roguelikes and stuff. I want square(ish?) locations -- reasonably representable by square tiles of the same size across the globe, anyway. This has to be a solved problem, right? What are the solutions? ETA: At the equator -- and assuming that your square locations are reasonably small, it's close enough to true that you can get away with having one square in the rows north and south of the most equatorial row. And you could probably get away with that by just hand-waving the difference up to like 45-degrees or so. But eventually, you need to have fewer squares in a pole-ward circumferential row. If I reduce the length of the row by one and offset the squares by 1/2 then they're just like hexes and it's relatively easy to do the coding to keep track of the connections. But as you get pole-ward, it gets more and more extreme. Projecting the surface of the world onto the surface of a cube is tempting. But I figured there must be more elegant solutions already in use. If I did the cube thing (not dissecting it further through geodesy) Are there any pros and cons related to placing the pole at the center of a face or at the vertex of three sides?

    Read the article

  • jQuery Map Highlight - works fine at DOM ready but failed when loaded by AJAX

    - by Michael Mao
    Hi all: This is uni assignment and I have already done some stuff. Please go to the password protected directory on : my server Enter username "uts" and password "10479475", both without quotes, into the prompt and you shall be able to see the webpage. Basically, if you hover your mouse on top of the contents in worldmap to the upperleft corner, you can see the underneath area is "highlighted" by a gray region and a red border. This is done using one jQuery plugin : at here This part works fine, however, after I use jQuery to load the specific continent map asynchronously, the newly loaded image cannot work correctly. Tested under Firebug, I can see the plugin doesn't "like" the new image cause I cannot find the canvas or other auto-generated stuff which can be founded around the worldmap. All the functionality is done in master.js, I believe you can just download a copy and check the code there. I do hope that I have followed the tutorials on the plugin's doc page, but I just cannot get through the final stage. Code used for worldmap in html: <img id="worldmap" src="./img/world.gif" alt="world.gif" width="398" height="200" class="map" usemap="#worldmap"/> <map name="worldmap"> <area class='continent' href="#" shape="poly" title="North_America" coords="1,39, 40,23, 123,13, 164,17, 159,40, 84,98, 64,111, 29,89" /> </map> Code used for worldmap in master.js //when DOM is ready, do something $(document).ready(function() { $('.map').maphilight(); //call the map highlight main function } On contrast, code used for specific continent map: //helper function to load specific continent map using AJAX function loadContinentMap(continent) { $('#continent-map-wrapper').children().remove(); //remove all children nodes first //inspiration taken from online : http://jqueryfordesigners.com/image-loading/ $('#continent-map-wrapper').append("<div id='loader' class='loading'><div>"); var img = new Image(); // wrap our new image in jQuery, then: // once the image has loaded, execute this code $(img).load(function () { $(this).hide(); // set the image hidden by default // with the holding div #loader, apply: // remove the loading class (so no background spinner), // then insert our image $('#loader').removeClass('loading').append(this); // fade our image in to create a nice effect $(this).fadeIn(); }).error(function () { // if there was an error loading the image, react accordingly // notify the user that the image could not be loaded $('#loader').removeClass('loading').append("<h1><div class='errormsg'>Loading image failed, please try again! If same error persists, please contact webmaster.</div></h1>"); }) //set a series of attributes to the img tag, these are for the map high lighting plugin. .attr('id', continent).attr('alt', '' + continent).attr('width', '576').attr('height', '300') .attr('usemap', '#city_' + continent).attr('class', 'citymap').attr('src', './img/' + continent + '.gif'); // *finally*, set the src attribute of the new image to our image //After image is loaded, apply the map highlighting plugin function again. $('.citymap').maphilight(); $('area.citymap').click(function() { alert($(this).attr('title') + ' is clicked!'); }); } Sorry about the messy code, havn't refactored it yet. I am wondering why the canvas disappers for the continent map. Did I do anything wrong. Any hint is much appreciated and thanks for any suggestion in advance!

    Read the article

  • WriteableBitmap failing badly, pixel array very inaccurate

    - by dawmail333
    I have tried, literally for hours, and I have not been able to budge this problem. I have a UserControl, that is 800x369, and it contains, simply, a path that forms a worldmap. I put this on a landscape page, then I render it into a WriteableBitmap. I then run a conversion to turn the 1d Pixels array into a 2d array of integers. Then, to check the conversion, I wire up the custom control's click command to use the Point.X and Point.Y relative to the custom control in the newly created array. My logic is thus: wb = new WriteableBitmap(worldMap, new TranslateTransform()); wb.Invalidate(); intTest = wb.Pixels.To2DArray(wb.PixelWidth); My conversion logic is as such: public static int[,] To2DArray(this int[] arr,int rowLength) { int[,] output = new int[rowLength, arr.Length / rowLength]; if (arr.Length % rowLength != 0) throw new IndexOutOfRangeException(); for (int i = 0; i < arr.Length; i++) { output[i % rowLength, i / rowLength] = arr[i]; } return output; } Now, when I do the checking, I get completely and utterly strange results: apparently all pixels are either at values of -1 or 0, and these values are completely independent of the original colours. Just for posterity: here's my checking code: private void Check(object sender, MouseButtonEventArgs e) { Point click = e.GetPosition(worldMap); ChangeNotification(intTest[(int)click.X,(int)click.Y].ToString()); } The result show absolutely no correlation to the path that the WriteableBitmap has rendered into it. The path has a fill of solid white. What the heck is going on? I've tried for hours with no luck. Please, this is the major problem stopping me from submitting my first WP7 app. Any guidance?

    Read the article

  • Stopping the animation after you let go of a key

    - by Michael Zeuner
    What I have right now is an animation that starts when I press space: if(input.isKeyDown(Input.KEY_SPACE)) player = movingRightSwingingSword; However when I stop clicking space my animation continues. until I move my player, how do I make it so it stops the animation right when you let go of space? A few lines Animation player, movingUp, movingDown, movingLeft, movingRight, movingRightSwingingSword; int[] duration = {200,200}; public void init(GameContainer gc, StateBasedGame sbg) throws SlickException { Image[] attackRight = {new Image("res/buckysRightSword1.png"), new Image("res/buckysRightSword2.png")}; movingRightSwingingSword = new Animation(attackRight, duration, true); } public void update(GameContainer gc, StateBasedGame sbg, int delta) throws SlickException { if(input.isKeyDown(Input.KEY_SPACE)) player = movingRightSwingingSword; } Full Code package javagame; import org.newdawn.slick.*; import org.newdawn.slick.state.*; public class Play extends BasicGameState { Animation player, movingUp, movingDown, movingLeft, movingRight, movingRightSwingingSword; Image worldMap; boolean quit = false; int[] duration = {200,200}; float playerPositionX = 0; float playerPositionY = 0; float shiftX = playerPositionX + 320; float shiftY = playerPositionY + 160; public Play(int state) { } public void init(GameContainer gc, StateBasedGame sbg) throws SlickException { worldMap = new Image("res/world.png"); Image[] walkUp = {new Image("res/buckysBack.png"), new Image("res/buckysBack.png")}; Image[] walkDown = {new Image("res/buckysFront.png"), new Image("res/buckysFront.png")}; Image[] walkLeft = {new Image("res/buckysLeft.png"), new Image("res/buckysLeft.png")}; Image[] walkRight = {new Image("res/buckysRight.png"), new Image("res/buckysRight.png")}; Image[] attackRight = {new Image("res/buckysRightSword1.png"), new Image("res/buckysRightSword2.png")}; movingUp = new Animation(walkUp, duration, false); movingDown = new Animation(walkDown, duration, false); movingLeft = new Animation(walkLeft, duration, false); movingRight = new Animation(walkRight, duration, false); //doesnt work! vvv movingRightSwingingSword = new Animation(attackRight, duration, true); player = movingDown; } public void render(GameContainer gc, StateBasedGame sbg, Graphics g) throws SlickException { worldMap.draw(playerPositionX, playerPositionY); player.draw(shiftX, shiftY); g.drawString("Player X: " + playerPositionX + "\nPlayer Y: " + playerPositionY, 400, 20); if (quit == true) { g.drawString("Resume (R)", 250, 100); g.drawString("MainMenu (M)", 250, 150); g.drawString("Quit Game (Q)", 250, 200); if (quit==false) { g.clear(); } } } public void update(GameContainer gc, StateBasedGame sbg, int delta) throws SlickException { Input input = gc.getInput(); if(input.isKeyDown(Input.KEY_UP)) { player = movingUp; playerPositionY += delta * .1f; if(playerPositionY>162) playerPositionY -= delta * .1f; } if(input.isKeyDown(Input.KEY_DOWN)) { player = movingDown; playerPositionY -= delta * .1f; if(playerPositionY<-600) playerPositionY += delta * .1f; } if(input.isKeyDown(Input.KEY_RIGHT)) { player = movingRight; playerPositionX -= delta * .1f; if(playerPositionX<-840) playerPositionX += delta * .1f; } if(input.isKeyDown(Input.KEY_LEFT)) { player = movingLeft; playerPositionX += delta * .1f; if(playerPositionX>318) playerPositionX -= delta * .1f; } if(input.isKeyDown(Input.KEY_SPACE)) player = movingRightSwingingSword; if(input.isKeyDown(Input.KEY_ESCAPE)) quit = true; if(input.isKeyDown(Input.KEY_R)) if (quit == true) quit = false; if(input.isKeyDown(Input.KEY_M)) if (quit == true) {sbg.enterState(0); quit = false;} if(input.isKeyDown(Input.KEY_Q)) if (quit == true) System.exit(0); } public int getID() { return 1; } }

    Read the article

  • Algorithm for waypoint path following?

    - by Thierry Savard Saucier
    I have a worldmap, with different cities on it. The player can choose a city from a menu, or click on an available cities on the world map, and the toon should walk over there. I want him to follow a predefined path. Lets say our hero is on the city 1. He clicks on city 4. I want him to follow the path to city 2 and from there to city 4. I was handling this easily with arrow movement (left right top bottom) since its a single check. Now I'm not sure how I should do this. Should I loop threw each possible path and check which one leads me to D the fastest ... and if I do how do I avoid running in circle forever with cities 1-5-2 ?

    Read the article

  • texture colours opengl

    - by user1324894
    Hi I am making a simple 2D game in c++ and for the map I am doing texture mapping by using tiles and assigning textures to those tiles. However, when I run the programme the textures become black and white when I want them to be the colour they are in the .png image. This is my code: int worldMap[10][10] = { {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, {0,0,0,0,0,0,0,0,0,0}, }; void background() { glClearColor(0.0,0.0,0.0,0.0); /**********************************************************************************************/ // Texture loading object nv::Image img; // Return true on success if(img.loadImageFromFile("Image_Loading/field.png")) { glGenTextures(1, &myTexture); glBindTexture(GL_TEXTURE_2D, myTexture); glTexParameteri(GL_TEXTURE_2D, GL_GENERATE_MIPMAP, GL_TRUE); glTexImage2D(GL_TEXTURE_2D, 0, img.getInternalFormat(), img.getWidth(), img.getHeight(), 0, img.getFormat(), img.getType(), img.getLevel(0)); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); glTexParameterf( GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT ); glTexParameterf( GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT ); glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAX_ANISOTROPY_EXT, 16.0f); } else MessageBox(NULL, "Failed to load texture", "End of the world", MB_OK | MB_ICONINFORMATION); /**********************************************************************************************/ } void drawTiles (void) { //our function to draw the tiles for (int i = 0; i < 10; i++) //loop through the height of the map { for (int j = 0; j < 10; j++) //loop through the width of the map { if (worldMap[i][j] == 0) //if the map at this position contains a 0 { glBindTexture( GL_TEXTURE_2D, myTexture ); //bind our grass texture to our shape } glPushMatrix(); //push the matrix so that our translations only affect this tile glTranslatef(j, -i, 0); //translate the tile to where it should belong glBegin (GL_QUADS); //begin drawing our quads glTexCoord2d(10, 0); glVertex2f((-10 + mapX),(-10 + mapY)); //with our vertices we have to assign a texcoord glTexCoord2d(10, 0); glVertex2f((10 + mapX),(-10 + mapY)); //so that our texture has some points to draw to glTexCoord2d(10, 10); glVertex2f((10 + mapX),(10 + mapY)); glTexCoord2d(0, 10); glVertex2f((-10 + mapX),(10 + mapY)); glEnd(); glPopMatrix(); //pop the matrix } //end first loop } //end second loop } void display() { glClearColor (0.0,0.0,0.0,1.0); glClear(GL_COLOR_BUFFER_BIT); /**********************************************************************************************/ glMatrixMode( GL_PROJECTION ); glLoadIdentity(); gluOrtho2D( -5, 5, -5, 5); glMatrixMode( GL_MODELVIEW ); glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D, myTexture); glEnable(GL_BLEND); glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); drawTiles(); glDisable(GL_TEXTURE_2D); glDisable(GL_BLEND); /**********************************************************************************************/ } void character () { glBegin(GL_POLYGON); glVertex2f((-0.5+characterX),(-0.5 +characterY)); glVertex2f((-0.5+characterX),(0.5+characterY)); glVertex2f((0.5+characterX),(0.5+characterY)); glVertex2f((0.5+characterX),(-0.5+characterY)); glTranslatef(characterX, characterY, 0.0f); glEnd(); } Can anybody help please?

    Read the article

  • Algorithm allowing a good waypoint path following?

    - by Thierry Savard Saucier
    I'm more looking into how should I implement this, either a tutorial or even the name of the concept I'm missing. I'm pretty sure some basic pathfinding algorithm could help me here, but I dont know which one ... I have a worldmap, with different cities on it. The player can choose a city from a menu, or click on an available cities on the world map, and the toon should walk over there. But I want him to follow a predefine path. Lets say our hero is on the city 1. He clicks on city 4. I want him to follow the path to city 2 and from there to city 4. I was handling this easily with arrow movement (left right top bottom) since its a single check. Now I'm not sure how I should do this. Should I loop threw each possible path and check which one leads me to D the fastest ... and if I do how do I avoid running in circle forever with cities 1-5-2 ?

    Read the article

  • manipulate objects outside svg with javascript-function inside the svg

    - by Christian Benke
    Hello! I'm embedding a svg-graphic on my website and i'd like to manipulate the rest of the website with javascript-commands which are in the svg - though i'm not sure if this is possible. Let me elaborate: I've got a worldmap in svg, i want to click on a country and this click should run an ajax-call and load relevant information of this country into a div in the html site where the svg is embedded. "onclick="location.href='xxx'"" redirects to the respective site which is fine, but i'd prefer to run a js-function that fetches the site with ajax - but running a javascript-function in the svg only seems to work for functions and elements defined in the svg, not outside of it. Is it basically possible to manipulate anything outside the svg through a js-function in the svg? How? Regards Christian

    Read the article

  • Map tiling - What kind of projection?

    - by ikky
    Hi. I've taken a large image and divided it in to square tiles (256x256). It is made for google maps also, so the whole image is divided into z_x_y.png (Depending on zoom level). z=0 = 1x1 tile z=1 = 2x2 tilesthe z=2 = 4x4 tiles My imageMap is "flat" and is not based on a sphere like the worldmap. I'm gonna use this map on a windows mobile app (which has no google API), and all the "points of interests" is inserted into a database by longitude and latitude. And since i have to make this for the windows mobile, i just have XY coordinate system. Is it enough to just use this: MAP_WIDTH = 256*TILES_W; MAP_HEIGHT = 256*TILES_H; function convert(int lat, int lon) { int y = (int)((-1 * lat) + 90) * (MAP_HEIGHT / 180); int x = (int)(lon + 180) * (MAP_WIDTH / 360); ImagePoint p = new ImagePoint(x,y); // An object which holds the coordinates return p; } Or do i need a projection technique? Thanks in advance. Please ask, if something is unclear.

    Read the article

1