Bonjour ,
je ne sais pas si c'est le bon forum pour poser ma question mais comme il y'a du jquery..

voila , j'ai suivi ce très bon tuto

"Afficher des markers via une base de données mysql sur une carte en utilisant Google Maps API, JavaScript et PHP"

http://www.domagojsalopek.com/Detail...API-and-PHP/22

ça tourne bien , pas de problème, sauf que lorsque j'ai un accent sur un des caractères stocké dans l'un des champs de ma table, il me renvoie comme valeur "null". alors que pour les champs ou il n'ya pas d'accent cela affiche dans l'infobulle de la carte google le bon texte.

je sais que jquery et json ne fonctionne qu'avec de l'utf8 et donc ma base de donnée et mes tables sont en utf8

dans ma connexion à la base j'ai fait un "SET NAMES utf8"

mes pages sont en charset utf8 , j'ai ajouté un
Code : Sélectionner tout - Visualiser dans une fenêtre à part
header('Content-Type: text/html; charset=utf-8');
pour forcer le tout on sait jamais

bref je suis partout en utf8 mais rien à faire json_encode me renvois toujours la valeur "null"

voici les codes
le sql
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
CREATE TABLE `locations` (
    `id` INT(10) NOT NULL AUTO_INCREMENT,
    `name` VARCHAR(150) NOT NULL,
    `address` VARCHAR(255) NOT NULL,
    `lat` FLOAT(10,6) NOT NULL,
    `lon` FLOAT(10,6) NOT NULL,
    `description` TEXT NOT NULL,
    PRIMARY KEY (`id`)
)
COLLATE='utf8_general_ci'
le javascript

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
function makeRequest(url, callback) {
    var request;
    if (window.XMLHttpRequest) {
        request = new XMLHttpRequest(); // IE7+, Firefox, Chrome, Opera, Safari
    } else {
        request = new ActiveXObject("Microsoft.XMLHTTP"); // IE6, IE5
    }
    request.onreadystatechange = function() {
        if (request.readyState == 4 && request.status == 200) {
            callback(request);
        }
    }
    request.open("POST", url, true);
    request.send();
}
 
 
var geocoder = new google.maps.Geocoder();
var infowindow = new google.maps.InfoWindow();
 
function init() {
 
 
 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
 
    makeRequest('get_locations.php', function(data) {
 
        var data = JSON.parse(data.responseText);
 
        for (var i = 0; i < data.length; i++) {
            displayLocation(data[i]);
        }
    });
}
		function displayLocation(location) {
 
            var content = 	'<div ><strong>' 	+ location.name + '</strong>'
							 + '<br/>' 	+ location.address
                            + '<br/>' 	+ location.description + '</div>';
 
    if (parseInt(location.lat) == 0) {
        geocoder.geocode( { 'address': location.address }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
 
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location,
                    title: location.name
                });
 
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.setContent(content);
                    infowindow.open(map,marker);
                });
            }
        });
    } else {
        var position = new google.maps.LatLng(parseFloat(location.lat), parseFloat(location.lon));
        var marker = new google.maps.Marker({
            map: map,
            position: position,
            title: location.name
        });
 
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.setContent(content);
            infowindow.open(map,marker);
        });
    }
}
le php qui gère l'affichage des données stockés dans la table avec un json_encode

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
 
    require 'config.php';
 
    try {
 
        $db = new PDO($dsn, $username, $password);
        $db->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
 
        $sth = $db->query("SELECT * FROM locations");
        $locations = $sth->fetchAll();
 
        echo json_encode( $locations );
 
    } catch (Exception $e) {
        echo $e->getMessage();
    }

et l'html qui affiche la map google

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
 
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Google Maps Example</title>
        <style type="text/css">
            body { font: normal 14px Verdana; }
            h1 { font-size: 24px; }
            h2 { font-size: 18px; }
            #sidebar { float: right; width: 30%; }
            #main { padding-right: 15px; }
            .infoWindow { width: 220px; }
        </style>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
        //<![CDATA[
 
        var map;
 
        // Chichilianne is back in town
var center = new google.maps.LatLng(44.817159,5.571728);
 
        function init() {
 
            var mapOptions = {
                zoom: 13,
                center: center,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
 
            map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
 
            var marker = new google.maps.Marker({
                map: map,
                position: center,
            });
        }
        //]]>
        </script>
    </head>
    <body onload="init();">
 
 
 
        <section id="main">
            <div id="map_canvas" style="width: 70%; height: 500px;"></div>
        </section>
 
    </body>
</html>
si quelqu'un a une piste car je ne suis dans le brouillard le plus épais pour faire tourner ce tuto avec des données textes en français et nos merveilleux caractère "ééé" et autre" ààà".

merci