VOUS AVEZ OUBLIÉ VOS IDENTIFIANTS ?

UMAP permet de créer librement des cartes interactives personnalisées sur des fonds OpenStreetMap.

Avec UMAP vous pouvez valoriser un territoire, préparer un évènement, raconter vos vacances, tracer des parcours de randonnée, etc.

Les outils proposés comme la création de cartes, de couches, de points, le dessins, de polygones, de lignes, l'import de données, l'édition des cartes... permettent un travail de tracé précis.

UMAP est un logiciel libre, ou open source. Cela signifie que son code peut être utilisé, copié et modifié par tous.

Avec UMAP, on peut :

  • Choisir les fonds de carte
  • Ajouter des marqueurs, lignes, polygones...
  • Choisir la couleur et les icônes
  • Gérer les options de la carte : afficher une minicarte, géolocaliser l'utilisateur...
  • Importer des données géographiques en masse (geojson, gpx, kml, osm...)
  • Choisir la licence de vos données
  • Exporter et partager votre carte

Tutoriel et ressources pour création de cartes personnalisées

Réalisation de la cartographie

1. Se rendre sur le site UMAP ;

2. Cliquer sur l’icône OpenStreetMap et créer son compte (adresse mail, mot de passe, etc.),

ou entrer les informations ci-dessous :

  • Nom : formationSC
  • Mot de passe : formationsc13

Se connecter

Autoriser l'accès

3. Revenir sur le site UMAP


Créer une carte

Cliquer en haut à droite sur « Créer une carte ». S’affiche alors un fond de carte (que l’on peut changer, en cliquant sur la sixième icône à droite, représentant une pile de feuilles). Par défaut, c’est un fond OpenStreetMap.

Enregistrer la carte à créer :

En haut s’affiche la mention « édition en cours » suivie de « Carte sans nom » (en bleu).

En passant la souris sur cette phrase, un crayon apparaît : cliquer dessus, ce qui fait apparaître une fenêtre à droite « éditer les propriétés de la carte ».

Préciser le nom, sa description. (ces paramètres peuvent être modifiés ultérieurement).

Pour une présentation de la carte sur un panneau latéral à droite, cliquer sur “option d’interface” descendre jusqu’a “Voulez-vous afficher un panneau latéral au chargement?” et choisir “légende”.

Cliquer en haut à droite sur le bouton bleu « Enregistrer » (opération à faire impérativement à chaque modification, pour ne rien perdre du travail fait) .


Vue de la carte avec l'éditeur.

plan1


Légendes des diverses icônes


Placer des marqueurs

Pour trouver un emplacement précis :

À gauche, cliquer sur l’icône "loupe".

Une fenêtre s'ouvre sur la droite;

Indiquer une localité, sous la forme « Marseille » ou être même plus précis : « Estaque gare, Marseille » ;

la carte se centre, mais sans avoir de repère : on doit alors zoomer pour savoir où est l’adresse en question.

Placer des repères

1. Faire apparaître les icônes d’outils à droite : cliquer sur le carré en haut à droite comportant un crayon ;

2. Cliquer sur l'icône (en forme de goutte d’eau inversée) ;

3. Déplacer la souris et cliquer à l’endroit voulu ;

4. On peut donner des renseignements à ce marqueur. Il suffit de cliquer dessus, ce qui fait apparaître une fenêtre de paramétrage.

Aller sur "Propriété de la forme",  ou l'on trouve un choix de couleur, de forme et d'image de l'icône.

Option de la carte :

Comment avoir le contenu de chaque marqueur sur un panneau latéral à droite ?

Sur le menu à droite, cliquer sur l'engrenage, puis sur "option d'interaction par défaut".

Dans style de pop-up, dérouler le menu et choisir "panneau latéral"

Editeur d'un élément (ici, marqueur du tunnel de la nerthe)

plan3


Mise en forme du texte

  • *simple astérisque pour italique* - Exemple : *mot*
  • **double astérisque pour gras** - Exemple : **mot**
  • # un dièse pour titre 1 - Exemple : # titre1
  • ## deux dièses pour titre 2 - Exemple : ## titre2
  • ### trois dièses pour titre 3 - Exemple : ### titre3
  • Lien simple: [[https://exemple.fr]] - Exemple : [[https://ancrages.org]]
  • Lien avec texte: [[http://exemple.fr|texte du lien]] - Exemple : [[https://ancrages.org|Site internet d'Ancrages]]
  • Image: {{http://image.url.com}} - Exemple : {{https://ancrages.org/nomdelimage.jpg}}
  • Image avec largeur (en pixels) : {{http://image.url.com|largeur}} - Exemple : {{https://ancrages.org/nomdelimage.jpg|300}}
  • Iframe (Cadre qui permet d'obtenir une page d'un site internet, intégrée dans la page courante) : {{{http://iframe.url.com}}} - Exemple : {{{http://nomdusite.com}}}
  • Iframe avec hauteur (en pixels): {{{http://iframe.url.com|hauteur}}} - Exemple : {{{http://nomdusite.com|300}}}
  • Iframe avec hauteur et largeur (en px): {{{http://iframe.url.com|height*width}}} - Exemple : {{{http://nomdusite.com|800*300}}}
  • --- pour un séparateur horizontal

Vue publique

plan4

 

Communiquer la carte réalisée

À gauche, cliquer sur cet icône icone1;

Copier le lien qui apparaît dans « URL courte », et la diffuser.

Intégrer la carte dans une iframe (cadre avec contenu extérieur).

Coller le code "<iframe width........>" dans l'éditeur de votre site internet en mode "code html"

 

plan5

 

Et voilà le résultat final :

Voir en plein écran

Pour importer une image dans la map, faire un clic droit sur l'image et cliquer sur "copier l'adresse de l'image"

Dans l'éditeur, coller avec ce code :

Code de base pour UMAP : {{http://image.url.com}}

Code à intégrer dans l'éditeur : {{https://ancrages.org/wp-content/uploads/2016/10/GARE-SAINT-CHARLES-3.jpg}}

Résultat :

 

 

Via la plateforme SOUNDCLOUD.COM

Se rendre sur la page ou la source audio a été enregistrée.

https://soundcloud.com/communication-ancrages/societe-generale-des-tuileries-de-marseille

Ouvrir la boite de dialogue via le bouton partager qui se trouve sous le lecteur, cliquer sur le bouton "EMBARQUER", sélectionner le lecteur audio de droite et copier le code en faisant un clic droit sur la souris.

 

Code html de base :

<iframe width="100%" height="166"
scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/url=https%3A//api.soundcloud.com/tracks/305754117
&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;
show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>

Séléctionner ce bout de code :

https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/305754117

Créer le code d'intégration

Code de base pour UMAP : {{{http://iframe.url.com}}}

Code à intégrer dans l'éditeur : {{{https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/305754117}}}

Résultat :

 

 

 

Liens des vidéos sur youtube

https://youtu.be/3ZxQute_13c : Présentation de la gare de l'estaque

https://youtu.be/XTTA2ianDAY : Témoignage d'un ancien ouvrier de la sucrerie SAINT LOUIS

Se rendre sur la page de la vidéo

Cliquer sur le lien "partager" en bas de la vidéo

Cliquer ensuite sur intégrer

Dans le code présenté tel quel ci-dessous sur la page youtube, sélectionner uniquement le code en rouge.

<iframe width="560" height="315" src="https://www.youtube.com/embed/dEI9fP2De0A" frameborder="0" allowfullscreen></iframe>

Coller le sur l'éditeur de la carte et mettre entre un ensemble de trois accolades.

Résultat : {{{https://www.youtube.com/embed/dEI9fP2De0A}}}


Code de base pour UMAP : Iframe: {{{http://iframe.url.com}}}

Code à intégrer dans l'éditeur : {{{https://www.youtube.com/embed/3ZxQute_13c}}}

Vue panoramique

Mur de tuile

Allée

Courée

Chemin de fer

traverse de BOVIS

Vue panoramique

Gare de l'estaque

tunnel gare estaque

Batisse la monjarde

Montée Château bovis

Château Bovis

Cimetière

Compagnie de théatre

Courée

 

Courée

Courée

Container

Cimetière

Impasse de la palangrotte

Lavoir

Place du village

Place du village

Traverse du Balicot

cimetière

Traverse Bovis

Traverse Bovis

Creux d'argile

Creux d'argile

Batisse

Plaque Cézanne

Chemin de fer

Décharge sauvage

Gare de l'Estaque

Gare de l'estaque

Gare de l'Estaque

gare de l'Estaque

Gare de l'Estaque

Mur de tuile plate

Mur de tuile plate

Mur de tuile

Panorama - Traverse de Bovis

Panorama - Traverse de Bovis

Traverse de Balicot

Traverse de Balicot

Traverse de Balicot - Container

Traverse de Balicot

Traverse de Bovis

Toit tuile encastrable

Tunnel gare de l'Estaque

Tunnel gare de l'Estaque

Traverse de Bovis - Chemin de fer

Vue du belvédère

Tunnel de la gare de l'Estaque

Décharge sauvage

Tunnel de la gare de l'Estaque

Terrain

Vue panoramique

panneau voisinage

Mur de tuile

gare de l'Estaque

Les usines de terre cuite du bassin de Séon en 1907 - @© Arch. S.G.T.M

1 – Usine Martin Frères

9 – Usine Fenouil-La mer

13 – Usine Saumaty et Fenouil

16 – Usine Regali

17 – Usine Pierre-Sacoman

 

Bateau tartane, quai de l'Estqaue - © Arch. S.G.T.M

 

Usines de l'Estaque - © DR Auteur

 

Usine Joseph Fenouil© Arch. S.G.T.M

 

TALABOT - © DR Auteur

 

Gare saint-charles - TGV - © DR Auteur

 

Percée du tunnel de la Nerthe - © Coll. de la Fédération du bâtiment et des travaux publics des Bouches-du-Rhône

 

Usine Pierre SACOMAN - © Archives S.G.T.M

 

Pont tournant de Caronte - © Collection Historia

 

Pont tournant de Caronte - © Collection P. Bargelin

 

L'Estaque et la rade en 1847 - © Aubanel, 1847

 

Usine Pierre SACOMAN - © Archives S.G.T.M

 

Tunnel de la Nerthe - © Edouard Denis Baldus

 

Tuilerie Saint André - © Patrick Box

Pôle d'échanges de Marseille Saint--Charles, janvier 2008 © D. Boy de la Tour, archives AREP

 

La gare saint-charles - © Collection JMS

 

Les escaliers de la gare saint-charles - © Archives JMS

Salle des pas perdus - © DR Auteur

 

Gare de l'estaque - © Inconnu, 1893

 

Gare de l'estaque - © Inconnu

 

 

La tuilerie Pierre SACOMAN

Pierre SACOMAN :
tuilier du bassin de
Séon

Fils d’Antoine SACOMAN, tuilier du bassin de Séon, Pierre SACOMAN fut le témoin du passage de l’artisanat à l’industrie des tuiles et un des trois premiers fondateurs de la Société Générale des Tuileries de Marseille en 1894

Son usine, implantée dans la gare de l’Estaque a comme estampille une étoile à 5 branches.

 


LA GARE SAINT-CHARLES

La gare Saint Charles, inaugurée le 8 janvier 1848 est l'une des premières grandes gares terminus en France, son emplacement résulte d’un choix technique: niveau du plateau est à 4 mètres plus bas que celui du tunnel de la Nerthe.

La salle des pas perdus, témoin de la mise en scène de l’aventure ferroviaire

L’escalier monumental (1911-1926), témoin de la puissance coloniale de Marseille

 


LA GARE DE L'ESTAQUE

Avec son rôle important et son noeud ferroviaire, la gare de l'Estaque contribue au développement des activités industrielles et de la villégiature.

Inscrite aux Monuments historiques en 2012 pour sa spécificité architecturale (art nouveau).

Explosion démographique du quartier, arrivée de populations étrangères (italiens, espagnols, nord-africains)

 


Tunnel de la Nerthe

Construit en 1847, ce tunnel ferroviaire souterrain de 4.620 mètres a été réalisé grâce à des prouesses technique et un fort besoin de main-d'oeuvre étrangère.

Chantier accidentogène (300 morts et 400 blessés graves)

 


Pont de Caronte

Réalisé entre 1908 et 1915, le pont de Caronte est un ouvrage emblématique de la ligne de la Côte Bleue.

Prouesses techniques: traverse tournante, ossature métallique, piles en maçonnerie

Recours à la mains d’œuvre étrangère (italiens)

Conditions de travails rudes: ouvriers « tubistes » dans des caissons immergés sous l’eau


Point de vue - Traverse Bovis

Ce pont ferroviaire offre une vue imprenable sur le Bassin de Séon, composé des trois noyaux villageois de Saint -André, Saint Henry et l'Estaque. Évoquer le « Bassin de Séon » c'est rappeler le patrimoine tuilier qui façonne l'identité de ces quartiers, mais aussi l'implantation historique d'autres types d'industries telle que la Société coloniale des Chaux et Ciments ou encore les industries de produits chimiques Khulmann et Perroya dans le quartier des Riaux, au pied du massif de la Nerthe.

 


Cimetière de Saint-Henri

Le cimetière contient les caveaux des grands Tuiliers de Marseille : Les Roux frères, Pierre Sacoman, les Bonnet.
Un monument aux morts des première et seconde guerres mondiales s'y trouve, dont aucune référence aux anciens combattants de l'Armée d'Afrique n'y figure. Combattants qui ont fait la libération de la Provence, notamment sur les collines que nous traversons par cette balade.

HAUT