18043 sujets

Questions générales et questions de débutants

Navigation entres des images .svg

Bonjour à tous,

Voila j'explique ma situation, j'ai un programme de CAO 3D qui me permet de générer des tas de fichiers SVG. Je peux naviguer entre ces fichiers en ajoutant les lien directement dans les SVG mais c'est très long et pas pratique du tout en cas de modification (souvent).

Je cherche a créer quelque chose comme un diaporama simple avec bouton Home, Suivant et Precedent. La ou ca se complique, c'est que pour que ca soit facile a modifier, je voudrai que l'ordre des fichiers soient puisé dans un fichier de type TXT ou CSV ou bien XML. (les fichiers on des noms particuliers qui ne peuvent pas être 1.svg 2.svg 3.svg ect ect)

A lire avec un navigateur IE, c'est mieux et si possible sans PHP pour que ca fonctionne en local.

J'ai fais pas mal de recherche sur le net mais je ne voudrai pas partir dans une mauvaise direction.

J'attends vos conseils ca m'aiderai énormément.

Merci d'avance.
salut,
tu pourrais stocker ta liste de SVG dans un fichier JSON (ou autre) que tu récupères via Ajax. Puis tu crées les images en JS avec une simple boucle.
Ton JSON pourrait ressembler à ça

{
	"svg": [
		"chemin/image1.svg",
		"chemin/image2.svg",
		"chemin/image3.svg",
		"chemin/image4.svg",
		"chemin/image5.svg"
	]
}

et ton JS donnerait :

function loadSvgs(json){
	
	var img = [];

	var i = 0,
		l = json.svg.length;
	
	for (; i<l; i++){
		
		img[i] = document.createElement("img");
		img[i].src = json.svg[i];

		document.body.appendChild(img[i]);
	
	}

}

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){
	if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))
		loadSvgs(JSON.parse(xhr.responseText));
}

xhr.open("GET", "svgs.json", true);
xhr.send();
[/i][/i][/i][/i]
Merci beaucoup,

Si je comprends bien , la fonction lis la position dans le fichier et non le nom de l'image.

j'ai plus de mal a comprendre le coté ActiveX. Mais je vais étudier.

J'aurai aimé utiliser ce type de code:

<html>

<body>

<div align="center"> 
	
<input type="button" name="precedente" value="Précédente" onclick="precedente();"> 

<input type="button" name="suivante" value="Suivante" onclick="suivante();"> 

</div>

<object id="svgid" width="100%"height="100%"data="start-1.svg"type="image/svg+xml">

<param name="src"value="start-1.svg">

</object>

</body>

</html>



Pour avoir suivant / precedent. Pense tu ce ca soit possible?

je connais la balise <object, peut on y passer des variables j'ai fais des essais mais rien de concluant, j'ai surement pas du bien m'y prendre.

Merci encore d'avance.
Sujet clos
Aller à