Landkarte mit Pinmarks

[Zervesa]

Hallo,

Ich such nun im Netz schon eine weile nach Tutorials, finde dazu aber leider nichts.

Ich betreibe eine Gildenseite zu einem Spiel, und möchte dort gerne eine Landkarte einfügen mit der man mithilfe von Pinmarks Markieren kann wo sich etwas auf dieser Karte befindet.

Könnte mir jemand einen Tipp geben wie sowas am besten realisierbar ist?

Danke euch!

[Wanderratte]

Hallo,

die Frage ist hier, soll es für jeden User individuell sein oder soll jeder User die die Punkte sehen?
Beim Ersteren könntest du mit SharedObject (Suche mal in der Hilfe nach: SharedObject) arbeiten allerdings kannst du damit nicht viele Daten speichern.
Beim Zweiten wirds schon schwierig ohne XML wo die Punkte, Koordinaten usw. drin stehen ist da nichts zu machen.
Allerdings brauchst du bei beiden Versionen gute AS-Kenntnisse.

[Zervesa]

DIe Karte befindet sich hier:

http://www.dark-falls.de/forumpics/guide/Landkarte.html

Und ich möchte oder suche einfach etwas um die Karte beschriften zu können und bei nicht bedarf wieder entfernen zu können, ohne sie jedesmal mit Photoshop bearbeiten zu müssen.

Das wollte ich irgendwie mit Pinmarks oder einfachen Marks hinbekommen, das wenn man mit der Maus drüber fährt eine Info angezeigt wird.

[Wanderratte]

Hallo,

ich habe dir schnell mal ein Beispiel gemacht, ich denke damit kannst du Arbeiten

[Zervesa]

Ah genial danke dir sowas hab ich gesucht

Nur 1 Frage noch, ist es auch möglich eine Box anzeigen zu lassen in der ein Bild der Location drin ist? Und noch etwas Infotext!?

[Wanderratte]

Ja sicher ist das Möglich, du brauchst doch nur die Objekt zu erweitern:
So ist der Aufrauf aus der Bibliothek raus (Verknüpfung)

btn_obj.punkt_1 = {target:punkt_1,inhalt:"Dein Text für den Punkt 1",pic:"deinBild"}; 

falls du es extern einladen willst, musst du es so schreiben

btn_obj.punkt_1 = {target:punkt_1,inhalt:"Dein Text für den Punkt 1",pic:"pics/deinBild.jpg"}; 

und diesen Musst du dann so erweitern:

for(var i in btn_obj){
    
    var obj = btn_obj[i].target
    obj.inhalt = btn_obj[i].inhalt;
    obj.pic = btn_obj[i].pic;
    obj.onRollOver = function(){
        this.gotoAndStop("over")
        this.inhalt_txt.text = this.inhalt;
        //aus der Bibliothek 
        this.bildContainer.attachMovie(this.pic)
        //extern
        this.bildContainer.loadMovie(this.pic)
    }
    obj.onRollOut = obj.onReleaseOutside = function(){
        this.gotoAndStop("out")
    }
    
} 

die einzelnen MC erweiterst du um einen leeren Container mit den Instanznamen: bildContainer;
Die Schrift formatieren kannst du mit ein paar HTML-Tags dafür schaue dir mal die Textklasse in Flash genau an.
Das Dingen ist ein Beispiel was ich auf die schnelle gemacht habe, du kannst es beliebig erweitern mit Effekte usw. allerdings immer unter der Bedingung, dass du AS kannst.

[Zervesa]

Ok danke dir ich werd mich mal reinarbeiten, hab das lange nicht mehr gemacht wird ne weile dauern.

[Zervesa]

Ich habe das ganze nun so gemacht, die Tooltips selbst:

tindrem.setToolTip("Stadt: Tindrem / City Guards vorhanden", 90, 0x0066CC, 100);
fabernum.setToolTip("Stadt: Fabernum / City Guards vorhanden", 90, 0x0066CC, 100);
meduli.setToolTip("Stadt: Meduli / City Guards vorhanden", 90, 0x0066CC, 100);
vadda.setToolTip("Stadt: Vadda / City Guards vorhanden", 90, 0x0066CC, 100);
bakti.setToolTip("Stadt: Bakti / City Guards vorhanden", 90, 0x0066CC, 100);
mohki.setToolTip("Stadt: Moh-Ki / City Guards vorhanden", 90, 0x0066CC, 100);
morinkhur.setToolTip("Stadt: Morin Khur / City Guards vorhanden", 90, 0x0066CC, 100);
toxai.setToolTip("Stadt: Toxai / City Guards vorhanden", 90, 0x0066CC, 100);
kranesh.setToolTip("Rote Stadt: Kranesh / City Guards nicht vorhanden", 90, 0xCC0000, 100);
cavecamp.setToolTip("Rotes Camp: Cavecamp / City Guards nicht vorhanden", 90, 0xCC0000, 100);
gaulkor.setToolTip("Rote Stadt: Gaul Kor / City Guards nicht vorhanden", 90, 0xCC0000, 100);
quest.setToolTip("Sunken Island, eine alte PVP Insel mit Keep Bauplatz",90,0x009900,100);
wolf1.setToolTip("Normale Wölfe",90,0x000000,100);
wolf2.setToolTip("Normale Wölfe",90,0x000000,100);
dualwolf1.setToolTip("Normale Wölfe, Dire Wolfes",90,0x000000,100);
dualwolf2.setToolTip("Normale Wölfe, Dire Wolfes",90,0x000000,100);

Und den Basecode:

MovieClip.prototype.setToolTip = function(msg:String, opac:Number, cl:Number, maxw:Number) {
	var depth = this._parent.getNextHighestDepth();
	if (this.DCToolTip) depth = this.DCToolTip.getDepth();
	this.DCToolTip = this._parent.createEmptyMovieClip("dctooltip" + int(Math.random() * 10000), depth);
	this.DCToolTip._x = this._xmouse + this._x;
	this.DCToolTip._y = this._ymouse + this._y;
	this.DCToolTip.owner = this;
	with(this.DCToolTip) {
		createTextField("tiptxt", 1, 1, 1, 10, 10);
		tiptxt.autoSize = true;
		if (maxw != undefined) {
			tiptxt._width = maxw;
			tiptxt.multiline = true;
			tiptxt.wordWrap = true;
		} else {
			tiptxt.multiline = false;
			tiptxt.wordWrap = false;
		}
		tiptxt.selectable = false;
		//tiptxt.multiline = true;
		tiptxt.embedFonts = true;
		var tf:TextFormat = new TextFormat();
		tf.font = "ToolTipFont";
		tf.size = 11;
		tiptxt.text = msg;
		tiptxt.setTextFormat(tf);
		var w = tiptxt.textWidth + 5;
		var h = tiptxt.textHeight + 7;
		lineStyle(1, 0, 100);
		beginFill(cl, opac);
		moveTo(0, 0);
		lineTo(w, 0);
		lineTo(w, h);
		lineTo(0, h);
		lineTo(0, 0);
		_visible = false;
		_alpha = 0;
		adest = 0;
	}
	this.DCToolTip.onEnterFrame = function() {
		var w = this.owner._width;
		var h = this.owner._height;
		if (this.owner._xmouse > 0 && this.owner._xmouse < w && this.owner._ymouse > 0 && this.owner._ymouse < h) {
			this.adest = 100;
			this._visible = true;
		} else {
			this.adest = 0;
		}
		this._alpha += (this.adest - this._alpha) / 3;
		if (this.adest == 0 && this._alpha < 1) {
			this._alpha = 0;
			this._visible = false;
		} else {
			var dx = this.owner._x + this.owner._xmouse;
			var dy = this.owner._y + this.owner._ymouse - this._height;
			var x = this._x;
			var y = this._y;
			x += (dx - x) / 2;
			y += (dy - y) / 2;
			this._x = Math.round(x);
			this._y = Math.round(y);
		}
	}
}

// ToolTip entfernen:

MovieClip.prototype.removeToolTip = function() {
	if (this.DCToolTip) this.DCToolTip.removeMovieClip();
}

Wie kann ich es den bewerkstelligen das mir im Tooltip selbst noch ein Bild angezeigt wird neben dem Text? Oder wie kann ich den Text speziell noch formatieren?



Bzw. wenn ich es mit deinem Code mache Wanderratte wie müssen den die Bildpfade lauten wenn ich es extern einlade oder direkt von der Bibliothek?