Wie kann ich einen Pfeil mit Javascript erstellen?

Ich benötige etwas Hilfe für eine schulische Aufgabe. Die Aufgabe ist, einen Pfeil in Javascript zu erstellen, bei welchem der Benutzer aussuchen kann, welches Zeichen der Rand und welches die Füllung ist und wie viele Zeilen der Pfeil hat. Wenn der Benutzer z.B. eingibt, dass der Pfeil 5 Zeilen haben soll, dass das Zeichen für die Füllung + istund das Zeichen für den Rand # ist, dann würde der Pfeil in etwa so aussehen:
#
##
#+#
#++#
#+++#
natürlich soll der benutzer auch eine sehr hohe reihenzahl aussuchen können, so wie andere Zeichen.
natürlich brauche ich nicht den ganzen code... Die Abfrage und die checks kann ich selbst machen... Ich brauche nur hilfe bei der Erstellung des pfeils. Für die erstellung des pfeils soll die folgende function verwendet werden:

function createRow (border, fill, rowNumber) {

// create one row as a STRING of border and fill for the arrow

// return this string!

)
ich habe schon längere zeit Überlegt, wie man mit verschiedenen Schleifen alle reihen generieren kann, bin aber noch nicht darauf gekommen. ich habe z.B. versucht, mit einer for-schleife so viele Zeilen zu generieren, das hat aber nicht geklappt... wenn mir also jemand sagen könnte, wie man den Pfeil mit dem vom Nutzer via prompt eingegebenen daten generieren kann, wäre ich sehr dankbar.

1 Antwort

MrAmazing2

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

JavaScript, Programmiersprache, Programmieren & Softwareentwicklung

03.04.2023, 01:21

Jede Zeile besteht aus

1 * Border
(Zeilennummer - 2) * Fill (bzw. -1 wenn man bei 0 zu zählen beginnt)
1 * Border (außer in der ersten Zeile, da gibt es nur eine Border)

Genau so kannst du es auch umsetzen.

Pseudocode:

für i von 0 bis zeilen:
  print border
  print (i-1) * fill
  if i > 0:
    print border

Um einen String, in dem Fall fill, x mal zu wiederholen, kannst du folgende Funktion verwenden:

fill.repeat(x)

Wobei darauf zu achten ist, dass darin keine negativen Zahlen verwendet werden dürfen.

Da die Funktion "createRow" heißt soll darin wohl nur eine einzige Reihe erstellt werden. Die Funktion wird dann wohl in einer Schleife aufgerufen. Die Schleife vom Pseudocode brauchst du also garnicht, sondern nur das was drinnensteht, das kommt in die Funktion.

Spoiler, versuch es bitte zuerst selbst:

Meine Lösung wäre folgende:

function createRow(border, fill, rowNumber) {
  return border + fill.repeat(Math.max(0, rowNumber-1)) + (rowNumber > 0 ? border : "");
}

Woher ich das weiß:Hobby – Programmieren ist mein Hobby & Beruf

Ähnliche Fragen

JavaScript: Zeichen aus String löschen?

Hallo,

wie kann ich aus einem String eine Überprüfung machen, ob gewisse Buchstaben enthalten sind und wenn ja, wie ich diese "lösche".

...zur Frage

Kann ich das Programm ohne 2 Schleifen schreiben?

Man kann ja zwei schleifen machen einmal für die jeweilige Zeile und dann für die jeweiligen Spalten bzw Anzahl der Zeichen der Zeile

(Syntax kann falsch sein da ich C lange nicht mehr hatte)

würde es aber auch gehen wenn man ne Schleife macht von i=0 bis i< 5 und dann ein String erstellt und dann pro Durchlauf den String um ein * erhöht

also so char[5] s;

und dann in der Schleife immer um 1 ergänzt

s[i] = ‚*‘;

oder man könnte doch auch mit einem String anfangen der eine Länge von 1 hat und dann die Länge erhöhen und dann immer hinzufügen

und dann den String immer Printen

Also nur aus Interesse

...zur Frage

Javascript Ajax Php kein Wert?

Console:

HTML javascript Code ajax:

function send(text){
   console.log("Text kurz vor versenden:\n" +text);
//hier hat er noch einen wert
   $.ajax({
     method: "POST",
     url: "DataSender.php",
     data: { text: text}
   }).done(function( response ) {
       console.log(response);
     console.log("weiterleitung

Php Code Ajax Übertragung wo es nicht geht:

      $text = $_POST['text'];
      $sql = "INSERT INTO `Xss-Data` (`ID`,`DATA`, `created_at`) VALUES (null, '{$text}' , CURRENT_TIMESTAMP)";

      if (empty($text)) {
              //das ist empty!
              echo("Error:\nEs ist leer\nText wäre\n$text");
          } else

Sind die wichtigen Code snippets

Der String hat keinen Wert. Warum? Wie löst man das?

...zur Frage

Wie kann ich JavaScript-Code in Processing-Code umschreiben?

Hallo,

also ist es möglich, einen Java-Code in einen Processing-Code umzuschreiben oder besser gesagt, könnte jemand helfen? Ich bin noch sehr am Anfang, habe aber einen Code gefunden, der mir sehr gut gefällt und mit dem ich gerne ein bisschen herumprobieren würde. Nur funktioniert er eben in Processing nicht und mit Java kenne ich mich noch weniger aus, darum würde ich ihn gerne umschreiben.

So sieht das Ganze aus:

let shapes = [];
let colors = ["#ffc857", "#e9724c", "#c5283d", "#481d24", "#255f85", "#a5bccc"];

function setup() {
  createCanvas(1000, 800);
  rectMode(CENTER);
  translate(width / 2, height / 2);
  scale(1.4);
  rotate(random(PI));
  translate(-width / 2, -height / 2);
  background(random(colors));
  let seg = int(random(25, 45));
  let w = width / seg;

  for (let i = 0; i < seg; i++) {
    for (let j = 0; j < seg; j++) {
      let x = i * w;
      let y = j * w;

      if ((i + j) % 2 == 0) {
        shapes.push(createVector(x + w / 2, y + w / 2, w * 2.01));
      }
    }
  }

  shuffle(shapes, true)
  noStroke();

  for (let s of shapes) {
    let rnd = int(random(4));
    shuffle(colors, true);
    push();
    translate(s.x, s.y);
    fill(random(colors));

    if (rnd == 0)
      circle(0, 0, s.z);
    else if (rnd == 1)
      square(0, 0, s.z);
    else if (rnd == 2) {
      let n = int(random(1, 5));
      
      for (let i = 0; i < n; i++) {
        let ss = map(i, 0, n, s.z, 0);
        fill(colors[i]);
        circle(0, 0, ss);
      }
    }
    else if (rnd == 3) {
      let n = int(random(1, 10));

      for (let i = 0; i < n; i++) {
        let ss = map(i, 0, n, s.z, 0);
        fill(colors[i % colors.length]);
        square(0, 0, ss);
      }
    }

    pop();
  }
}

function draw() {
}

...zur Frage

JavaScript: Schachbrett Schleifen?

Leute, bitte, ich brauche Hilfe, wer programmieren kann.

Ich habe es versucht, aber keine Ahnung warum, es funktioniert nicht.

Ich wäre sehr dankbar, wenn ich Tipps oder so hier bekommen würde.

Was fehlt? Was ist falsch?

JavaScript:

"use strict";

window.addEventListener("load", init);

let i;
let t;
let tr;
let td;

function init() {
  console.log("Fenster ist geladen");

  let btn = document.getElementById("btn");
  btn.addEventListener("click", btn_angeklickt);
}

function btn_angeklickt() {
  console.log("btn angecklickt");

  let zeilen = document.getElementById("zeilen").value;
  console.log(zeilen);

  let spalten = document.getElementById("spalten").value;
  console.log(spalten);

  let table = document.getElementById("bratan");
  
  for (i = 0; i < spalten.value; i++);
  {
    tr = document.createElement("tr");
    table.appendChild(tr);

    for (t = 0; t < zeilen.value; t++);
    {
      td = document.createElement("td");

      if (i % 2 == t % 2) {
        td.style.backgroundColor = colors[0];
        td.style.height = "60px";
        td.style.width = "60px";
      }
      else {
        td.style.backgroundColor = colors[1];
        td.style.height = "60px";
        td.style.width = "60px";
      }
    }
  }

  tr.appendChild(td);
}

let colors = ["#044272", "#80AB52"];

HTML:

  <label for="Anzahl">Zeilen</label>
  <input type="number" id="zeilen">
  <br><br>
  <label for="Anzahl">Spalten</label>
  <input type="number" id="spalten">
</form>
<br>
<button type="button" id="btn" value="btn">erstelle Schachbrett</button>
<table id="bratan"></table>

...zur Frage

JavaScript functionen stoppen?

Undzwar geht es das wenn function stop(){} ausgeführt wird das alle funktionen die in stop drinne sind gestoppt werden? Ohne eine schleife zu nutzen?

function stop(){
  //Skript der alle funktionen stopt
}

...zur Frage

Javascript "ReferenceError: Hex is not defined"?

Hallo,

ich will einen Byte-Hex-String generieren. Dazu habe ich folgenden Code:

function random_string()
{
    return Hex.encodeHexString(SecureRandom.getInstanceStrong().nextBytes(new byte[16]))
}

Aber es kommt der Fehler "ReferenceError: Hex is not defined"

Warum geht das nicht??

...zur Frage

JavaScript/jQuery! Wie einen Loop einbinden?

Auch hier bin ich absoluter Newby!

Ich habe eine nette kleine Funktion:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code2').html() }).animate({ countNum: 5360 }, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code2').html(Math.floor(this.countNum));

complete: function () {

$('.code2').html(this.countNum + "+");

//alert('finished');

}

});

--------------------------------------------------------------------------------------------------------------

Das funktioniert - alles supi - nun möchte ich, dass die Animation nach einem kleinen Zeitintervall erneut startet. Habe dazu über Google 'setInterval' gefunden und einen Code. Leider fehlt mir noch das Verständnis was ich wo einfügen muss.

Hier der Code von Google:

Edit: Ist der Code vielleicht falsch, javascript vs jquery???

function meineFunktion() { 
    // ... 
} 

setInterval(function() { 
    // alle 3 Sekunden ausführen 
    meineFunktion(); 
}, 3000);

Habe das so in meine Scriptdatei eingebunden:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code').html() }).animate({ countNum: 1295365}, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code').html(Math.floor(this.countNum));

setInterval(function() {

// alle 3 Sekunden ausführen

meineFunktion();

}, 3000);

complete: function () {

$('.code').html(this.countNum + "+");

//alert('finished');

}

--------------------------------------------------------------------------------------------------------------

Ich nehme an mindestestens "meineFunktion()" ist nur ein Platzhalter, aber ich bin nicht sicher, was da vom Code rein soll.

Stört das complete eigentlich die Wiederholung oder zeigt das nur an, was passiert, wenn es fertig hochgezählt hat?

Freue mich wie immer über Antworten! :)

Aber auch über Links z.B. mit einer leicht verständlichen Übersicht der Anatomie eines Jquery Codes, damit ich zukünftig besser allgemeine Beispiele an meine anpassen kann.

Bonusfrage:

Ich würde ganz gerne zu der Zahl noch eine einfache sich drehende Grafik (Kreis, Pfeil oä) hinzufügen. Hat da jemand zufällig nen leicht verständlichen Link oä dazu?

...zur Frage

Wie kann ich mit JavaScript eine einfache Validierung umsetzen?

Hallo zusammne,

ich möchte gerne, dass wenn man in das Inputfield vom Typ email etwas eingibt, eine alert-Funktion aufgerufen wird. Die Funktion soll erst aufgerufen werden, wenn in das Eingabefeld vom Typ email fünf Zeichen eingegben worden sind.

Beispiele:

Maxmu (hier sollte das alert aufgerufen werden) stermann@muster.com, wäre richtig.
ds@d, wäre falsch, da nur vier Zeichen eingegeben worden sind und die Funktion sollte nicht aufgerufen werden.

Hier das Codebeispiel.

HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="Stylesheet" href="style.css">
    <script src="Übungen.js"></script>
  </head>
  <body>
    <form>
      <label for Anmelden>Anmelden</label>
      <input type="email" name="Anmelden" id="Anmelden">
      <label for Password>Password</label>
      <input type="password" name="Password" id="Passwort">
      <button type="button" onclick="Einloggen()">Anmelden</button>
    </form>
  </body>
</html>

JavaScript:

const Anmeldedaten = document.getElementById("Anmelden").innerHTML;

function Einloggen() {
  if (Anmeldedaten.length > 5) {
    alert("Es hat geklappt!");
  }
}

Ich bedanke mich im Voraus bei euch. :)

...zur Frage

Java Gridlayout?

Hi, also ich versteh irgendwie nicht warum ich hier die die visibility von meinem Fenster nicht auf true setzten kann?

public class gridlayout {
    private static JLabel createLabel(int fontSize, Color test, String position) {
        var label = new JLabel(position);
        label.setBackground(test);
        label.setOpaque(true);

        int border = 5;
        label.setBorder(BorderFactory.createEmptyBorder(border, border, border, border));

        label.setFont(new Font("Verdana", Font.BOLD, fontSize));

        return label;
    }

   public gridlayout(){

       var newpanel = new JPanel();
       newpanel.setLayout(new GridLayout(2,3));

       Color farbe3 = new Color(90, 10, 80);
       Color farbe2 = new Color(4, 90, 100);

       newpanel.add(createLabel(10, farbe2, "Zeile(1,1"));
       newpanel.add(createLabel(10, farbe2, "Zeile(1,2"));
       newpanel.add(createLabel(10, farbe2, "Zeile(1,3"));
       newpanel.add(createLabel(10, farbe3, "Zeile(2,1"));
       newpanel.add(createLabel(10, farbe3, "Zeile(2,2"));
       newpanel.add(createLabel(10, farbe3, "Zeile(2,3"));

       //warum geht :
       //this.add(newpanel)
       //pack();
       //setVisible(true);
       //nicht?
       
    }

    public static void main(String[] args) {
        new gridlayout();
    }

Hoffe jemand kann mir helfen, bin neu bei Java ;)

Gruß

...zur Frage

Wie kann ich das x-te Zeichen in einem String herausfinden?

Ich will einen Code machen, der alle Zeichen in einem String herausfindet.

Ich wollte das mit einer for-Schleife machen, aber ich bräuchte eine Stringfunktion, die das x-te Zeichen von einem String herausfindet:

for i in range(len(input())):
  ...

...zur Frage

String im Label formatieren (Python)?

Ich wollte, dass alle 10 zeichen ein zeilen umbruch gemacht wird, jedoch ist dieser zufällig.

...zur Frage

Python Programm schreiben?

Kann mir jemand helfen dieses Programm in Python zu schreiben, ich bekomme es einfach nicht hin...

Schreibe ein Programm, welches den Benutzer fragt, aus wie vielen Basen eine DNA- Sequenz besteht. Mit Hilfe einer For-Schleife soll der Benutzer die Basen eingeben. Die DNA-Sequenz soll gespeichert und ausgegeben werden. Bemerkung: Erstelle zunächst einen leeren String: dna=".Das Hinzufügen eines Zeichens zu einem String funktioniert so: String=String+neuesZeichen

Die Ausgabe soll so aussehen:

...zur Frage

Javascript zu oberer Zeile springen?

Hey, ich habe ungefähr folgendes Script:

async function xy

*hier steht Script*

Blabla = watch

If watch = undefined

Problem123

Und zwar möchte ich, dass bei Problem123 wieder zum Start der function xy gesprungen wird. Wie geht das?

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen