Здравствуйте! Передо мной стоит следующая задача:
На странице находится изображение и текстовое поле. На изображении отмечаем область и в текстовое поле вводим название.
сама страница (язык ASP.NET C#):
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Безымянная страница</title>
<script type='text/javascript' src='jsDraw2D.js'></script>
<script type='text/javascript' src='canvas.js'></script>
</head>
<body>
<form id="form1" runat="server">
<div id="del">
<script type="text/javascript">
window.onload('Image1');
</script>
<table>
<tr>
<td>
<asp:Image ID="Image1" runat="server" Height="473px" ImageUrl="~/Иоанн Креститель.png"
Width="721px" />
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="tbText" runat="server" Width="152px" onKeyUp="Change();"></asp:TextBox>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
скрипт canvas.js:
var ox=0;
var oy=0;
var clic = 0; //начало области
window.onload = function (id) {
function curve(pt1, pt2) {
var gr = new jsGraphics(document.getElementById(id));
//Create jsColor object
var col = new jsColor("red");
//Create jsPen object
var pen = new jsPen(col,1);
//Draw a Line between 2 points
gr.drawLine(pen,pt1,pt2);
}
document.images[0].onclick = function(event) {
var event = event || window.event;
var x=event.clientX;
var y=event.clientY;
var pt1 = new jsPoint(ox,oy);
var pt2 = new jsPoint(x,y);
//если не первый клик мыши на картинке, то соединяем точки прямой
if (clic > 0) curve(pt1, pt2);
ox=x;
oy=y;
clic++;
}
};
function Change() {
clic = 0; // в pt1 положить координаты первой точки новой области
//здесь считывается название области, которую только что выделили на картинке
};
Как координаты области и ее название хранить? Каким образом передать эти данные на сервер?