Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht:
|
Verfasst Mo 14.09.2015 11:15
Titel SVG: "draggable" Objekte - online ja, als File nei |
|
|
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 ...
|
|
|
|
|
Struwwelpeter
Dabei seit: 25.08.2005
Ort: Stuttgart
Alter: 37
Geschlecht:
|
Verfasst Mo 14.09.2015 20:40
Titel
|
|
|
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.
|
|
|
|
|
Anzeige
|
|
|
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht:
|
Verfasst Mo 14.09.2015 22:35
Titel
|
|
|
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
|
|
|
|
|
|
|
|
Ä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
|
|
|
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.
|
|