I am trying to use the functionality of Google Slides to create a complicated diagram of a complicated process. Basically, I have tiny rectangles (shapes) within larger rectangles within even larger rectangles, all on top of a huge rectangle that occupies my entire viewport with the maximum zoom out (Ctrl-Alt-Minus pressed many times). Rectangles have some small font text in them and there are also a bunch of connectors going from one rectangle to another.
It's a big mess.
When I want to see the details of a small rectangle, I use the provided Ctrl-Alt-Plus shortcut to zoom in as far as it lets me. However, it's incredibly cumbersome, because it will only zoom in to whatever is in the very center of the screen. So, I need to constantly adjust my view port to place what I want into the center of the screen.
What I want is to write a script (if such functionality is in fact provided - hence the question) where I could click on a specific rectangle and it would immediately zoom to this rectangle, placing it in the middle of my screen, it occupying about 50% of the screen space.
I looked through Google Slides API reference and found absolutely nothing related to zoom. Am I searching incorrectly, or is it simply not there?
Related
I am wanting to allow users to click on a specific part of a photograph in a tablet/phone (via a web browser or software) and it will record their choice.
Essentially I have some aerial photographs and I want to place a regular grid (say 100m x 100m over the top). This grid would be semi-transparent, and each grid cell would be clear if not clicked ('off') and change to blue when clicked ('on'). Each grid cell would store a value if it is 'on' or 'off'.
This would preferably done using a spatially referenced geotiff image, but is not essential.
I have lots experience in GIS related software, but I am looking for a simple solution.
Is this possible?
What tools, web languages (html, java etc), or software is recomended.
Responsive image maps kind of seem relevant here but I am not sure?
Tracking user interaction over an image is possible. You can overlay a grid of clickable div, and simply listen for clicks on each div.
Here is an approach where I place a 10x10 grid of div on top of an image:
https://jsfiddle.net/o31p99wh/
The key is to know the size / scale of the image, and make sure that the tiles are mapped to that. E.g. each 35 x 35px square maps to 350 x 350m.
Apologies if this has been answered before, I didn't see anything that matched it perfectly. I've found a ton of resources for sliders that snap to the edge of the current frame, but not my requirements below.
What is the best way to build a simple webpage that has the following:
A top layer, that fills the entire screen, with a 'hole' showing a background layer.
The background layer must be draggable/swipeable horizontally.
The background layer is many time wider than the viewport, so I don't want any snapping until the edges of the image are reached.
I made a little gif mockup to try to show what I'm on about.
Thanks for any help!
I was wondering how does pygame.blit manages the images blitted on screen. When I blit an multiple images on the screen, I see that each image is stacked on top the previous one.
How do I clear all these images? Wouldn't(somehow) there be a big problem when there are LOTS of images stacking on top of each other on the screen? Currently, I'm just blitting a white bg or custom bg on the whole screen to "clear" the screen. So far no problems or anything since the app I am working on is very small.
When you blit an image to a surface, it basicly draws it on the surface. The location of the blitting or the object blitted is not saved and cannot be changed. It's like if you were painting the images onto a canvas. The new ones would go over the old ones and there would be no way to get rid of one image if it were colliding with another image.
The most common approach to solving this is to just completly clear the screen using surface.fill(), and redraw the images each frame.
To answer your question about if there woudl be problems when there are lots of images, no. The window will only be saved as each individual pixel being a certain color, much like a regular picture you would take a camera, so no matter how many objects you blit, the game will always take the same amount of time.
There are multiple approaches:
Clean the whole background, as you are doing.
If the computer keeps up with the fps, perhaps it's better to leave it like this.
Clean only the areas where you blitted objects (see pygame.sprite.RenderUpdates)
In your case, if you have many stacked objects, perhaps it's better to write your own solution, trying to find the union between colliding rectangles, to avoid reblitting the same background over and over.
My first KML project was an animated map of the Washington DC Metro system (see Animating Metro with KML and Google Earth). Unfortunately, where Metro lines share the same track, only one color prevails. The real map shows a wider line with both colors side by side.
Is there a way to draw a line in KML (Google Earth) with two side-by-side colors? I've seen a way to have a different color on the edges of the line, but that's different.
I could cheat by changing the coordinates of each station, but aside from computational difficulties, I'd have to continuously changes to positions every time the user zooms, to prevent a gap between colors (or an overlap).
Other subway systems show more than two colors running alongside each other, so an option to show multiple colors would be nice. And this is not really a gradient, as the colors don't fade together; they should be distinct, assuming the pixel width is wide enough.
This is probably a feature request, though surely someone else has run across this problem before Google Earth v6? Would love to be able to do this, or find a good workaround in the interim.
Michael
http://www.mvjantzen.com/blog/
The short answer is no, although you could probably create a custom MVC object that renders the line for you as desired (i.e. you would not need to alter the Kml)
http://code.google.com/apis/maps/articles/mvcfun.html
That said, your cheat method could work too - and I would disagree that
"...I'd have to continuously changes to positions every time the user
zooms, to prevent a gap between colors"
You can set the <gx:physicalWidth> property which allows you to set the width of a LineString to be in meters, rather than pixels.
https://developers.google.com/kml/documentation/kmlreference#gxphysicalwidth
In the case of your track example, this means you can set the width of the track to match the underlying imagery no matter what altitude the end user views it from.
Information:
The images have large transparent sections, so each must be overlapped to create the needed effect. Specifically, the clickable portions of each image are in weird trapezoid shapes meant to be pressed up against each other.
Images have image maps with large portions being overlapped by the transparent portions of other nearby (trapezoid) images. I don't expect any change in z indexes will solve this...
Combining the image files into a larger single one to overlay a single image map for each section seems less than ideal, especially since I may need to re-order or rename them later and such. Never mind hover animations and other possibilities down the road.
What would be the best workaround?
Alright, after much tinkering I think I've found a solution: I just took a 1px transparent gif, scaled it up to cover the whole area (with a higher z-index, of course), and then mapped the image map polygons within that. Seems to work.