berlinmagic / dresscode-cms

Neuer Prototyp unseres ContentManagementSystems .. verbindet die alte Gembasierte Theme-Engine mit der neuen Dynamischen Variante.
1 stars 0 forks source link

svg-icons #6

Open orangenwerk opened 12 years ago

orangenwerk commented 12 years ago

egal mit welchem plugin ( möglichst jQuery )

sollte sich wie ein bild verhalten

=> in div als hintergrund ... gut scalierbar (sollte durch nutzer per slider verstellbar sein )

pixelgenaue darstellung muss gewährleistet sein !!!

polka commented 12 years ago

was hast du probiert?? svg's musste die pfade angeben und die füllungen, und nicht die svg. paper.path().attr({fill: "#000", stroke: "none"});

polka commented 12 years ago

raphael >>

paper.path().attr({fill: "#000", stroke: "none"});

folgend der code für son dummes icon. !!!!!! schau dir das comment im edit mode an !! wg escaping

# legt view port Created with Raphaël 2.0.0
orangenwerk commented 12 years ago

und wo gibst du ihm ne größe und soweiter .. soweit seinen beispiel-code zu kopieren war ick denn doch schon

polka commented 12 years ago

nun dann hast du doch alles :)

also was ich meinte.. du hast dein standard logo format: weight, height = 40, 40 oder nimm 100_100. hierin wird gezecihnet. alle objecte haben eine größe, die sich aus ihrem pfad ergibt. in unserem fall existierte kein einziger punkt außerhalb der 100_100 area, wenn wir eine geschlossene form haben wollen.
also zeichne alle icons auf 100*100 größe extrahiere path, added path to Raphael. Raphael.path(''M 10 10L20 20, ..etc') scaliere auf größe des divs.

also nochmal die größe wird beim zeichnen erstellt. dann beim erzeugen des RaphaelObjectes. dann beim scalieren. hab noch keine andere möglichkeit gefunden.

die icons..auf raphaelJS sind nict anders. hoffe das ist verständlich.

oder schick mir mal die icons.svg oder noch besser dessen json pendant, mit nem html tmeplate wo die icons reinsollen.

edit schick per mail

orangenwerk commented 12 years ago

icons existieren noch nicht in svg .. nur in corel

wäre noch andere fragen zu klären .. zB: klappen sprites (denn knapp 100 svgs wären ne menge unsinniger serveranfragen welche ein png abfangen würde)

dann müssten die icons speziell angelegt werden ? .. um auf zB. 100 px zu kommen

und sind die drei nötigen schritte nicht ein absoluter overkill wenn eventuell knapp 30 icons pro Seite ( und bis zu 200 optional)

wünch dir n icon, dann schick ich ihn dir per mail / scype

interessant wäre auch müssen svgs existieren oder reicht der path ??

polka commented 12 years ago

das mit dem overkill dachte ich auch... aber vorerst: sprites nein.

svg's müssen nicht existieren, der pfad ist das gebrauchte, doch hier ist viellicht der overkill: path = { name: "M...L...", name: " pfad" } meine "idee" das objectliteral hat n namen die css klasse matchen, für jeden suche html elemente, zeichne mit raphael. >> du hast hundert svg elemente zu generieren >> overkill

dswg habsch ja auch fabricJS gezeigt. hier jedoch das problem auch nen overhead. easelJS bietet ähnliches.

das wichtige wäre halt den "passenden" zu haben. also den der sich in nem sagen wir 100x100 viewport befindet. zehner system macht sich einfacher beim skalieren.

dann könnte man sagen wir wählen 4libs aus, und testen alle mit benchmarks. problem hier ist das gecko, webkit und vorallem v8 kaum vergleichbar sind. man bei also große browser unterschiede in kauf zu nehmen hat.

hinsichtlich dessen tendiere ich zu png's. sony-erricson hat zb zwar rapahel nutzt dieses aber für gerade mal 2 logos auf der seite. svg >> SCALIERBAR png >> eben nicht canvas >> auch pixel basiert >> dh alles müsste immer neu gerendert werden.

orangenwerk commented 12 years ago

also bei vielen icons pro seite fallen svgs aus ? .. mh schade

polka commented 12 years ago

testen