Blend 3 und zoomen auf einer Webseite
Hallo Community,
ich bin Blend/Silverlight-Neuling und suche gerade nach einer Möglichkeit auf einer Webseite die ich mit Blend 3 erstellt habe, eine Zoom-Fuktion hinzukriegen - in etwa in der Art wie es bei Google-Earth aussieht.
Hintergrund ist der, das die Webseite eine Gebäudevisualisierung darstellt mit der Möglichkeit auf der aktuellen Mausposition in den Grundriss reinzuzoomen und die entsprechenden Buttons und Slider, etc. zu bedienen. Eine Aufteilung des entsprechenden Grundriss in viele kleine Elemente (Räume) und die dann in Border/Grids reinlegen, will ich vermeiden weils einige verschachtelte Räume gibt und zum Schluß wird das ein riesen Chaos. (Ich habe das fürs gleiche Gebäude mit html, vielen Scripten und nochmehr GIF's durch - brauch ich nicht mehr)
Bei Codeplex habe ich "ZoomControl v1.0.0.1.7z" gefunden, aber keine Beschreibung wie ich das Teil in die Webseite reinkriege.
Kann mir jemand das ToDo mit dem o.g. Control beschreiben (bitte langsam - bin Anfänger) und hat vielleicht ein Stück Code wie das am Schluß aussieht - natürlich auch gerne mit irgendeinem anderen Control - ich bin da für jede Idee aufgeschloßen.
Herzlichen Dank im Voraus und viele Grüße
Wolfgang
- Anmelden oder Registrieren um Kommentare zu schreiben
-
Käme DeepZoom infrage?
Hallo Wolfgang,
relativ bekannt ist ja "DeepZoom", Du findest dazu bei msdn eine Erläuterung und Szenarien (http://msdn.microsoft.com/de-de/library/cc645050(VS.95).aspx) sowie im Silverlight SDK Sample Browser (http://samples.msdn.microsoft.com/Silver...) einige Beispiele. Du würdest dann mit (hochauflösendem) Bildmaterial arbeiten, aber so wie ich das verstehe, ist das kein Problem, da zuletzt auch mit Bild- und nicht mit Vektormaterial gearbeitet wurde.
VG Christian
www.maximago.de
Deep Zoom
Hallo Chritian,
danke für die Antwort.
Mit DeepZoom habe ich das schon probiert, allerdings wirkt sich DeepZoom nur auf die Grafik aus - oder habe ich da was falwsch verstanden. Ich habe aber noch jede Menge animierte und automatisierte Button und Slider, die ebenfalls, vor der Grafik liegend, mitgezoomt werden müßen.
Für weitere Tipps bin ich jederzeit dankbar.
Viele Grüße
Wolfgang
Mmh
Hallo Wolfgang,
was hälst Du denn von dieser Idee?
http://silverlight.r2musings.com/InitializingAnimations/
So hast Du zwar keinen Zoom, jedoch wäre damit ein anderer Aufbau möglich
z.B. Etage 1-x dann Klick vergrößert sich die Etage.
Dann Klick auf rechte Seite oder linke Seite vergrößert diese,...
Damit hast Du jedoch viele einzelne Pages mit Details was dir evtl. nicht gefallen wird.
Aber bei Änderungen an einem Raum hast Du es sicherlich einfacher, da Du jeden Raum einzeln Aufrufen kannst...
Denke wäre eine Idee
Grüße
Jan
ZoomControl
Hallo Jan,
auch Dir danke ich für deine Unterstützung.
Deine Idee ähnelt sehr meiner letzten html-Lösung - hier haben wir auch Raumweise einen ModalDialog geöffnet. Der Nachteil des Ganzen ist halt, das wenn sich ein Raum in der Größe ändert, muß ich die Hintergrundgrafik und danach eben die kleineren Grafiken vändern. Nachdem das erklärte Hobby des Kunden "Umbau" heißt - kannst Du dir den Rest denken
Ich habe jetzt einen Tipp erhalten: www.vectorlights.net, die haben ein Control "Viewer" damit kann mit einem Slider gezoomt und mit den Bildlaufleisten der entspr. Bildausschnitt verschoben werden.
Das Teil ist eigentlich ein Container, in den kann man dann wiederum weitere Container reinpacken und so zoomen. Das hätte wie gesagt den Vorteil, das wenn sich die Raumaufteilung ändert, wird die Hintergrundgrafik getauscht, evtl. noch die Platzierung der entspr. Buttons für Beleuchtung und Jalousie versetzt und fertig.
Ich denke mal der "Viewer" wird erstmal die Lösung des Ganzen, wobei mich schon noch interessieren würde, wie das Handling mit dem Eingangs erwähnten ZoomControl von Codeplex funktioniert - da wäre ich auch noch für Tipps dankbar.
Trotzdem Danke an Euch und viele Grüße
Wolfgang
Anderer Versuch?
Hallo Wolfgang,
habe gerade noch eine Idee wenn es nur ums "Zoomen" geht.
Nimm einen Slider und binde den Value auf ScalteTransform von deinem Objekt.
Jetzt musst Du nur noch die Mouseposition bekommen und den Mittelpunkt dorthin setzen wo du geklickt hast. Dann kannst du direkt diese Stelle vergrößern.
Zum Zoomen selber:
[XAML]
[Slider x:Name="slider" Margin="244,0,0,308" Maximum="5" HorizontalAlignment="Left" Width="150" SmallChange="0.01" Height="62" VerticalAlignment="Bottom"/>
[Grid RenderTransformOrigin="0.5,0.5">
[Grid.RenderTransform>
[TransformGroup>
[ScaleTransform ScaleX="{Binding Value, ElementName=slider}"/>
[SkewTransform/>
[RotateTransform/>
[TranslateTransform/>
[/TransformGroup>
[/Grid.RenderTransform>
[TextBlock x:Name="textBlock" Height="38" Margin="334,0,494,361" TextWrapping="Wrap" Text="{Binding Value, ElementName=slider}" VerticalAlignment="Bottom" Background="White"/>
[/Grid>
[/XAML]
Habe hier gerade das Problem, dass ich keinen Code einfügen kann ,..
Tausche einfach die "[" gegen die spitze Klammer aus..
Ich hoffe es kann dir helfen
Die SliderOptions musst dann natürlich deinen Bedürfnissen anpassen.
Die MousePosition musst Du natürlich in Abhängigkeit von deinem LayoutRoot bekommen und dann dort entsprechend die Werte auf "TranslateTransform" binden.
Da wäre aber auch weiter ausbaufähig, zum Beispiel mit einem Y-Slider und dem Mausrad...
Grüße
Jan