@angie12: wiesz co, jak otworzysz zapisany plik svg w edytorze tekstowym i przejdziesz do ścieżek (węzłów o nazwie path) to tam są współżędne dla każdej ścieżki, np taki plik (jak na załączonym obrazku) ma ścieżkę:



W atrybucie "d", masz znacznik "m", który najprawdopodobniej jest początkiem ścieżki (tak by wynikało ze współrzędnych pierwszego punktu, którym jest punkt na górze). Potem następuje znacznik "c" po którym parami są wymienione poszczególne punkty kontrolne w
horus666 - @angie12: wiesz co, jak otworzysz zapisany plik svg w edytorze tekstowym i...

źródło: comment_1595945485BVK3WLsUzn8g23GicKwP7O.jpg

Pobierz
  • Odpowiedz
@kasztan70: Kiedyś widziałem interaktywną historię w html5. Była tam dziewczyna z facetem, który bronił jej przed wchodzącymi zombie, trzeba było używać broni i podejmować decyzję. Poszukaj po słowach kluczowych, może akurat ;)
  • Odpowiedz
Jaki algorytm wykorzystalibyście do stworzenia symulacji mandatów w parlamencie?
Chciałbym to zrobić w #canvas, musi być możliwość automatycznego generowania odpowiedniej ilości miejsc na podstawie danych wejściowych (user podaje wielkość parlamentu). Chodzi mi właśnie o to, jak zautomatyzować generowanie miejsc w ten sposób, żeby zawsze była odpowiednia struktura tego parlamentu (kolejne rzędy, kolorowanie miejsc po kolei wg partii etc.)

#frontend #javascript #programowanie #algorytmy
Trustm3 - Jaki algorytm wykorzystalibyście do stworzenia symulacji mandatów w parlame...

źródło: comment_rkKoIAQNivxRx6nRJFrispC52IfjV4Uq.jpg

Pobierz
@Trustm3: jeśli już to:
1. user podaje ilość tych kropek (miejsc) i ilość rzędów
2. wyliczyć ile kropek umieścić w każdym rzędzie żeby były umieszczone mniej więcej w takich samych odstępach (każdy rząd ma inną długość)
3. narysować kropki - wyliczyć promień dla każdego rzędu a w każdej pętli rzędu wyliczyć x,y każdej kropki za pomocą funkcji trygonometrycznych
4. kolorować można na różne sposoby, najlepiej chyba trzymać kąt odchylenia każdej kropki
  • Odpowiedz
Jest tu jakiś spec od canvas?( ͡° ͜ʖ ͡°) Mam jeden obiekt który porusza się gdy poruszamy myszką i obiekty które generują się losowo na canvie no i tutaj jest mój problem. Gdy poruszam myszką czyszczę całą canvas dzięki temu poruszam się obiektem ale wtedy, te losowo generowane obiekty też się czyszczą, wiecie o co mi chodzi?
#javascript #canvas
Cześć Mirki/Mirabelki,

mam problem, chciałem zrobić coś takiego:
1. Mam divy o class np. "foo1", "foo2", "foo3"
2. Chciałbym aby zliczyło mi każdego diva który zaczyna się od "foo" i wkleiło do niego canvas o id=myCanvas1 (gdzie w miejscu "1" byłby kolejny numer diva)

Udało mi się spłodzić coś takiego - jsfiddle

Ale wkleja mi wszystkie canvas (w tym przypadku wszystkie 3) do każdego diva, zamiast jeden canvas do
Mam takie nietypowe pytanie. Tworzę ofertę na stronę w dla małego dewelopera. Chodzi o pomysł ze stworzeniem klikalnej mapy budynku z mieszkaniami lub inwestycji z budynkami czy to w #svg czy #canvas. Właśnie o to chodzi, że z racji tego, że nie znam się na tym kompletnie, nawet nie wiem od czego tam zacząć, nie mam czasu na poznanie akurat tego tematu, chciałem to komuś zlecić, ale nie mam kompletnie pojęcia
#programowanie #webdev #angular #html #canvas
Mirki tworzę aplikację webową z planem lekcji. Plan mam już w bazie danych i chcę to "narysować" z możliwością edycji. Myślałem żeby użyć do tego tabeli, ale mój program daje możliwość wstawiania zajęć (np. basen) o różnych godzinach nie tylko wtedy gdy są lekcje. Tabela (raczej) odpada z powodu takiego, że mogę mieć nakładające się zajęcia na planie. Kumpel podpowiedział mi żebym użył canvas. To jest dobra
Patres - #programowanie #webdev #angular #html #canvas
Mirki tworzę aplikację webową...

źródło: comment_m82eWfWzboYE6659dM9t6C6V5RO9Vf7C.jpg

Pobierz
@Patres aaa czyli nie wyświetlasz całego dnia, tylko plan zajęć ;)
Pewnie używasz bootstrap albo innego frameworka GUI, więc użyj klas i zrób to w kolumnach i wierszach (bez tabeli) w jakiś blokach i po prostu zajęcia dodatkowe dodawaj w blokach do tego co już masz ;) czy to po czasie czy w trakcie trwania
  • Odpowiedz
@Patres: Tak, jak @ManamanaTuriruriru napisał, użyj bootstrapa i działaj na siatce. Tzn. grid system, masz podział elementu na 12 części i różne klasy, odpowiadające różnej rozdzielczości ekranu. np.

123
4

- stworzy 3 kolumny obok siebie i czwartą pod spodem (4+4+4=12, kolejna czwóka się nie mieści, więc przechodzi do następnej linii).
  • Odpowiedz
Wklejacie do notatnika, zapisujecie jako html, otwieracie na pełnym ekranie i ewentualnie odświeżacie stronę. (ʘʘ)


body{overflow:none;background:linear-gradient(145deg,rgba(137,231,255,.8) 0,rgba(236,135,192,.8) 100%);position:relative;width:100%;margin:0 auto;z-index:-1}body:active:before{position:absolute;color:#fff;font-size:100px;content:"Proxima_Centauri";z-index:100}#centre{z-index:1;right:50%;top:50%;background-color:#000;position:absolute;margin:-50px -50px 0 100px;border-radius:40%;opacity:1;animation-name:centres;animation-duration:8s;animation-iteration-count:infinite}#centre:hover{opacity:0}@keyframes centres{0%{height:90px;width:95px;margin:-50px -50px 0 100px;transform:matrix(1,-.4,0,1,0,0);transform:rotate(0)}25%{height:80px;width:85px;margin:-45px -57px 0 100px;transform:matrix(1,-.2,-.2,1,0,.2);transform:rotate(90deg)}50%{height:85px;width:90px;margin:-40px -50px 0 100px;transform:matrix(1,0,0,1,-.2,.2);transform:rotate(180deg)}75%{height:80px;width:85px;margin:-45px -47px 0 100px;transform:matrix(1,0-.4,-.4,1,-.2,0);transform:rotate(270deg)}100%{height:90px;width:95px;margin:-50px -50px 0 100px;transform:matrix(1,0,-.2,1,0,0);transform:rotate(360deg)}}#canvas{opacity:1;background-color:rgba(0,0,0,1);cursor:wait;display:block;z-index:-100} Canvas is not supported in your browser.window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(b){window.setTimeout(b,1E3/60)}}();var canvas=document.getElementById("canvas"),ctx=canvas.getContext("2d"),cw=window.innerWidth,ch=window.innerHeight,f=[],hue=180,a=1;canvas.width=cw;canvas.height=ch;function random(b,c){return Math.random()*(c-b)+b+Math.PI*Math.random()}function calculateDistance(b,c,d,e){return Math.sqrt(Math.pow(b-d,2)+Math.pow(c-e,2))}function E(b,c,d,e){this.x=b;this.y=c;this.sx=b;this.sy=c;this.tx=d;this.ty=e;this.distanceToTarget=calculateDistance(b,c,d,e);this.distanceTraveled=0;this.coordinates=[];for(this.coordinateCount=4;this.coordinateCount--;)this.coordinates.push([this.x,this.y]);this.angle=Math.atan2(e-c,d-b);this.speed=2;this.acceleration=1.04;this.brightness=random(50,70);this.hue=random(hue-15,hue+15)}E.prototype.update=function(b){this.coordinates.pop();this.coordinates.unshift([this.x,this.y]);this.speed*=this.acceleration;var c=Math.cos(this.angle)*this.speed,d=Math.sin(this.angle)*this.speed;this.distanceTraveled=calculateDistance(this.sx,this.sy,this.x+c,this.y+d);this.distanceTraveled>=this.distanceToTarget+cw/35?f.splice(b,1):(this.x+=c,this.y+=d)};E.prototype.draw=function(){ctx.beginPath();ctx.moveTo(this.coordinates[this.coordinates.length-1][0],this.coordinates[this.coordinates.length-1][1]);ctx.lineTo(this.x,this.y);ctx.strokeStyle="hsl("+this.hue+", 80%, "+this.brightness+"%)";ctx.stroke()};function loop(){requestAnimFrame(loop);hue+=a;if(170==hue||332==hue)a=-a;console.log(hue);ctx.globalCompositeOperation="destination-out";ctx.fillStyle="rgba(0, 0, 0, 0.5)";ctx.fillRect(0,0,cw,ch);ctx.globalCompositeOperation="lighter";for(var b=f.length;b--;)f[b].draw(),f[b].update(b);f.push(new E(cw/2+random(0,cw/160),ch/2+random(-ch/160,ch/80),cw,random(0,ch)));f.push(new E(cw/2-random(0,cw/160),ch/2+random(-ch/160,ch/80),0,random(0,ch)));f.push(new E(cw/2+random(-cw/160,cw/80),ch/2-random(0,ch/160),random(0,cw),0));f.push(new E(cw/2+random(-cw/160,cw/80),ch/2+random(0,ch/160),random(0,cw),ch))}window.onload=loop
#nieprogramowanie #
Mam pewien problem z pluginem html2canvas.
Output dostaję zawsze ucięty, czasami o kilka px czasami zupełnie inaczej wygląda.
Skąd to się bierze i jak temu zaradzić? #webdev #canvas

Jakiś kod będe mógł podrzucić dopiero za kilka h kiedy wyczyszczę go z identyfikującymi go elementami.
#drspray #tworczoscwlasna #handmade #rekodzielo #art #sztuka #canvas #malarstwo

Siemanko :-)

Przypominamy o naszym facebookowym rozdajo :-)
https://www.facebook.com/dr.spray/posts/1528191547488670?notif_t=like¬if_id=1462540147263743
Macie jeszcze chwilę czasu, a dokładnie dziś do godziny 23:59, na zgarnięcie naszego jedynego i niepowtarzalnego płótna "I hate mindays" zupełnie za darmoszke ( ͡° ͜ʖ ͡°)

Zapraszamy!
DrSpray - #drspray #tworczoscwlasna #handmade #rekodzielo #art #sztuka #canvas #malar...

źródło: comment_7xP2J4f75ASQO9Lcc92Qrt0stAE6wDnT.jpg

Pobierz
  • Odpowiedz