mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 23.04.2024 11:59 Benutzername: Passwort: Auto-Login

Thema: SVG: "draggable" Objekte - online ja, als File nein? vom 14.09.2015


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> SVG: "draggable" Objekte - online ja, als File nein?
Autor Nachricht
qualidat
Threadersteller

Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht: Männlich
Verfasst Mo 14.09.2015 11:15
Titel

SVG: "draggable" Objekte - online ja, als File nei

Antworten mit Zitat Zum Seitenanfang

Ich befasse mich z.Z. für ein Online-CAD-Projekt mit der Möglichkeit, innerhalb eines SVG sowohl einzelne Objekte als auch Gruppen "draggable" zu machen. Als Einstieg habe ich das folgede Beispiel im Web gefunden, was auch online problemlos funktioniert.

https://dl.dropboxusercontent.com/u/169269/group_drag.svg

Lade ich mir allerdings den Sourcecode in eine loale Datei und öffne ihn (wie online auch) unter Windows 7 mit Firefox als Datei (nicht vom HTTP-Server), so gibts erhebliche Abweichungen im Verhalten:

- der blaue Hintergrund ist nicht 100% hoch und breit, sondern nur ca. 300 x 100 Pixel
- keines der Objekte lässt sich anfassen oder bewegen
- ich kann das "nackte" SVG nicht im Browser öffnen, dann wird es nur als XML-Source agezeigt, ich muss HTML-Tags drumherum schreiben

Wieso? Verstehe ich nicht, es gibt z.B. keine Includes ... ist das irgend so eine "seltsame" Sicherheitseinstellung unter Windows? Danke für Tips ...
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Struwwelpeter

Dabei seit: 25.08.2005
Ort: Stuttgart
Alter: 37
Geschlecht: Männlich
Verfasst Mo 14.09.2015 20:40
Titel

Antworten mit Zitat Zum Seitenanfang

Hast du tatsächlich den kompletten Quellcode kopiert?

Code:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" onmousemove="null">
<script><![CDATA[

function startMove(evt, moveType){
   x1 = evt.clientX;
   y1 = evt.clientY;
   document.documentElement.setAttribute("onmousemove","moveIt(evt)")
   
   if (moveType == 'single'){
    C = evt.target;
   }
   else {
    C = evt.target.parentNode;
   }
}

function moveIt(evt){
    translation = C.getAttributeNS(null, "transform").slice(10,-1).split(' ');
  sx = parseInt(translation[0]);
  sy = parseInt(translation[1]);

  C.setAttributeNS(null, "transform", "translate(" + (sx + evt.clientX - x1) + " " + (sy + evt.clientY - y1) + ")");
  x1 = evt.clientX;
  y1 = evt.clientY;
}

function endMove(){
  document.documentElement.setAttributeNS(null, "onmousemove",null)
}

]]></script>

<rect x="0" y="0" width="100%" height="100%" fill="dodgerblue"/>

<g transform="translate(0 0)">
  <circle id="circle1" onmousedown="startMove(evt, 'single')" onmouseup="endMove()" transform="translate(60 200)" cx="0" cy="0" r="22" fill="blue" stroke="black" stroke-width="8"/>
  <circle id="circle2" onmousedown="startMove(evt, 'single')" onmouseup="endMove()" transform="translate(221 99)" cx="0" cy="0" r="22" fill="grey" stroke="black" stroke-width="8"/>
  <circle id="circle3" onmousedown="startMove(evt, 'group')" onmouseup="endMove()" transform="translate(50 50)" cx="0" cy="0" r="22" fill="orange" stroke="black" stroke-width="8"/>
</g>

</svg>


Funktioniert ohne Probleme.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
qualidat
Threadersteller

Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht: Männlich
Verfasst Mo 14.09.2015 22:35
Titel

Antworten mit Zitat Zum Seitenanfang

Struwwelpeter hat geschrieben:
Hast du tatsächlich den kompletten Quellcode kopiert?

Funktioniert ohne Probleme.


Ja, schon, genau so (plus HTML-Tags aussenrum). Könnte evtl. an der Umgebung liegen: Windows Server 2012 R2 per Remote ... hab' (unter Windows) im Moment nix anderes. Ist wahrscheinlich doch so eine wenig sinnvolle "Sicherheitsmaßnahme". Kann mich an einen Fall erinnern, da konnte ums Verrecken keine lokale Flash-Datei ausgeführt werden.

Muss mir mal eine VM mit einem Nicht-Server-OS auf dem Macbook machen ...


Zuletzt bearbeitet von qualidat am Mo 14.09.2015 22:37, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen simples online file management gesucht
Draggable - Fenster auf- & zuklappen
Fancybox und jQuery Draggable
jQuery: Multiple draggable, ein droppable
File Viewer(PSD, EPS, AI...) für PC
File Maker
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.