✔ Realisierung: Koordinaten DB mit 2500 Feldern

A

Acriss

Gesperrt
Guten Abend :)

Ich programiere ein weiteres Browsergame, und natürlich möchte ich mich immer weiter verbessern :D

Ich stehe nun aber vor folgendem Problem:
Ich habe eine Karte von 50*50 Feldern, sprich also eine gesamt Größe von 2500 Feldern.
Man soll hier auf einem Feld sein Geschäft errichten können, und andere Geschäfte sehen.

Ich möchte nämlich, das man sich durch die Karte bewegen kann, also wenn man nach links klickt, sollen die nächsten Felder weiter links angewählt werden usw.

Meine Idee, die Datenbankabfrage in ein Javascript-array einzulesen, hat wohl das Problem, das mein Ansatz warscheinlich falsch ist xD
[x][y][z]
x => x_koordinate
y => y_koordinate
z => name|art der Einrichtung

50^3 = 125.000, da ich das ganze mit 3 forschleifen einlesen werde.
Dadurch würde das Script eine ziemlich lange (sogar ZU lange) Ladezeit besitzen :(

Meine Idee, die Daten in eine Textdatei einzuspeichern, scheitert daran, das man mit js keine Dateien öffnen kann ;)

Wie kann ich das Problem umgehen?
-Kommt mir jetzt bitte nicht mit weniger Feldern^^
Denn bei geplanten (mind) 1k-2k Usern, wo jeder 10 "Häusle" bauen kann, kommt man schnell mal auf 2000 "Häusle".
 
Zuletzt bearbeitet:
Ah genau xD
Erstmal, danke, mit einer so schnellen Antwort hab ich ehrlich gesagt gar nit gerechnet.
Ich hatte vergessen zu notieren, das ich Null Ahung von Ajax habe :(
Ich habe mich schon öfter nach Tutorials umgeschaut, aber allein das erste Script, um zu prüfen ob Ajax anwendbar ist, war sehr abschreckend.
Wenn kein Weg an Ajax vorbeiführt, Dauert es lange, den entsprechenden Teil zur "offenen" DB-Verbindung zu lernen?

**edit**
Ich habe mir gerade nochmal ein paar Seiten zum Thema Ajax angeguckt, und muss gestehen,
es ist zu schwer^^

Ich bin bei vielen neuen Sprachen gewohnt, erstmal einfache Sachen, wie <html></html> oder <?php echo 'Hello World'; ?> zu lesen.
Anstelle von
Code: 
var xmlhttp=false;

if (!xmlhttp && typeof XMLHttpRequest!='undefined')  {
     xmlhttp = new XMLHttpRequest();
}

function ajax_call() {
     xmlhttp.open("GET", 'ajaxWork.php?num1=' +
           document.getElementById('num1').value +
                '&num2=' + document.getElementById('num2').value , true);

     xmlhttp.onreadystatechange=function() {
           if (xmlhttp.readyState==4) {
                 document.getElementById('result').value = xmlhttp.responseText;
           }
     }

xmlhttp.send(null)
return false;
}
Also für Anfänger würde ich das nicht nehmen xD
 
Zuletzt bearbeitet:
Die grundlegende Frage: Warum sollen alle Felder auf ein Mal eingelesen werden?
Geht es um eine Karte? Wie wäre es mit einer 5 x 5 Karte um das momentane Feld herum? Mit Richtungspfeilen könnte man dann zum nächsten Rasterfeld wechseln. Das wären im Falle von 5 x 5 Feldern immerhin nur 25 Ergebnisse in einem Schritt, hoch drei bei deiner Organisation 15625 reelle Daten. Das ganze kann man aber auch sinnvoller organisieren, indem man zB die linke obere Koordinate übergibt, sowie sämtliche Namen in einer geordneten Liste. Anhand dieser Angaben kann man dann sämtliche Angaben dynamisch regenerieren über Javascript, oder auch "statischer" via PHP ausgeben.

Schreib doch einfach
Code: 
/* Javascript Start */
...
/* Javascript End */
;)
 
Hmm
danke für die schnelle Antwort^^
Also, ich bin doch schon ein Stück weiter, zwar nicht alles verstanden, aber es funktioniert^^

Ich habe nur noch ein Problem:
HTML: 
onclick="macheRequest('test.html?x='+document.getElementbyId('x').value+'&y='+document.getElementById('y').value+'');">

Ich möchte jetzt Parameter an das PHP Script übergeben, doch es klappt leider nicht^^
die beiden getElementy greifen auf 2 input Felder zu.

*nochmal edit
Ich habe das nochmal etwas umgeschrieben, und jetzt sieht es so aus;
HTML: 
<script type="text/javascript" language="javascript">

    var http_request = false;

    function macheRequest(url) {

        http_request = false;

        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
                // zu dieser Zeile siehe weiter unten
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Ende :( Kann keine XMLHTTP-Instanz erzeugen');
            return false;
        }
        http_request.onreadystatechange = alertInhalt;
        http_request.open('GET', url+'?x='+document.getElementbyId('x').value+'&y='+document.getElementById('y').value, true);
        http_request.send(null);

    }

    function alertInhalt() {

        if (http_request.readyState == 4) {
            if (http_request.status == 200) {
                alert(http_request.responseText);
            } else {
                alert('Bei dem Request ist ein Problem aufgetreten.');
            }
        }

    }
</script>
<input type="text" id="x" />
<input type="text" id="y" />
<span
    style="cursor: pointer; text-decoration: underline; color: blue"
    onclick="macheRequest('test.html');">Einen Request absetzen
</span>
test.html
PHP: 
<?php
include("functions.php");
$select = mysql_query("SELECT * FROM Koordinaten WHERE x_koord = '".$_GET['x']."' AND y_koord = '".$_GET['y']."'");
$result = mysql_fetch_array($select);
echo $result[1];
echo $result[2];
?>

Es erfolgt überhaupt keine Ausgabe nach dem klick auf den <span>

maeTimmae hat gesagt.:
Die grundlegende Frage: Warum sollen alle Felder auf ein Mal eingelesen werden?
Geht es um eine Karte? Wie wäre es mit einer 5 x 5 Karte um das momentane Feld herum? Mit Richtungspfeilen könnte man dann zum nächsten Rasterfeld wechseln. Das wären im Falle von 5 x 5 Feldern immerhin nur 25 Ergebnisse in einem Schritt, hoch drei bei deiner Organisation 15625 reelle Daten. Das ganze kann man aber auch sinnvoller organisieren, indem man zB die linke obere Koordinate übergibt, sowie sämtliche Namen in einer geordneten Liste. Anhand dieser Angaben kann man dann sämtliche Angaben dynamisch regenerieren über Javascript, oder auch "statischer" via PHP ausgeben.

Schreib doch einfach
Code: 
/* Javascript Start */
...
/* Javascript End */
;)
Zum Vergrößern anklicken....

Genauso ist es ja auch gedacht, nur möchte ich nicht immer "reloaden" ;)
 
Würde es dennoch als Fallback einsetzen - Nicht jeder browst mit aktiviertem JavaScript (und ein Request findet auch immer statt, egal ob nun über direkte Ausgabe oder ein Request durch die Hintertür).
Hierzu kannst du ein Konstrukt in der Art benutzen:
Code: 
<a onclick="doSomething(); return false" href="/fallback/link.php?x=123&y=456">( 123 | 456 )</a>

Zur Lösung deines Problems kannst du einfach mal überprüfen, was für ein Request abgesetzt wird:
Code: 
alert( 'test.html?x=' + document.getElementbyId('x').value + '&y=' + document.getElementById('y').value );
Kann es weiterhin sein, dass du den Request nicht weiter behandelst, sondern ihn einfach nur absetzt?
 
nein, das kann nicht sein,
Denn wenn ich das ohne getElement... mache, also die Werte direkt eintrage, wird mir das richtige Ergebnis aus der Datenbank zurückgegeben.
Ich habe es schon mit Konstruktionen a lá
PHP: 
var x = "?x="+document.getElementbyId("x").value; // *markiert*
var y = "&y="+document.getElementById("y").value;
ganzeurl = url+x+y;
http_request.onreadystatechange = alertInhalt;
http_request.open('GET', url, true);
Aber der Fehler liegt dann irgendwo in der markierten Zeile, wenn ich die auskommentiere, läuft das Script weiter.

Und die Edit sagt:
Ok, ich habe es jetzt gelöst :)
Er mochte ja nicht die Variablen in der Funktion, deswegen hab ichd as ganze Script ein bisschen umgeschrieben:

PHP: 
<script type="text/javascript" language="javascript">

    var http_request = false;

    function macheRequest(url) {

        http_request = false;

        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
                // zu dieser Zeile siehe weiter unten
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Ende :( Kann keine XMLHTTP-Instanz erzeugen');
            return false;
        }
        http_request.onreadystatechange = alertInhalt;
        http_request.open('GET', url, true);
        http_request.send(null);

    }

    function alertInhalt() {

        if (http_request.readyState == 4) {
            if (http_request.status == 200) {
                alert(http_request.responseText);
            } else {
                alert('Bei dem Request ist ein Problem aufgetreten.');
            }
        }

    }
// Diese Funktion ist neu
function url()
	{
         ganzeurl = "test.php?x="+document.getElementById('x').value+"&y="+document.getElementById('y').value;
         return ganzeurl;
         }
</script>
<input type="text" id="x" />
<input type="text" id="y" />
<span
    style="cursor: pointer; text-decoration: underline; color: blue"
    onclick="macheRequest(url());">Einen Request absetzen
</span>

danke für Eure Hilfe :)
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück