javascript

[solisoul]

3. Напишите функцию showGraph() ,которая будет принимать неограниченное количество аргументов (целых чисел) и строить разноцветный график

[Utkin]

Написал, работает на ура. Что-то еще?

[challengerr]

Я не знаю как делать вашу задачу. В первую очередь зашел в гугл написал запрос javascript reference. Затем написал запрос html5 reference.

После этого запрос html5 canvas. Первой ссылкой в выдаче является статья http://habrahabr.ru/post/111308/ (06.01.2011 CANVAS шаг за шагом: Основы)

Открываю блокнот. Сохраняю файл как 1.htm и пишу в нем

<canvas height="320" width="480" id="example"></canvas>

Canvas это средство для вывода графика. Продолжаю читать статью. Пишу в соответствии со статьей далее

<script>
var example = document.getElementById("example");
ctx = example.getContext("2d");
ctx.fillRect(0,0, example.width, example.height);
</script>

Проверяю. Все работает.

Дальше возникает вопрос, откуда вы будете брать точки для вывода графика? И каким образом будут выводится оси? Варианты:
1. оси не выводим
2. оси выводим разделив всю область canvas на четыре.

Я не помню как объявлять массив в javascript поэтому возвращаюсь к странице, которую google выдал по запросу javascript reference. По первой же ссылке перехожу на страницу
https://developer.mozilla.org/ru/doc...ript/Reference
Перехожу по второй ссылке http://www.w3schools.com/jsref/
Не могу найти то что нужно. Тогда я открываю исходный код html страницы и смотрю, как они объявляют массив
Методом проб и ошибок пытаюсь объявить массив, но оно не работает.

var a(); // ошибка
a[0] = 1;
alert (a[0]);

Захожу снова в google пишу запрос "объявление массива в javascript" Перехожу по первой ссылке http://javascript.ru/basic/array Простой формой объявления массива является

var a =[]

Изменяю немного предыдущий код. Получаю

var a = []; // работает
a[0] = 1;
alert (a[0]);

Для хранения точек в одномерном массиве последовательно записываем точки.
Возвращаюсь к статье http://habrahabr.ru/post/111308/
Пишу следующее

var a = [1, 1, 2, 2, 3, 3, 4, 4];

for (i = 0; i < 8 ; i+=2)
{
if (i+3 < 8)
{
ctx.moveTo(a[i], a[i+1]);
ctx.lineTo(a[i+2], a[i+3]);
}

}

Проверяю. Не могу понять рисуются линии или нет. Я не вижу линию, это может происходить по причине того, что черным рисую на черном либо же по причине того, что упущены какие-то составляющие части в правильной последовательности работы с элементом управления. Меняю цвет заливки на оранжевый. Вижу что линия рисуется.
Итого код

<canvas height="320" width="480" id="example"></canvas>
<script>
var example = document.getElementById("example");
ctx = example.getContext("2d");
ctx.fillStyle="orange";
ctx.fillRect(0,0, example.width, example.height);
ctx.beginPath();

var a = [1, 1, 2, 2, 3, 3, 4, 4];

for (i = 0; i < 8 ; i+=2)
{
if (i+3 < 8)
{
ctx.moveTo(a[i]*10, a[i+1]*10);
ctx.lineTo(a[i+2]*10, a[i+3]*10);
}

}
ctx.stroke();



</script>