동적으로 핫스팟 영역을 만들었으며이 핫스팟 영역의 색을 변경하고 싶습니다. 어떻게이 작업을 수행 할 수 있습니까? 또한 핫스팟 영역의 경계를 표시하려고합니다. 이미지 맵에서 핫스팟 영역의 색을 설정하는 방법
다음은 동적으로protected void txtall_TextChanged(object sender, EventArgs e)
{
string[] arr = txtall.Text.Split(',');
//create hotspot once there are 10 cordinates
if (arr.Length == 10)
{
PolygonHotSpot Polygon1 = new PolygonHotSpot();
Polygon1.Coordinates = arr[0].ToString() + "," + arr[1].ToString() + "," + arr[2].ToString() + "," + arr[3].ToString()
+ "," + arr[4].ToString() + "," + arr[5].ToString() + "," + arr[6].ToString() + "," + arr[7].ToString() + "," + arr[8].ToString() + "," + arr[9].ToString();// "128,185,335,157,400,224,400,400,228,400";
Polygon1.NavigateUrl="http://www.google.com";
Polygon1.AlternateText = "Southern Region";
ImageMap1.HotSpots.Add(Polygon1);
}
}
내가 here에서 jQuery를 사용하려 한 C#에서 이미지 맵에서 핫스팟을 만들 수있는 내 코드입니다하지만 난 성공할 수 없습니다입니다. 나는 jquery에 절대적으로 새로운, 나는 단순히 jquery 함수를 붙여 넣기 복사하고 참조를 추가했지만 그것은 나를 위해 작동하지 않았다. 위의 링크에서 붙여 넣기 복사하기 만하면 js 코드를 shw 오전. 누구나 간단한 스타일을 제공하거나 어떤 자바/jquery 함수 그래서 내가 핫스팟 영역에 효과를 볼 수 있습니까?
친절하게 도움을드립니다. 감사합니다.
는 UPDATE .. 코드는 경우 잘 작동 JAVASCRIPT
<script type="text/javascript" src="JS/JScript.js"></script>
//
<script type="text/javascript" src="JS/jquery.imagemapster.js"></script>
<script type="text/javascript">
function point_it(event) {
pos_x = event.offsetX ? (event.offsetX) : event.pageX - document.getElementById("pointer_div").offsetLeft;
pos_y = event.offsetY ? (event.offsetY) : event.pageY - document.getElementById("pointer_div").offsetTop;
document.getElementById("ImageMap1").style.left = (pos_x - 1);
document.getElementById("ImageMap1").style.top = (pos_y - 15);
document.getElementById("txt1").value = pos_x;
document.getElementById("txt2").value = pos_y;
if (document.getElementById("txtall").value == "") {
document.getElementById("txtall").value = pos_x + "," + pos_y;
}
else {
document.getElementById("txtall").value = document.getElementById("txtall").value + "," + pos_x + "," + pos_y;
}
var str = document.getElementById("txtall").value;
var stringArray = new Array();
stringArray = str.split(",");
for (i = 0; i < stringArray.length; i++) {
stringArray[i];
}
if (i == 10) {
//Creates Hotspot Dynamically
__doPostBack('txtall ', '');
//Effects to be applied for the hotspot created
var image = $('#ImageMap1');
image.mapster(
{
fillOpacity: 0.4,
fillColor: "d42e16",
stroke: true,
strokeColor: "3320FF",
strokeOpacity: 0.8,
strokeWidth: 4,
singleSelect: true,
mapKey: 'name',
listKey: 'name',
areas: [
{
fillColor: "ffffff"
},
]
});
}
//Clears hotspot
if (i >= 10) {
__doPostBack('txtall ', '');
str = "";
i = 0;
stringArray = [];
}
}
</script>
ASPX 내가 point_it(event)
로 예외가보다 내가 JQuery와 image.mapster
을 넣으면
<form name="pointform" runat="server">
<div id="pointer_div" onclick="point_it(event)" style="width: 500px; height: 333px;">
<asp:ImageMap ID="ImageMap1" runat="server" ImageUrl="~/Images/WMap.JPG" Style="width: 500px;
height: 333px;">
</asp:ImageMap>
</div>
<br />
<asp:TextBox ID="txt1" runat="server"></asp:TextBox>
<asp:TextBox ID="txt2" runat="server"></asp:TextBox>
<br />
<asp:TextBox ID="txtall" runat="server" OnTextChanged="txtall_TextChanged" AutoPostBack="true"></asp:TextBox>
</form>
이 정의되어 내가 jqery를 제거합니다.