testmap ti.map

alloy.js

// The contents of this file will be executed before any of
// your view controllers are ever executed, including the index.
// You have access to all functionality on the `Alloy` namespace.
//
// This is a great place to do any initialization for your app
// or create any global variables/functions that you'd like to
// make available throughout your app. You can easily make things
// accessible globally by attaching them to the `Alloy.Globals`
// object. For example:
//
// Alloy.Globals.someGlobalFunction = function(){};

Alloy.Globals.Map = require('ti.map');

config.json

{
	"global": {},
	"env:development": {},
	"env:test": {},
	"env:production": {},
	"os:android": {},
	"os:blackberry": {},
	"os:ios": {},
	"os:mobileweb": {},
	"os:windows": {},
	"dependencies": {}
}

controllers_index.js

$.mapView.addEventListener('click', function(e) {	
	if (e.clicksource == 'rightButton') {
		alert(JSON.stringify(e.annotation));
	}
});

var rows = [];
var pinColor = Alloy.Globals.Map.ANNOTATION_RED;

var lat = 49.1234;
var lon = 8.1234;

for(var i=1,j=25; i<j; i++) {
	
  if ((i % 2) == 0) {
  	pinColor = Alloy.Globals.Map.ANNOTATION_RED;
  } else {
  	pinColor = Alloy.Globals.Map.ANNOTATION_GREEN;
  }
  
  rows.push(Alloy.Globals.Map.createAnnotation({
		latitude:lat + i * 0.100,
		longitude:lon + i * 0.200,
		title:'Title ' + i,
		subtitle:'Subtitle ' + i,
		myid:i,
		pincolor:pinColor,
		rightButton:Ti.UI.iPhone.SystemButton.INFO_LIGHT,
  	}));
}

$.mapView.removeAllAnnotations();
$.mapView.addAnnotations(rows);

$.homeTabs.open();

styles_app.tss

/*

This is your global styles file. Selectors and rules you define
here will be applied throughout your app. However, these rules
have the lowest priority of any style settings.

For more information, see the "Style Priorities" section of
http://docs.appcelerator.com/platform/latest/#!/guide/Alloy_Styles_and_Themes

For example, the following would apply to all labels, windows,
and text fields (depending on platform) in your app unless you
overrode the settings with other TSS, XML, or JS settings:

'Label[platform=android,windows]': {
	color: '#000' // all platforms except Android and Windows default to black
}

'Window': {
	backgroundColor: '#fff' // white background instead of default transparent or black
}

'TextField[platform=android]': {
	height: Ti.UI.SIZE
}

*/

styles_index.tss

".container": {
	backgroundColor:"white"
}

"Label": {
	width: Ti.UI.SIZE,
	height: Ti.UI.SIZE,
	color: "#000"
}

"#label": {
	font: {
		fontSize: 12
	}
}

tiapp.xml

<?xml version="1.0" encoding="UTF-8"?>
<ti:app xmlns:ti="http://ti.appcelerator.org">
    <id>com.pebosi.testmap</id>
    <name>testmap</name>
    <version>1.0</version>
    <publisher>boden</publisher>
    <url>http://pebosi.net</url>
    <description/>
    <copyright>2015 by pebosi</copyright>
    <icon>appicon.png</icon>
    <fullscreen>false</fullscreen>
    <navbar-hidden>false</navbar-hidden>
    <analytics>true</analytics>
    <property name="ti.ui.defaultunit" type="string">dp</property>
    <ios>
        <plist>
            <dict>
                <key>UISupportedInterfaceOrientations~iphone</key>
                <array>
                    <string>UIInterfaceOrientationPortrait</string>
                </array>
                <key>UISupportedInterfaceOrientations~ipad</key>
                <array>
                    <string>UIInterfaceOrientationPortrait</string>
                    <string>UIInterfaceOrientationPortraitUpsideDown</string>
                    <string>UIInterfaceOrientationLandscapeLeft</string>
                    <string>UIInterfaceOrientationLandscapeRight</string>
                </array>
                <key>UIRequiresPersistentWiFi</key>
                <false/>
                <key>UIPrerenderedIcon</key>
                <false/>
                <key>UIStatusBarHidden</key>
                <false/>
                <key>UIStatusBarStyle</key>
                <string>UIStatusBarStyleDefault</string>
            </dict>
        </plist>
    </ios>
    <android xmlns:android="http://schemas.android.com/apk/res/android"/>
    <mobileweb>
        <precache/>
        <splash>
            <enabled>true</enabled>
            <inline-css-images>true</inline-css-images>
        </splash>
        <theme>default</theme>
    </mobileweb>
    <modules>
        <module platform="iphone">ti.map</module>
        <module platform="android">ti.map</module>
    </modules>
    <deployment-targets>
        <target device="android">true</target>
        <target device="ipad">true</target>
        <target device="iphone">true</target>
        <target device="mobileweb">false</target>
        <target device="windows">false</target>
    </deployment-targets>
    <sdk-version>5.1.1.GA</sdk-version>
    <plugins>
        <plugin version="1.0">ti.alloy</plugin>
    </plugins>
</ti:app>

views_index.xml

<Alloy>
	<TabGroup id="homeTabs" barColor="#D40026" navTintColor="#FFFFFF">
		<Tab id="tabMap" title="Karte">
			<Window title="Karte">
				<View id="mapView" module="ti.map"></View>
			</Window>
		</Tab>
	</TabGroup>
</Alloy>