image toekennen aan een linker en rechterkolom
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
$_SESSION['opdracht']
Array
(
[0] => 012b
[1] => 012aa
[2] => 012ab
[3] => 012ac
)
$_SESSION['lrij']
Array
(
[0] => 3
[1] => 0
[2] => 2
[3] => 1
)
$_SESSION['rrij']
Array
(
[0] => 1
[1] => 2
[2] => 0
[3] => 3
)
Array
(
[0] => 012b
[1] => 012aa
[2] => 012ab
[3] => 012ac
)
$_SESSION['lrij']
Array
(
[0] => 3
[1] => 0
[2] => 2
[3] => 1
)
$_SESSION['rrij']
Array
(
[0] => 1
[1] => 2
[2] => 0
[3] => 3
)
Het is de bedoeling dat het dan zo gekoppeld wordt met bijvoorbeeld een foreach.
linkerkolom en rechterkolom - image
Aan het nummer 3 en 1 - 012b
Aan het nummer 0 en 2 - 012aa
Aan het nummer 2 en 0 - 012ab
Aan het nummer 1 en 3 - 012ac
Ik heb het zo geprobeerd maar dat kan natuurlijk niet want dan worden niet de juiste images geplaatst.
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
$i=1;
foreach ($_SESSION['lrij'] as $lrij_image) {
$denod = $i - 1;
echo '<div class="node"><img src="img/groep12/combinatiespel/'.$_SESSION['opdracht'][$lrij_image].'.png" width="50" height="50" alt=""/>';
echo '<span class="node'.$i.'" data-connect="false" data-id="'.$denod.'" data-use="false" data-connected-to=""></span></div>';
$i++;
}
foreach ($_SESSION['lrij'] as $lrij_image) {
$denod = $i - 1;
echo '<div class="node"><img src="img/groep12/combinatiespel/'.$_SESSION['opdracht'][$lrij_image].'.png" width="50" height="50" alt=""/>';
echo '<span class="node'.$i.'" data-connect="false" data-id="'.$denod.'" data-use="false" data-connected-to=""></span></div>';
$i++;
}
Hopelijk is het zo duidelijk wat de bedoeling is.
Gewijzigd op 29/05/2020 15:52:04 door Sietsko Bos
Code (php)
1
2
3
4
2
3
4
foreach ($_SESSION['lrij'] as $i => $lrij_image) {
// image => $_SESSION['opdracht'][$i];
// rrij => $_SESSION['rrij'][$i];
}
// image => $_SESSION['opdracht'][$i];
// rrij => $_SESSION['rrij'][$i];
}
Maar je wilt niet dat de afbeeldingen elke keer in dezelfde volgorde staan wel? Daarom is het mogelijk een idee om de "links" en "rechts" arrays weer te sorteren op value, met behoud van de key-value associatie.
Heb je dus bijvoorbeeld:
Code (php)
1
2
3
4
2
3
4
0 => 3
1 => 0
2 => 2
3 => 1
1 => 0
2 => 2
3 => 1
Dan kun je hier met behulp van asort() het volgende van maken:
Code (php)
1
2
3
4
2
3
4
1 => 0
3 => 1
2 => 2
0 => 3
3 => 1
2 => 2
0 => 3
Vervolgens kun je de afbeeldingen op volgorde weergeven met behulp van:
Code (php)
1
2
3
4
5
2
3
4
5
<?php
foreach ($leftArray as $index => $node) {
// gebruik hier $index om de corresponderende afbeelding weer te geven
}
?>
foreach ($leftArray as $index => $node) {
// gebruik hier $index om de corresponderende afbeelding weer te geven
}
?>
Ik zie trouwens "opdracht" en "groep12" staan.
Zijn wij hier stap voor stap jouw huiswerk voor je aan het maken?
EDIT: dit was dus wederom een soort van sorteerprobleem en wederom bestond hier een eenvoudige functie voor waarmee je dit in 1x kunt tacklen. Als je nu de volgende keer eerst uitdenkt wat er functioneel zou moeten gebeuren en vervolgens ff op php.net zoekt naar functies die arrays kunnen manipuleren? :p
Gewijzigd op 29/05/2020 16:31:50 door Thomas van den Heuvel
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<div class="group1">
<div class="node"><img src="img/012aa.png" width="50" height="50" alt=""/><span class="node1" data-connect="false" data-id="0" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012ac.png" width="50" height="50" alt=""/><span class="node2" data-connect="false" data-id="1" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012ab.png" width="50" height="50" alt=""/><span class="node3" data-connect="false" data-id="2" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012b.png" width="50" height="50" alt=""/><span class="node4" data-connect="false" data-id="3" data-use="false" data-connected-to=""></span></div>
</div>
<div class="group2">
<div class="node"><img src="img/012ab.png" width="50" height="50" alt=""/><span class="node5" data-connect="false" data-id="0" data-use="false"></span></div>
<div class="node"><img src="img/012b.png" width="50" height="50" alt=""/><span class="node6" data-connect="false" data-id="1" data-use="false"></span></div>
<div class="node"><img src="img/012aa.png" width="50" height="50" alt=""/> <span class="node7" data-connect="false" data-id="2" data-use="false"></span></div>
<div class="node"><img src="img/012ac.png" width="50" height="50" alt=""/><span class="node8" data-connect="false" data-id="3" data-use="false"></span></div>
</div>
<div class="node"><img src="img/012aa.png" width="50" height="50" alt=""/><span class="node1" data-connect="false" data-id="0" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012ac.png" width="50" height="50" alt=""/><span class="node2" data-connect="false" data-id="1" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012ab.png" width="50" height="50" alt=""/><span class="node3" data-connect="false" data-id="2" data-use="false" data-connected-to=""></span></div>
<div class="node"><img src="img/012b.png" width="50" height="50" alt=""/><span class="node4" data-connect="false" data-id="3" data-use="false" data-connected-to=""></span></div>
</div>
<div class="group2">
<div class="node"><img src="img/012ab.png" width="50" height="50" alt=""/><span class="node5" data-connect="false" data-id="0" data-use="false"></span></div>
<div class="node"><img src="img/012b.png" width="50" height="50" alt=""/><span class="node6" data-connect="false" data-id="1" data-use="false"></span></div>
<div class="node"><img src="img/012aa.png" width="50" height="50" alt=""/> <span class="node7" data-connect="false" data-id="2" data-use="false"></span></div>
<div class="node"><img src="img/012ac.png" width="50" height="50" alt=""/><span class="node8" data-connect="false" data-id="3" data-use="false"></span></div>
</div>
Toevoeging op 29/05/2020 16:33:53:
@ Thomas: Zijn wij hier stap voor stap jouw huiswerk voor je aan het maken?
Nee hoor,is voor oefenwebsite primair onderwijs :)
Gewijzigd op 29/05/2020 16:31:21 door Sietsko Bos
Het is inmiddels gelukt en alles werkt nu zoals de bedoeling was, dank je Thomas :)
Ik kan wel controleren of de gemaakte verbindingen goed zijn of niet, ook kan ik laten zien welke verbindingen niet goed zijn. Wat ik nu nog niet voor elkaar krijg is:
Als een verbinding niet klopt wil ik later laten zien welke twee images niet goed waren.
Ik zal onder mijn arrays eens laten zien:
De sourcewaarde staat hier voor een image die ik haal uit:
Code (php)
1
$opdracht = array(111b, 111aa, 111ab, 111ac);
Dit is de array met de juiste verbindingen:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Array
(
[0] => Array
(
[source] => 0 // 111b
[target] => 0 // 111b
)
[1] => Array
(
[source] => 1 // 111aa
[target] => 3 // 111aa
)
[2] => Array
(
[source] => 2 // 111ab
[target] => 1 // 111ab
)
[3] => Array
(
[source] => 3 // 111ac
[target] => 2 // 111ac
)
)
(
[0] => Array
(
[source] => 0 // 111b
[target] => 0 // 111b
)
[1] => Array
(
[source] => 1 // 111aa
[target] => 3 // 111aa
)
[2] => Array
(
[source] => 2 // 111ab
[target] => 1 // 111ab
)
[3] => Array
(
[source] => 3 // 111ac
[target] => 2 // 111ac
)
)
Nadat de user de verbindingen heeft gemaakt krijg ik deze array terug:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Array
(
[0] => Array
(
[source] => 0
[target] => 0
)
[1] => Array
(
[source] => 1
[target] => 3
)
[2] => Array
(
[source] => 2
[target] => 2
)
[3] => Array
(
[source] => 3
[target] => 1
)
)
(
[0] => Array
(
[source] => 0
[target] => 0
)
[1] => Array
(
[source] => 1
[target] => 3
)
[2] => Array
(
[source] => 2
[target] => 2
)
[3] => Array
(
[source] => 3
[target] => 1
)
)
Zoals je ziet zijn de verbindingen 2 en 3 (target) niet juist.
Ik wil nu ook een array krijgen (van de user vebindingen) waar voor elke verbinding de images in staan, dus op deze manier:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Array
(
[0] => Array
(
[source_image] => 111b
[target_image] => 111b
)
[1] => Array
(
[source_image] => 111aa
[target_image] => 111aa
)
[2] => Array
(
[source_image] => 111ab
[target_image] => 111ac
)
[3] => Array
(
[source_image] => 111ac
[target_image] => 111ab
)
)
(
[0] => Array
(
[source_image] => 111b
[target_image] => 111b
)
[1] => Array
(
[source_image] => 111aa
[target_image] => 111aa
)
[2] => Array
(
[source_image] => 111ab
[target_image] => 111ac
)
[3] => Array
(
[source_image] => 111ac
[target_image] => 111ab
)
)
Mijn vraag is hoe dat kan, ik ben al een tijdje bezig maar krijg het niet voor elkaar.
Gewijzigd op 04/06/2020 08:48:40 door Sietsko Bos
Welke afbeeldingen voor de source en target op die positie staan staat hier in principe los van.
Sterker nog, deze is dus afleidbaar uit het $opdracht array en het voorlaatste array, maar het is dus niet per se nodig om hier (expliciet) een apart array voor te bouwen?
Ter verduidelijking: als je geen indexen specificeert in een array zoals $opdracht, dan worden deze vanaf 0 geïndexeerd.
Het volgende array:
Is dus precies hetzelfde als:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
$opdracht = array(
0 => '111b',
1 => '111aa',
2 => '111ab',
3 => '111ac',
);
?>
$opdracht = array(
0 => '111b',
1 => '111aa',
2 => '111ab',
3 => '111ac',
);
?>
(maar misschien dus nog wel even quotes toevoegen)
$opdracht kun je dus gebruiken in combinatie met / toepassen op het voorlaatste array om de bijbehorende afbeelding te vinden?
Ik krijg het niet voor elkaar om de juiste images te koppelen (voorlaatste array is de array die ik nu ook heb).
Ik begrijp alleen het koppelen van de indexen met de value niet.
De eerste array gaat ook goed en ik heb erachter gezet welk image dan gekoppeld wordt.
Maar dan de tweede array juist koppelen met het image lukt niet.
Ik heb het nu zo geprobeerd zonder een array (wat voor mij nog beter is want ik wil het zo in de database opslaan):
Code (php)
Maar hoe doe je dit nu zodat de target van de tweede array klopt met het juiste image?
Die zou er dus zo uit moeten zien: 322b 322aa 322ac 322ab
Gewijzigd op 05/06/2020 08:43:36 door Sietsko Bos
Ik zou dit alles (of op zijn minst: de koppelingen die de gebruiker legt) ook niet aan afbeeldingen ophangen, maar aan de volgnummers/indexen. Welke afbeelding hier bij hoort staat hier (nogmaals) los van (en is meer onderdeel van de "goede oplossing").
Als de volgorde van zowel de sources alsook de targets random is, dan zul je beide stukken informatie moeten opslaan, te meer als je deze "random volgorde" wilt vastleggen?
Overigens, als je uitgaat van het tweede array, komt dan de key van het subarray dan niet altijd overeen met de source-waarde? En zelfs als dit niet het geval is, zou je dit kunnen vereenvoudigen tot een array met een dimensie minder, waarbij je een mapping <source> => <target> maakt? Je kunt dit dus nog wel wat verder platslaan allemaal.
Bij het opstellen van bijbehorende datastructuren (vertalingen naar arrays) helpt het enorm als je alles zo simpel mogelijk houdt.
Uitgaande van de volgende opzet:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
/*
het volgende is dus equivalent met
$userData = array(
0 => 0,
1 => 3,
2 => 2,
3 => 1,
)
*/
$userData = array(0, 3, 2, 1);
/*
nota bene, als de sources ook een random volgorde hebben, zou je hier prima het volgende van kunnen maken:
$userData = array(1 => 3, 0 => 0, 3 => 1, 2 => 2);
of wat dan ook
*/
?>
/*
het volgende is dus equivalent met
$userData = array(
0 => 0,
1 => 3,
2 => 2,
3 => 1,
)
*/
$userData = array(0, 3, 2, 1);
/*
nota bene, als de sources ook een random volgorde hebben, zou je hier prima het volgende van kunnen maken:
$userData = array(1 => 3, 0 => 0, 3 => 1, 2 => 2);
of wat dan ook
*/
?>
Zou je zoiets kunnen doen:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
foreach ($userData as $source => $target) {
$sourceImage = $opdracht[$source];
$targetImage = $opdracht[$target];
// doe hier iets mee
// ...
}
?>
foreach ($userData as $source => $target) {
$sourceImage = $opdracht[$source];
$targetImage = $opdracht[$target];
// doe hier iets mee
// ...
}
?>
Maar nogmaals, ik zou de gegeven antwoorden niet als "afbeelding" opslaan, maar simpelweg als een volgnummer voor de geselecteerde afbeelding. Welke afbeelding dit is (en in welke volgorde deze staan) houd je ergens anders bij.
Vandaar ook dat ik het op de gevraagde manier probeerde op te lossen omdat het wel goed werkt met de scrpts.
Wel daargelaten of het op de juiste manier is gedaan....
Als er geen makkelijke oplossing is om de koppelingen te bewaren in de database dan moet ik dat laten varen. Wat ook een mogelijkheid is om iemand tegen betaling de scripts werkend te laten maken, cq om te bouwen.
De antwoorden komen van het script uit mijn andere vraag:
https://www.phphulp.nl/php/forum/topic/controleren-of-2-values-bestaan-in-een-array/103561/
Gewijzigd op 06/06/2020 11:59:38 door Sietsko Bos
We zijn al een heel eind hoor.
Natuurlijk is het ook mogelijk om het op te slaan zoals jij voorstelt, maar dat lijkt mij gewoon een stuk omslachtiger.
En als je het dan toch geserialiseerd wilt doen, maak dan gebruik van JSON ofzo, zodat je dat in één klap kunt inpakken en uitpakken (en gebruiken) via json_encode() en json_decode().
Lijkt me wel handiger omdat alles eigenlijk zover werkt en klaar is op deze code na.
Ik krijg de array al terug zoals jij voorstelde en die zet ik dan ook om naar php met json_decode().
Dat zijn dus de eerste array (mijn eigen waarvan de target random is), de source staat wel altijd in die volgorde.
En de tweede array die ik krijg nadat de user de verbindingen heeft gemaakt.
Ook is de optie die ik voorstelde voor mij wat makkelijker omdat ik dat zelf ook eenvoudiger kan aanpassen voor weer andere scripts.
Dus heb je een oplossing voor me... graag :)
Waar loop je precies op vast?
Het doorlopen van de user array en het koppelen van de target met het image.
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
foreach ($userData as $source => $target) {
$sourceImage = $opdracht[$source];
$targetImage = $opdracht[$target];
// doe hier iets mee
// ...
}
?>
foreach ($userData as $source => $target) {
$sourceImage = $opdracht[$source];
$targetImage = $opdracht[$target];
// doe hier iets mee
// ...
}
?>
Als ik het op deze manier zou doen dan gaat het niet kloppen omdat de waarde van de source en target de plaats aangeven en niet het image. Dus als ik dit heb:
0 - 0
1 - 1
2 - 2
3 - 3
Dan zou ik voor de linkerrij de images kunnen zetten (322b 322aa 322ab 322ac), maar voor de rechterrij is dat anders omdat de waarde dan een ander image heeft.
De waardes van de source en target geven dus de plaats van hetzelfde image aan, niet het image zelf..
Uitgaande van deze array:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Array
(
[0] => Array
(
[source] => 0
[target] => 0
)
[1] => Array
(
[source] => 1
[target] => 3
)
[2] => Array
(
[source] => 2
[target] => 2
)
[3] => Array
(
[source] => 3
[target] => 1
)
)
(
[0] => Array
(
[source] => 0
[target] => 0
)
[1] => Array
(
[source] => 1
[target] => 3
)
[2] => Array
(
[source] => 2
[target] => 2
)
[3] => Array
(
[source] => 3
[target] => 1
)
)
0 source is hetzelfde image als target 0
1 source is hetzelfde image als target 3
2 source is hetzelfde image als target 2
3 source is hetzelfde image als target 1
Hierbij is de target ook random dus die staan qwa waarde niet vast.
De source zetten met opdracht[$source] gaat wel goed maar dan....
Want de 3 target is niet hetzelfde als 3 source want 3 target zou opdracht[1] moeten zijn.
Gewijzigd op 07/06/2020 10:19:12 door Sietsko Bos
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<?php
foreach ($array as $data) {
$sourceImage = $opdracht[$data['source']];
$targetImage = $opdracht[$data['target']];
// ... et cetera ...
}
?>
foreach ($array as $data) {
$sourceImage = $opdracht[$data['source']];
$targetImage = $opdracht[$data['target']];
// ... et cetera ...
}
?>
$data is de value van het key-value paar van $array. In dit geval is dat dus een enkele rij / subarray. Dit is dus zelf ook weer een array dus kun je die ook als zodanig gebruiken. $data['source'] bevat de index van de bron-index/afbeelding en $data['target'] die van de doel-index/afbeelding. Beide indexen pas je toe op $opdracht om de bijbehorende afbeelding te vinden.
Misschien loont het de moeite om wat meer te oefenen met (geneste) arrays?
Maar er is in principe geen verschil tussen:
Ten opzichte van:
In die zin dat het ene array meer zinvolle informatie zou "transporteren" dan de ander, het is simpelweg een andere manier van verpakken.
Het is meestal handig om alles zo compact mogelijk te houden, zodat je later minder werk hebt aan "overhead" (source, target etc.) die je mogelijk anders zou hebben. De code die hierop werkt wordt dan ook langer zoals het bovenstaande fragment demonstreert, terwijl het functioneel precies hetzelfde doet.