Я тестировал это только для прямоугольных координат, но я думаю, что он должен обобщать на круглые или многоугольники
function wrap ( img, map ) {
var originalCoords = [ ],
test = new Image();
for ( var i = 0; i < map.areas.length; ++i ) {
var coords = map.areas[i].coords;
originalCoords.push( coords.split( "," ).map( parseFloat ) );
}
function resize () {
var ratio = img.width / test.width;
for ( var i = 0; i < map.areas.length; ++i ) {
map.areas[i].coords = originalCoords[i].map( function ( n ) {
return ratio * n;
} ).join( "," );
}
}
test.addEventListener( "load", function () {
window.addEventListener( "resize", resize, false );
resize();
}, false );
test.src = img.src;
}
var imgs = document.querySelectorAll( "img[usemap]" );
for ( var i = 0; i < imgs.length; ++i ) {
var map = document.querySelector( "map[name=" + imgs[i].useMap.substring( 1 ) + "]" );
wrap( imgs[i], map );
}
Most из этих ответов использовать какой-то API, который разбивает 10 строк кода. Каждый вызов API может состоять из сотен строк кода. Оригинальный вопрос говорит, чтобы использовать «Простой код». Для меня это означает отсутствие вызовов API. Какие ответы мы можем придумать, которые просто используют это определение «простого кода»?
В WPF вы можете написать полнофункциональный вид миниатюр в несколько строк XAML:
<ListBox ItemsSource={Binding MyItems}
ScrollViewer.HorizontalScrollBarVisibility="Hidden">
<ListBox.ItemTemplate>
<DataTemplate>
<Image Source={Binding FullPath} Width="50" />
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemsPanel>
<ItemsPanelTemplate><WrapPanel /></ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
Это при условии, что у вас есть коллекция MyItems
элементов, которые содержат Свойство FullPath
, которое указывает на файлы изображений.
Волшебство исходит от ItemTemplate
, который преобразует каждый элемент списка в изображение, и ItemsPanelTemplate
, который изменяется вертикальная панель стека по умолчанию для панели обтекания.
I was blown away by some of the stuff that was shown in the talk Easy AI with Python (video and PDF). For example, teaching a computer how to play Mastermind, solve eight queens, alphametics (those puzzles which are like "9567 + 1085 == 10652" and infer relationships in data. All in the order of 10 lines (possibly with 20 or 30 lines of "behind the scenes" code).
You could have your students go to the codeplex IronPython silverlight sample site which includes a < 10 line demonstration of altering a canvas and interacting with the mouse. You can find the silverlight example here
Just seeing code written in a web browser and then executing an altering a small WPF might be intoxicating for some.
Было весело читать ответы на этот вопрос. Когда вы добьетесь от учеников «вау-фактора», проиллюстрируйте эффект гирляндной цепочки, когда результаты одного становятся входом другого. Изучение того, как работает ввод и вывод, проиллюстрирует идею построения блоков и того, как программное обеспечение растет от множества мелких вещей, решающих конкретные проблемы, до более крупных приложений, решающих более крупные проблемы. Если несколько 10-строчных программ могут быть крутыми, как здорово было бы объединить их вместе? Это нелинейно круто.
Посмотрите на эти проекты:
Может быть, это глупо, но я думаю, что дети интуитивно поймут это - мультфильм, который начался с целого «Какой ваш любимый мультфильм« программист »?» at Какой твой любимый мультфильм «программист»? .
Например, Джейсон Фокс из Foxtrot пишет на доске код, который делает цикл.
Возможный интерес: программирование может помочь вам решить некоторые проблемы. время ...
As a supplement to whatever ideas you come up with, I say you should just show them how to do some basic math. Present it as
"now you might think this is easy or complicated... but have you ever been stuck on your math homework?"
Then just pull out an example from someone's book. Most math problems can be solved in 10 lines as it will likely be a simple problem. Then show them how spending 10 minutes to figure it out might be worth the A they might get. It's a long stretch, but you might catch a few who want to spend little to no time doing homework.
This mostly stems from me having wished I had thought of writing a software program back in chemistry... all those quizzes and homeworks would have been 100s...
Edit: Чтобы ответить на комментарий Питера:
Скажите что-то вроде того, что является производной от 3a 2 . Таким образом, вы можете просто показать простую функцию, которую они могут вызывать из командной строки:
public int SimpleDerivative(int r, int exponent){
r = r * exponent
exponent =- 1
return (String "{0}a^{1}" where {0} = r, {1} = exponent)
}
I don't have code for this, however it could be abstracted in 10 lines or less. Make the mouse draw a box .. however you move it. when you click (left) the box vanishes, when you click (right) the box changes color.
Students want something practical, something they can hack and customize, something that says this "is not your typical boring class".
Xen's mini-os kernel does this now, but it would require additional abstraction to fit your needs.
You could also try plotting a manderbolt (julia) set while getting the paramaters of the quadratic plane from ambient noise (if the machines have a microphone and sound card) .. their voice generates a fractal. Again, its going to be tricky to do this in 10 lines (in the actual function they edit), but not impossible.
In the real world, you are going to use existing libraries. So I think, 10 lines in main() (or whatever language you use) is more practical. We make what exists work for us, while writing what does not exist or does not work for us. You may as well introduce that concept at the beginning.
Also, lines? int main(void) { unsigned int i; for (i=0; i < 10; i++); return 0; } Perhaps, 10 function calls would be a more realistic goal? This is not an obfuscated code contest.
Good luck!
Я читал урок для студентов с нарушениями обучения, в возрасте 11-12 лет. Мы использовали Гиперкарту, и они обнаружили, что могут записывать положение объекта (изображение, прямоугольник и т. Д.) По мере его перемещения и воспроизведения (анимация). Хотя это не кодирование, они хотели сделать больше как: удалить один из ходов, не записывая его заново. Я сказал им, что им придется перейти к коду и изменить его.
Вы могли видеть, кто был склонен к компьютерам / программированию, когда они предпочитали делать это с кодом, потому что у них было больше контроля.
Выполнение сложного макроса в Excel, а затем изучение того, что делает код, может стать воротами к VBA.
В зависимости от возрастной группы или уровня интереса, может быть сложно перейти прямо в код, но это конечный результат.
Когда я был ребенком, это была самая крутая вещь в истории:
10 PRINT "BEDWYR "
20 GOTO 10
Думаю, в наши дни это не сильно удастся;)
import sys
for y in range(80):
for x in range(80):
c = complex(x-40.0,y-40.0) / 20.0
z = 0.0
for i in range(100):
z = z*z+c
sys.stdout.write('#' if abs(z) < 2.0 else ' ')
sys.stdout.write('\n')
When Steve Wozniak built his first Apple II he liked to show it off with a Breakout game in Apple Basic, typed in on the spot. I think it actually was around 10 lines; I wish I had it to paste in here. You could probably also do it in a system like Processing.
If you're teaching engineers, this bit of Prolog might get their attention:
d(x,x,1).
d(C,x,0):-number(C).
d(C*x,x,C):-number(C).
d(-U, X, -DU) :- d(U, X, DU).
d( U + V, x, RU + RV ):-d(U,x,RU), d(V,x,RV).
d( U - V, x, RU - RV ):-d(U,x,RU), d(V,x,RV).
d(U * V,x, U * DV + V * DU):- d(U,x,DU), d(V,x,DV).
d(U^N, x, N*U^(N-1)*DU) :- integer(N), d(U, x, DU).
Just write down the rules, and you have a program that can do all of first semester calculus, in 8 lines of code.
I remember finding simple loops amazing. Each time I learn a new language I usually throw something like this together:
<?php
$numberOfBottles = 99;
print("<h1>$numberOfBottles Bottles of Beer on the Wall</h1>");
print("$numberOfBottles bottles of beer on the wall,<br />");
print("$numberOfBottles bottles of beer!<br />");
print("Take one down, pass it around,<br />");
for($numberOfBottles--; $numberOfBottles>1; $numberOfBottles--)
{
print("$numberOfBottles bottles of beer on the wall!<br />");
print("<br />");
print("$numberOfBottles bottles of beer on the wall,<br />");
print("$numberOfBottles bottles of beer!<br />");
print("Take one down, pass it around,<br />");
}
print("One last bottle of beer on the wall!");
?>
Maybe some variations with while or foreach loops would be easy too.
Возможно, учитывая эти два критерия, Javascript с Processing.js или Flash может быть хорошей отправной точкой, хотя У Flash, очевидно, есть обратная сторона, так как она требует .. э ... Flash.
Тангенциальная мысль:
Числа Фибоначчи - отличный пример для изучения рекурсивности. Это показывает, что рекурсивность может быть простой для написания и может быть дорогостоящей для выполнения. Случай отрицательных записей может быть представлен позже.
int fiboNumber(int index)
{
if (index <= 1)
{
return index;
}
return fiboNumber(index - 1) + fiboNumber(index - 2);
}
Я думаю, что любой сценарий оболочки, который может делать что-то полезное, является отличным способом показать кому-нибудь силу программирования. Возможность потратить 10-20 минут на небольшой скрипт, который автоматизирует другую задачу и сэкономит вам бесчисленное количество часов, очень впечатляет, imo.
Например, я однажды написал простой скрипт Perl для преобразования файлов mp3 из одного каталога в другой. форматировать, и они записывают их на компакт-диск. Вы вызываете скрипт с путем к каталогу MP3, и он записывает компакт-диск. По крайней мере, тогда я был впечатлен.
С обработкой всегда интересно играть, и она создает вещи, которые впечатляют всех людей. Например, броуновское дерево:
int xf = (int) random(width);
int yf = (int) random(height);
int x = (int) random(width);
int y = (int) random(height);
background(0xFF);
while(x != xf || y != yf) {
set(x,y,color(0,0,0));
x = max(0, min(x + -1 + (int) random(3), width - 1) );
y = max(0, min(y + -1 + (int) random(3), height - 1) );
}
Многие люди находят азартные игры захватывающими и мотивирующими. Вы можете сами создать класс дилеров в блэкджек, открыв интерфейс. Затем попросите детей построить класс игроков в блэкджек.
Вы можете построить график для решения каждого ученика, показывающий соотношение денег и времени, чтобы мотивировать задачу.
Прелесть этой системы в том, что вы можете создавать поэтапные решения в течение нескольких недель:
Наивное решение - всегда бить ниже определенного уровня. Это может быть 5 строк кода.
Лучшее решение - посмотреть на то, что разоблачил дилер, и скорректировать для этого свои удары.
Еще лучшее решение учитывает реальные карты, которые у вас есть, а не только сумму их значений.
Окончательным решением, вероятно, является отслеживание сданных карт на протяжении многих рук. (Объект дилера может вызвать DealerIsShuffling (int numberofdecks) к объекту player, сообщая игроку, сколько колод существует.)
Еще одно направление, в котором это могло бы быть, - сделать игру конкурентоспособной - вместо выигрыша денег у дилера. , вы играете против чужих решений. Конечно, чтобы все было честно, нужно менять, кто первым начинает бить.
Логотип всегда является отличной отправной точкой.
Брайан Харви. На странице UCBLogo есть этот короткий пример :
Вот короткая, но полная программа на логотипе Berkeley:
для выбора: menu [: sofar []] если пустоp: меню [печать: софар стоп] foreach first: menu [(варианты, но сначала: предложение меню: sofar?)] конец
А вот как вы это используете. Вы вводите
вариантов [[small medium large] [ваниль [ультра шоколад] личи [ром изюм] имбирь] [чашка конуса]]
и Logo отвечает
маленький ванильный рожок маленькая чашка ванили маленький ультра шоколадный рожок маленькая ультра шоколадная чашка маленький конус личи маленькая чашка личи небольшой рожок с изюмом маленькая чашка рома с изюмом небольшой имбирный рожок маленькая чашка имбиря средний ванильный рожок средняя чашка ванили средний ультра шоколадный рожок средняя ультра чашка шоколада средний конус личи средняя чашка личи средний рожок с изюмом средний стакан с изюмом средний конус имбиря средняя чашка имбиря большой ванильный рожок большая чашка ванили большой ультра-шоколадный рожок большая ультра чашка шоколада большой конус личи большая чашка личи большой ром с изюмом большая чашка рома с изюмом большой имбирный рожок большая чашка имбиряВ программе ничего не сказано о размере встроенного меню. Вы можете использовать любое количество категорий и любое количество возможностей в каждой категории. Давайте посмотрим, как вы это сделаете в четырех строках Java!
Я думаю, что это действительно хорошая идея. У меня было много отстойных учителей, и в одном из них, очевидно, были ребята, у которых было желание немного похвастаться.
Есть много кода, который вы можете им показать. Первое, что приходит мне в голову, это исходный код TinyP2P Эда Фелтена :
import sys, os, SimpleXMLRPCServer, xmlrpclib, re, hmac # (C) 2004, E.W. Felten
ar,pw,res = (sys.argv,lambda u:hmac.new(sys.argv[1],u).hexdigest(),re.search)
pxy,xs = (xmlrpclib.ServerProxy,SimpleXMLRPCServer.SimpleXMLRPCServer)
def ls(p=""):return filter(lambda n:(p=="")or res(p,n),os.listdir(os.getcwd()))
if ar[2]!="client": # license: http://creativecommons.org/licenses/by-nc-sa/2.0
myU,prs,srv = ("http://"+ar[3]+":"+ar[4], ar[5:],lambda x:x.serve_forever())
def pr(x=[]): return ([(y in prs) or prs.append(y) for y in x] or 1) and prs
def c(n): return ((lambda f: (f.read(), f.close()))(file(n)))[0]
f=lambda p,n,a:(p==pw(myU))and(((n==0)and pr(a))or((n==1)and [ls(a)])or c(a))
def aug(u): return ((u==myU) and pr()) or pr(pxy(u).f(pw(u),0,pr([myU])))
pr() and [aug(s) for s in aug(pr()[0])]
(lambda sv:sv.register_function(f,"f") or srv(sv))(xs((ar[3],int(ar[4]))))
for url in pxy(ar[3]).f(pw(ar[3]),0,[]):
for fn in filter(lambda n:not n in ls(), (pxy(url).f(pw(url),1,ar[4]))[0]):
(lambda fi:fi.write(pxy(url).f(pw(url),2,fn)) or fi.close())(file(fn,"wc"))
Хорошо, это на 5 строк больше, чем вы ограничиваете «десять», но все же полностью функциональное приложение Peer 2 Peer, спасибо Python.
TinyP2P может работать как сервер:
python tinyp2p.py password server hostname portnum [otherurl]
и как клиент:
python tinyp2p.py password client serverurl pattern
Тогда, конечно, рассказывание историй очень важно. Для этой цели 99 бутылок пива - действительно хорошее начало.
Затем вы можете взять несколько примеров забавного кода, например:
знаменитый однострочник Python:
print ("" .join (map (lambda x: x and "% s% d бутылка% s пива на стене,% d бутылка% s пива ...
print re.sub ('
|
|
', '\ n', re.sub ('Нет ',' \ nНет ',
urllib.URLopener () .open ('http://www.99-bottles-of-beer.net/lyrics.html') .read () [3516: 16297])))
В конце концов я последую предыдущие советы и покажите немного Javascript, потому что он очень наглядный. Веб-сайт jQuery UI Demo - это множество хороших демонстраций виджетов, включая фрагменты. календарь в нескольких строках:
<script type="text/javascript">
$(function() {
$("#datepicker").datepicker();
});
</script>
<div class="demo">
<p>Date: <input id="datepicker" type="text"></p>
</div>
Букмарклеты тоже обладают большой сексуальной привлекательностью. Читаемость довольно интересна:
function() {
readStyle='style-newspaper';readSize='size-large';
readMargin='margin-wide';
_readability_script=document.createElement('SCRIPT');
_readability_script.type='text/javascript';
_readability_script.src='http://lab.arc90.com/experiments/readability/js/readability.js?x='+(Math.random());
document.getElementsByTagName('head')[0].appendChild(_readability_script);
_readability_css=document.createElement('LINK');
_readability_css.rel='stylesheet';
_readability_css.href='http://lab.arc90.com/experiments/readability/css/readability.css';
_readability_css.type='text/css';_readability_css.media='screen';
document.getElementsByTagName('head')[0].appendChild(_readability_css);
_readability_print_css=document.createElement('LINK');
_readability_print_css.rel='stylesheet';_readability_print_css.href='http://lab.arc90.com/experiments/readability/css/readability-print.css';
_readability_print_css.media='print';
_readability_print_css.type='text/css';
document.getElementsByTagName('head')[0].appendChild(_readability_print_css);
}
Попросите учеников запрограммировать Magic 8ball. Базовый 8ball, отвечающий «да» или «нет», вероятно, может быть запрограммирован менее чем в 10 строках кода, и его можно постепенно расширять любым количеством способов:
Magic 8ball - это то, к чему может относиться большинство людей, и это введение в основные строки, числа с плавающей запятой / целочисленными значениями, ввод-вывод, CLI, логические значения и RNG, используя только самые простые инструменты. И это просто, (несколько) весело, и его легко можно расширить. В зависимости от вашего подхода, вы можете сразу сделать программирование объектно-ориентированным, используя класс 8ball (), класс YesAnswer () и еще много чего.
Удачи; -)
s вокруг текстаMagic 8ball - это то, к чему может относиться большинство людей, и это введение в основные строки, числа с плавающей запятой / целочисленными значениями, ввод-вывод, CLI, логические значения и RNG, используя только самые простые инструменты. И это просто, (несколько) весело, и его легко можно расширить. В зависимости от вашего подхода, вы можете сразу сделать программирование объектно-ориентированным, используя класс 8ball (), класс YesAnswer () и еще много чего.
Удачи; -)
Этот код PHP работает только на Mac через командную строку, но очень полезен, когда все хотят поиграть в Twister
$lr = array('left', 'right');
$hf = array('hand', 'foot');
$colour = array('red', 'yellow', 'blue', 'green');
while(true) {
$a = $lr[array_rand($lr)];
$b = $hf[array_rand($hf)];
$c = $colour[array_rand($colour)];
system("say $a $b $c");
sleep(5);
}
Программа на языке C для вычисления значения числа пи:
#include <stdlib.h>
#include <stdio.h>
long a=10000,b,c=2800,d,e,f[2801],g;
int main()
{
for(;b-c;)
f[b++]=a/5;
for(;d=0,g=c*2;c-=14,printf("%.4d",e+d/a),e=d%a)
for(b=c;d+=f[b]*a,f[b]=d%--g,d/=g--,--b;d*=b);
}
Вывод:
31415926535897932384626433832795028841971693993751058209749445923078164062862089
98628034825342117067982148086513282306647093844609550582231725359408128481117450
28410270193852110555964462294895493038196442881097566593344612847564823378678316
52712019091456485669234603486104543266482133936072602491412737245870066063155881
74881520920962829254091715364367892590360011330530548820466521384146951941511609
43305727036575959195309218611738193261179310511854807446237996274956735188575272
48912279381830119491298336733624406566430860213949463952247371907021798609437027
70539217176293176752384674818467669405132000568127145263560827785771342757789609
17363717872146844090122495343014654958537105079227968925892354201995611212902196
0864034418159813629774771309960518707211349999998372978049951059731732816096318
10 PRINT "HELLO"
20 GOTO 10
Но тогда я был совсем ребенком. Вот почему это была самая крутая вещь. Я не думаю, что вы когда-нибудь сможете получить такую же спешку с самого первого раза, когда запрограммируете компьютер. Даже если это так просто, как бесконечно печатать «HELLO» на консоли.
Здесь - это программа на языке A-Prolog, которая вычисляет N раскраски графа («c» обозначает цвета, «v» обозначает вершины, а «e» обозначает ребра).
c(1..n).
1 {color(X,I) : c(I)} 1 :- v(X).
:- color(X,I), color(Y,I), e(X,Y), c(I).
Кстати, в прошлом семестре я волновал своих студентов, рассказывая им историю. Это звучало примерно так: «Представьте треугольник. Это чисто математический объект, настоящих треугольников не существует. Мы можем рассуждать о них, обнаруживать их свойства, а затем применять эти свойства к решениям реального мира. Алгоритм также является чисто математическим методом. математический объект. Программирование - это форма магии. Мы можем взять математический объект, описать его языком, и вот, он может манипулировать физическим миром. Программирование - это уникальная дисциплина, которая соединяет эти два мира ".
{ {1}}Во-первых, чтобы получить максимальное внимание в минимальное время, вы захотите использовать язык высокого уровня. probably you'll want to show 3D.
I'd go with Opengl - I'd start by showing a short scene from a 3d computer game, then explaining, that this was done by dividing the big program into smaller parts, and then showing them how a little part may look like. something like lesson 05 on nehe.gamedev.net, or maybe even a more advanced lesson. it's quite impressive, and not too complicated.
Also you may want to check Alice which contains 3d and was designed to teach..
Something like ...
10 rem twelve times table
20 For x = 1 to 12
30 For y = 1 to 12
40 print using"####";x*y;
50 next y
60 print
70 next x
80 end
хм, я помню, как делал снежинки и огонь в QBasic , когда пришел друг и показал мне, как сделать вращающийся трехмерный куб и полностью взорвал мой ум.
А потом я изменил свой огонь на куб, и это были хорошие времена.
Нужно было посмотреть, смогу ли я найти где-нибудь эти старые сценарии, они не были очень длинными.