Interactive map display

Hello. I've a small problem if anyone can help... As part of an ongoing project I'm trying to create a GPS interfacing program that talks via the serial port to retrieve stored GPS reference data stored on aGPS device. This data will then be converted and displayed on an image of a map (such as one would get from multimap or similar) in 'breadcrumb' form (each spot will appear on the particular road (derived from processing the co-ordinates)) whereby then each breadcrumb can then be clicked on and specifics will be displayed (such as the speed, direction etc.)
My problem, however, is how to create the 'interactive' map. Everything else works in the backend;I just can't seem to figure out how to do this bit! I'm currently holding the map image (images/map.gif) in a JPanel. The nodes are created in a class called GPSNode. The communications are done through the classes GPSController(the main class), GPSDataInterface(the interface for the data - the GPS returns an unformatted string), GPSDataUnit(calculates the information for the node), PortOpen and a few exception classes.
Cheers,
Al Sweetman.

The interaction process should be as follows:
1. User clicks on JPanel
2. MouseEvent tells you where they clicked (x,y)
3. Cross reference the location with the information aquired from the serial port.
The key is to filter out all useless information based on where the user clicks (x,y). Then translate the useful information back to the graphical surface.

Similar Messages

Embed interactive map HTML5 files in Muse CC website

I am illiterate when it comes to code and therefore I am using Muse and not Dreamweaver to build a website.
I have created a interactive map that I wish to embed in this Muse website, with Avenza Mapublisher, an Adobe Illustrator Plugin, and exported it to HTML5.
The result is an index.html file as well as a folder containing scripts and subfolders containing map tiles at different zoom levels.
When I open the index.html in a browser it works 100%.
Now I want to embed it into a Muse website.
The HTML code in the index.html can be inserted via Object - Insert HTML in Muse CC.
In order for it to work the scripts in the folder needs to accessed. I changed all relative paths in the HTML code to "assets/" and try to use the "add files for upload" function in Muse to upload the scripts as assets in Muse. This worked and the scrips could be accessed.
The map tiles however (jpg tiles in different subfolders for different zoom levels), reside in subfolders whose folder structure needs to be preserved.
Unfortunately Muse does not allow me to upload a folder as an asset. I cannot add the tiles in the subfolders individually, as the scripts, depending on the zoom level, fetches different tile sets from different subfolders.
Can anyone please give me directions on how to embed this map in a Muse website?
HTML5 that I wish to embed:
Inside the assets folder:
Inside layer_1_files folder (Different zoom levels)
Inside folder 12 for example (zoom level 12)

I was able to reproduce the problem at my end with a similar setup. This is happening as HTML5 renders images a little differently and Muse uses HTML5. Refer to the following thread for more explanation on this. - http://stackoverflow.com/questions/8722017/weird-html5-sliced-images-margin-top-bottom-iss ue
So in your case, simply add the following CSS to Home -> Page Properties -> Metadata -> HTML for <head> and re-publish.
<style type="text/css">
img { display: block; }
</style>
You might also want to re-upload /Narin-&-Portnoo.gif to the /assets/ folder as it appears it hasn't been uploaded properly and is currently generating a Bad request error. However, if re-uploading doesn't help, change the file name removing any special characters, re-upload and update the embedded HTML.
Thanks,
Vinayak

Problem with "Building interactive maps with Flex" example

I have been looking at the tutorial by Matt Sheehan Building interactive maps with Flex found at
http://www.adobe.com/devnet/flex/articles/interactive_maps.edu.html
I have downloaded Flash Builder 4.6 trial version and followed the example. I have also copied the source code from the example and pasted that into the file mymodestmap.mxml.
In both cases the application opens a new page in Google Chrome but does not display any map data.
No errors or warnings are displayed when I run the code from Flash Builder.
Although I have got plenty of experience of writing software, I am a total beginner when it comes to developing web applications!
Any ideas as to what I am doing wrong, I have attached the source below.
Cheers
Steve
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx1="library://ns.adobe.com/flex/halo"
                                 minWidth="1024" minHeight="768" creationComplete="init()" viewSourceURL="srcview/index.html" xmlns:mx="library://ns.adobe.com/flex/mx">
          <fx:Script>
                    <![CDATA[
                              import mx.core.UIComponent;
                              import com.modestmaps.TweenMap;
                              import com.modestmaps.mapproviders.OpenStreetMapProvider;
                              import com.modestmaps.geo.Location;
                              import com.modestmaps.extras.ZoomSlider;
                              import com.modestmaps.extras.HandCursor;
                              [Bindable]private var _map:TweenMap;
                              private var _mapUI:UIComponent;
                              [Bindable]private var _initialLat:Number = 40.668903;
                              [Bindable]private var _initialLong:Number = -111.680145;
                              [Bindable]private var _initialZoom:Number = 6;
                              private var _mouseWheelZoomCenter:Location;
                              private var _mouseWheelZoom:int;
                              private function init():void
                                        _map = new TweenMap(mappanel.width, mappanel.height, true, new OpenStreetMapProvider());
                                        _map.setCenterZoom(new Location(_initialLat, _initialLong), _initialZoom);
                                        mapCore();
                              private function mapCore():void
                                        _map.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelHandler);
                                        _mapUI = new UIComponent();
                                        _mapUI.addChild(_map);
                                        var zoomslider:ZoomSlider = new ZoomSlider(_map);
                                        zoomslider.x = mappanel.width - zoomslider.width*2;
                                        zoomslider.y = 30;
                                        _mapUI.addChild(zoomslider);
                                        var handcursor:HandCursor = new HandCursor(_map);
                                        _mapUI.addChild(handcursor);
                                        mappanel.addElement(_mapUI);
                              private function mouseWheelHandler(e:MouseEvent):void {
                                        if (e.delta < 0) {
                                                  _map.zoomOut();
                                        else if (e.delta > 0) {
                                                  _map.zoomIn();
                                        _mouseWheelZoomCenter = _map.getCenter();
                                        _mouseWheelZoom = _map.getZoom();
                    ]]>
          </fx:Script>
          <s:BorderContainer id="mappanel" width="100%" height="97%"/>
</s:Application>

Technically, it's Javascript, not Java :) TOTALLY different beasts. I wish they'd never named it Javascript, it's ambiguous. So anyway, on to the point of the whole thing...
If you want quotes in your values, you'll need to write a function to replace " with \", and pass the values through it. So instead of javascript:passBack('#ENAME#','#JOB#','#SAL#'); you would have javascript:passBack(addslashes('#ENAME#'),addslashes('#JOB#'),addslashes('#SAL#'));. That would mean that ABC"DEF"GH would be passed to the function as ABC\"DEF\"GH and your quotes would stay intact. Search around on the internet for more specifics as to how to pass double quotes in javascript by using backslashes.
~Jer

How to create a more interactive map with DW hotspot tool

Hi - I've been asked to put together a map for my client. I want to avoid getting into GMaps and all of that and just want to make a simple one myself. Here's an explanation of what I'm trying to do:
http://designerandpublisher.com/montrose/map.html
Just trying to create a simple map like you see above so that if they clicked on a state or a point in the state, a little pop-up window comes on like you see in many interactive map applications. Can someone help me figure out how to do this with DW's hotspot tool? I'm terrible with code but I do know it would probably start with something like onclick (I think that's what it is). But even if I get that onclick code working, I'm not even sure how to incorporate it into the <map> code that DW makes for the hotspot.
Any help is appreciated. Thanks.
PS - I use DW4 and also have access to 5.5 on another computer.

Here's another way you could do it but wil get very long. Also consider Kens tooltip - probably the easiest if you don't want a 'close button'
<!DOCTYPE HTML PUBLIC">
<html>
<head>
<meta http-equiv="charset=UTF-8">
<title>Map</title>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<style>
#map {
    width: 550px;
    height: 390px;
    margin: 0 auto;
    position: relative;
#nevada {
position: absolute;
top: 150px;
left: 50px;
background-color:#FFC;
padding: 15px;
display: none;
#nevada {
position: absolute;
top: 100px;
left: 50px;
background-color:#FFC;
padding: 15px;
display: none;
.close {
    position: absolute;
    display: inline-block;
    background-color:#903;
    color: #fff;
    text-decoration: none;
    padding: 6px;
    right: 0;
    top: 0;
h2 {
    margin: 0;
    padding: 0;
p {margin: 0;
padding: 0;
</style>
<script>
$(document).ready(function() {
$('.hide').hide();
$('.newMexico').click(function() {
$('#newMexico').show();
$('.nevada').click(function() {
$('#nevada').show();
$('.close').click(function() {
$('.hide').hide();
</script>
</head>
<body>
<div id="map">

<div class="hide" id="newMexico">
<a href="#" class="close">X</a>
<h2>New Mexico</h2>
<p>Some content about New Mexico</p>
</div>

<div class="hide" id="nevada">
<a href="#" class="close">X</a>
<h2>Nevada</h2>
<p>Some content about Nevada</p>
</div>
<img src="map.png" width="550" height="390" border="0" usemap="#Map">
<map name="Map">
<area shape="poly" coords="157,176,216,183,213,246,173,241,159,244,158,249,147,247,156,177" class="newMexico" href="#">
<area shape="poly" coords="64,91,118,105,105,180,99,176,96,190,52,131,64,92" class="nevada" href="#">
</map>
</div>
</body>
</html>

WD UI : interactive map

Hi
I have several input fields and drop down in my view , such that on click of search button , the appropriate details are fetched from the database .
Now , I want to do all this using " INTERACTIVE MAP " .
I want , a world map to be displayed in my view , and on click of any particular country , the user is directed to the appropriate details of that particular country .
How can I be able to do so , can any one direct me how to do it .
Thanks in advance .
regards ,
amit

Hi Amit,
You can go for google maps and you would need to consume google maps APIs in your application.
For more info on google maps APIs refer to the following link.
[http://code.google.com/apis/maps/|http://code.google.com/apis/maps/]
Since Google has flex based version of google maps you can use it in webdynpro.
There is a elearning available on SDN.
Regards
Anurag Chopra

Creating an interactive map, using buttons, help!?

Hi,
I am attempting to create an interactive map of the college I work at. I have created a button and when you click on the area, it displays info about the particular room or subject.
I am using Oject States for the room/subject info and when you press the button to select it, when the room info is displayed (as it should), but the button appears on the top of it.
I would also like to have a back/close button to go back the the original map.
Please help, I am new to this and would appreciate any help.
Thanks

To Bob Bringhurst,
Maybe you could show your workaround as a step by step approach
http://blogs.adobe.com/indesigndocs/2010/12/hot-spot-button-workaround -for-indesign-dig-pubs.html
Having also viewed this video on creating a tooltip.
Im still having problems after viewing the above video's to get Multi State Objects viewing correctly on the iPad.
This might resolve a problem for myself, and possibly others.
Regards
Vividi

Creating an interactive map?

I'm looking to make an interactive map that will do the following:
1) portions of the map will change from white to blue when scrolled over
2) will point towards a different link when different sections of the map are clicked on.
I've got #2 mostly figured out, but I need help getting the different regions of the map to change colors when highlighted. Can someone kindly help me with this?
thank you,
Anthony

One way would be to make each portion a twooframed movieclip with one frame having the white and the other having the blue. Use ROLL_OVER and ROLL_OUT event listeners to control which frame is displayed.

Can the iphone maps display more than one pin at the same time?

For example, on a recent trip to New York I preloaded bookmarks of all the places I wanted to visit into the iPhone Maps. I then wanted to see where they all were in relation to one another so I could decide which one to go to next (MOMA, Guggenheim, Metroplitan Museum of Art for example). Is it possible to have the map display them all at the same time?

DaVBMan wrote:
Are you sure about that Andrew. I see no option to toggle on all my bookmarked pins. I can pick one to show and it shows up. But if I pick another, the previous one will go away. Only doing a search for stuff in an area will Google Maps show multiple pins, but I see no way of making all your saved bookmarks show up.
Did it on mine just now but I also did a very small location here in Sacramento. Dropped a pin in 1 city, Bookmarked, Dropped a few others and bookmarked at least 6 cities in the general Sacramento area, zoomed out just a bit and saw 6 red Pins. Which are all bookmarked.
If I could snap a photo of my screen I would post it.

HT5557 Can I add an interactive map as a widget? So I can zoom in and out of the map pin?

I would like to add an interactive map as a widget to my ibook photos to show where the photo was taken. Is this possible or will I have to add a cropped image of the map?

Perhaps this will help:
iBooks Author: About HTML widget creation
Regards.

How to create interactive map in SAP Visual Business using SAP UI5 SDK

Hi,
Please tell me,
How to create interactive map in SAP Visual Business using SAP UI5 SDK.
Is it possible to create interactive map using VB Control in SAP UI5 SDK..?
if possible please any one let me know.

Hi folks, one question:
We have our development close moved and now it is earlier than originally planned.
That means that we maybe can't finish our convenient API and you have to wait till we will release it - early 2015 is planned.
But there is another option:
Currently we have a API based on json. The developer has to create json and to transfer it to the Visual Business control.
This interface is more used as a low level API and we are developing on top the more convenient one. So all the features are the same.
It will stay stable & compatible in the future and you can build on it.
Do you want to use this interface?
Then I will publish the documentation.
Let me know.
Thanks

Acrobat X Pro interactive Map/Dropdown fields

I create a variety of .pdfs for different purposes which are all related to the same parent (in this case a building on a site).
I now want to create an interactive map so that I can click the building (button, graphic shape or image etc) and be presented a collapsable list so that I can then select (from a list) the .pdf I am interested in (discipline specific) and open it in a new acrobat window. Each .pdf name in the dropdown list is to represent a separate .pdf file from the same or different network storage location (I am aware the file name(s)/location(s) must not change).
I have investigated Acrobat X Pro, Adobe Illustrator CS4 and Adobe InDesign CS4. I have decided to target Acrobat as Illustrator did not seem to allow linking and InDesign did not seem to allow List Boxes or Dropdowns for linking purposes. Also, I only wanted to create/manage one file (my interactive map)...my 'menu'...in graphical form...without going down the path of creating a web site.
Am I on the right track? Is this possible?
However, after adding the Dropdown field to my form (interactive pdf map), although it allowed any of the available list items to be selected, it DID NOT allow different actions for different list items!
I added two separate Open file actions (which could not be linked to the two separate list items)...one to open a pdf ffrom one location and the other to open a separate pdf from another location. When you click the field (button)...it just opens BOTH pdf files! Not what I wanted.
I would have thought that the very nature of a Dropdown list is to be able to select from a collapsable list and perform a specific action on that selection (after all, it does allow multiple similar actions, along with multiple different actions).
Can THIS be done?...in Acrobat?...in another Creative Suite application?

Thanks, but...I could not find a `combo box' field, and I have to ask why would I have to write custom code when the `dropdown' field is provided?
Why can't a different action be linked to a different list choice in a dropdown field?
If I want to perform a single action, then I would use a `single' button, but that's not what I want to do.

IPhoto 8.1 Garmin Oregon 550t map display problem

I am trying to view photos captured by a Garmin Oregon 550t in iPhoto. The locations shown on the map are wrong.
Further investigation of the previously reported problem with iPhoto 8.1 displaying incorrect location information in the map display reveals that the EXIF information captured by the Oregon 550t is unusual in that it captures the longitude as a large number of seconds with 0 minutes. e.g. Longitude: W 105° 0' 810.000116 as reported by EXIF Viewer.
This unusual format seems to throw off iPhoto.
Aperture interprets the data correctly reporting Longitude 105º 13' 30.000" W.
Has anyone else seen this problem?

I user EXIF viewer http://homepage.mac.com/aozer/EV/
This photos works fine in iPhoto and with Preview
Using EXIF viewer the GPS section of a working photo looks like:
Latitude: N 29° 52' 10.86
Longitude: E 31° 13' 0.48
Altitude: 48.00 m
Time (UTC): 08:36:21
GPS Status: Measurement In Progress
Geodetic Survey Data: WGS-84
The same photo in Preview shows:
Altitude: 48 m (157.5 ft)
Altitude Reference: above sea level
GPS Version: 2.2
Latitude: 29° 52' 10.86" N
Longitude: 31° 13' 0.48" E
Map Datum: WGS-84
Speed: 0
Speed Reference: Kilometers per hour
Status: A
Time Stamp: 08:36:21.00
The info you showed is in a different format - my photos work fine with iPhoto
What version of iPhoto '09 do you have (8.1 is the latest) - some earlier versions had some issues with some types of GPS data - I've not seen any such issues since 8.0.3 (I think)
LN

How do I create an interactive map?

How do I create an interactive map using digital publishing suite in InDesign? Basically it's an amusement park map and when you click on a button I want a description page of a ride to show that has interactivity on it and then it can be closed and another button on the map can be clicked to show another description page of a different ride. Is that possible?

Use a multi state object. Depending upon how many point of interest you want on that map it can get pretty involved.

No map display in Photoshop Elements 8.

I have Photoshop Elements 8 and wanted to use Map Display for the first time. I opened the Display tab and there was no Show Map Option. Calendar or Date View was there and other views but no Map View. What should I do to have a Map View?

The mapping capabilities were provided by Yahoo! which discontinued its mapping service, so PSE now doesn't support locating on maps.
Ken

Problem with interactive map....

Hi,
I made interactive map in Actionscript 2, but i have to link
it to the Mysql database by JavaScript.
Can i do it?
If yes than i will be happy for every posts.
If no, than please help me with this prob.
Thanks.

You can have Flash talk to MySQL without a problem, though
using JavaScript
would not be the best way. You can use the LoadVars class to
simply call a
server side script (php/asp/etc) or what I recommend is to
use AMFPHP, which
is just a lot more robust and faster. It's more work learning
to use it, but
once you do it's much better than LoadVars.
Dave -
www.offroadfire.com
Head Developer
http://www.blurredistinction.com
Adobe Community Expert
http://www.adobe.com/communities/experts/

Interactive map display

Similar Messages

Maybe you are looking for