I'm putting together an app that will show a news item's location in Google Earth using the javascript api. This is working great but we want to prevent users from manually dragging the globe around.
I know for Google Maps there is a function disableDragging which accomplishes this, but in the Earth api I could find no similar function.
I also tried placing a (nearly) transparent div over the GE container but any div with a non-solid background disappears over the container.
There is a standard method in the Api to disable mouse control of the globe.
// where ge is an instance of the plugin object
ge.getOptions().setMouseNavigationEnabled(false);
Here is a working example.
I am not 100% sure what you mean with 'transparent div over the GE container' but perhaps the iframe shim technique is what you are looking for?
Related
I have added a Google Maps Javascript API (dynamic map) to my web-site. I want to put a static picture in the bottom left corner over the maps div - something like a legend. It will not move when the user scrows around.
Is there a way to do it through Google Javascript API or shall I just add a div, put it over the map with CSS?
Yes, there is a way to add this sort of thing using the Google Maps Javascript API. It is considered a Custom Control, and here is a link to the documentation. You would do that if you need to have your element move around when screen real estate gets tight and you want Google Maps to take care of it.
If you aren't concerned with reflowing the other controls as the map appears on screens of various sizes, you can just go with an absolutely positioned element. If you don't want your overlay to affect the map ui by capturing mouse events, just set pointer-events:none; on that element.
What I am trying to do is create a embedded javascript application where the google earth plugin is embedded in a webpage with various paths drawn on. Here is an example of what I am trying to achieve.
The catch is that the lines need to be editable, with each joint having a handle where the user can click and drag. I have looked high and low on Googles api documentation and I cannot find anything even close to this. If anyone can point me in the right direction it would be much appreciated.
You want each 'joint' to be a dragable placemark so that when you drag it the line geometry is updated.
For reference check out the Google Earth API Samples - Draggable Placemark:
http://earth-api-samples.googlecode.com/svn/trunk/examples/placemark-dragdrop.html
And possibly James Stafford's polyplot:
http://www.barnabu.co.uk/geapi/polyplot/
Together they should help you achieve what you want.
Unfortunately, on a site that I'm working on, the StreetView image of the business premises is out of date and not very flattering of the business.
Is there any way to make (via the Maps API) the map image a static image, which doesn't link to the full Google Maps page showing the StreetView image?
I'm trying to avoid manually embedding an image as I want to be able to do this programmatically.
Thank you.
Prembo.
I found a really simple solution to this, in my case I wanted an interactive map on desktop and a static map on mobile.
Using media queries I added the attribute {pointer-events: none !important;} to the parent div wrapping my map when changing to mobile.
Yep, take a look at the static maps api. There is an example of exactly what you need.
https://developers.google.com/maps/documentation/staticmaps/
You could style the map so it can't scroll, zoom, street view... etc.
https://developers.google.com/maps/documentation/javascript/reference#MapOptions
I've found a great page that demonstrates many uses of the Google Maps Api v2 and v3.
I tried to understand each line of the javascript and make something similar to what can be found on the page linked above.
However I can't understand two things:
In my application I don't want to rebuild the sidebar every time the zoom/bound/mapcenter changes. Currently the sidebar shows only placemarks that are visible on the current mapview. When the user zooms in and a placemark goes out of the view it disappears from the sidebar too. It could be annoying when you already scrolled somewhere and with only a little zooming you loose your scrolled status. Also if you bind events to sidebar elements, changing the view on the map rebuilds the sidebar and your events are finished.
I tried to rewrite the piece of code that creates categories from the placemark's styleurl property to apply to polylines as well not just markers, but I have no luck.
If you are deep in this kind of work please point me to the right direction.
Thanks.
I have been looking around and haven't found an answer to this yet. Is it possible to add click events to either the 3D building layer or custom 3D models using javascript for the google earth plugin.
My end goal is to be able to have a user select a 3d building and have an information bubble show up with details about that building. This is rather than the default bubble that Google shows with information about the 3D model.
Ideally one would be able to use the 3D buildings layer as opposed to loading the models manually, though I don't have high hopes of that being possible so doing it via manually uploaded 3D models would be a possibility.
I am using the google maps api V3 with the google earth utility library to activate the plugin.
Thanks in advance for any answers.
I think i've overread this the first time. After taking a closer look it reveals that it seems to be still not possible (in that easy way)
google.earth.addEventListener(placemark, 'click', function(event)
{
alert('click');
});
... Mouse events can be attached to most geometries in the plugin (the exception is 3D models), ...
google earth api
Maybe its possible to do that by implementing a custom intersection 'listener'
//EDIT:
Maybe thats not the hole story. more research revealed that it is possible to make a hittest agaignst some geometry. the ge interface has a function named hitTest(...)
api doc
GEHitTestResult GEView.hitTest( float x,
KmlUnitsEnum xUnits,
float y,
KmlUnitsEnum yUnits,
GEHitTestModeEnum mode
)
unfortunately the GEHitTestModeEnum is only suitable for GEPlugin.HIT_TEST_GLOBE GEPlugin.HIT_TEST_TERRAIN
GEPlugin.HIT_TEST_BUILDINGS
so you can hitTest against buildings but not against custom 3D models...
a slightly useable solution to click custom 3D models could be the one described in this issue using other 'eventable' invisible placemarks to detect a click.
litte code excample of hittesting
//EDIT2:
The solution i use in my current project sounds like that:
create a bounding box with polygons for every 'click event recieving custom 3d model'
that polygons can receive click events
google.earth.addEventListener(polygonPlacemark, 'click', function(event) {
alert('placemark bounding box clicked');
});