wpf或HTML5里插入图片，在图片上做标记，点击标记触发事件

你的意思是用canvas2D绘制是吧?
实际上,拿canvas2D绘制,只是把image渲染到 canvas(画布上).而实际的事件,就不能像标签那么处理,应该对canvas的事件做处理.
实现逻辑是这样:
1,添加事件监听,比如说,鼠标按下 做什么,滑动 做什么,弹起做什么.一般鼠标事件都是判断弹起的位置
2,判断有效坐标,在事件中判断坐标位置是否在图片位置,也就是图片在canvas的位置.

ex:
//some code...
canvas.width=400;
canvas.height=400;

var context2d = canvas.getContext("2d");


var img =new Image();
img.src="xxx/xxx.png";
img.onload=function(){
context2d.drawImage(img,X,Y,WIDTH,HEIGTH);
//X=0,Y=0,W=50,H=50
canvas.addEventListener("mouseup", keyUp, false);
}

function keyUp(evt){
Event_UpX = evt.offsetX;
Event_UpY = evt.offsetY;
if(Event_UpX>=绘制坐标X&&Event_UpX<=图片宽度){
if(Event_UpY>=绘制坐标Y&&Event_UpY<=图片高度){
//do something
}
}
}

首先要给图片添加一个Id，之后在jquery中写如下代码：
$("#图片ID").click(function(){
alert("aa”);
});
或者
$("#图片ID").bind("click",function(){
alert("aa");
});

扩展资料：
Click 事件实际应用：
此事件是在一个对象上按下然后释放一个鼠标按钮时发生。它也会发生在一个控件的值改变时。
对一个 Form 对象来说，该事件是在单击一个空白区或一个无效控件时发生。对一个控件来说，这类事件的发生是当： 用鼠标的左键或右键单击一个控件。对 CheckBox, CommandButton, Listbox 或 OptionButton 控件来说，Click 事件仅当单击鼠标左键时发生。
通过按下箭头键或者单击鼠标按钮，对 ComboBox 或 ListBox 控件中的项目进行选择。
当 CommandButton,OptionButton 或 CheckBox 控件具有焦点时，按下 SPACEBAR 键。
当窗体带有其 Default 属性设置为 True 的 CommandButton 控件时，按下 ENTER 键。
当窗体带有一个 Cancel 按钮 — 其 Cancel 属性设置为 True 的 CommandButton 控件时，按下 ESC 键。
对控件按下一个访问键。例如，如果一个 CommandButton 控件的标题是 "&Go"，则按下 ALT+G 键可触发该事件。 也可在代码中触发 Click 事件，通过： 将一个 CommandButton 控件的 Value 属性设置为 True。
将一个 OptionButton 控件的 Value 属性设置为 True。
改变一个 CheckBox 控件的 Value 属性的设置。
参考资料来源：百度百科：Click事件

WPF用RenderTransform实现，随便做了个，代码如下。

XAML

<Window x:Class="WpfApplication3.MainWindow"
        xmlns="

        xmlns:x="

        Title="MainWindow"
        Height="350"
        Width="525">
    <Grid>
        <Image Name="image" Source="/WpfApplication3;component/Images/Hydrangeas.jpg">
            <Image.RenderTransform>
                <TransformGroup>
                    <RotateTransform x:Name="rt"/>
                    <ScaleTransform x:Name="st"/>
                    <TranslateTransform x:Name="tt"/>
                </TransformGroup>
            </Image.RenderTransform>
        </Image>

        <StackPanel Orientation="Horizontal"
                    Height="20">
            <Button Name="btnScale1"
                    Content="缩小"
                    Click="btnScale1_Click" />
            <Button Name="btnScale2"
                    Content="放大"
                    Click="btnScale2_Click" />
            <Button Name="btnRotation1"
                    Content="左转"
                    Click="btnRotation1_Click" />
            <Button Name="btnRotation2"
                    Content="右转"
                    Click="btnRotation2_Click" />
            <Button Name="btnMove1"
                    Content="左移"
                    Click="btnMove1_Click" />
            <Button Name="btnMove2"
                    Content="右移"
                    Click="btnMove2_Click" />
            <Button Name="btnMove3"
                    Content="上移"
                    Click="btnMove3_Click"/>
            <Button Name="btnMove4"
                    Content="下移"
                    Click="btnMove4_Click" />
        </StackPanel>
    </Grid>
</Window>

CS如下

    namespace WpfApplication3
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;
        }

        private bool _ischecked = false;
        public bool IsChecked
        {
            get
            {
                return _ischecked;
            }
        }

        private void btnScale1_Click(object sender, RoutedEventArgs e)
        {
            st.CenterX = image.ActualWidth / 2;
            st.CenterY = image.ActualHeight / 2;
            st.ScaleX -= 0.1;
            st.ScaleY -= 0.1;
        }

        private void btnScale2_Click(object sender, RoutedEventArgs e)
        {
            st.CenterX = image.ActualWidth / 2;
            st.CenterY = image.ActualHeight / 2;
            st.ScaleX += 0.1;
            st.ScaleY += 0.1;
        }

        private void btnRotation1_Click(object sender, RoutedEventArgs e)
        {
            rt.CenterX = image.ActualWidth / 2;
            rt.CenterY = image.ActualHeight / 2;
            rt.Angle -= 10;
        }

        private void btnRotation2_Click(object sender, RoutedEventArgs e)
        {
            rt.CenterX = image.ActualWidth / 2;
            rt.CenterY = image.ActualHeight / 2;
            rt.Angle += 10;
        }

        private void btnMove1_Click(object sender, RoutedEventArgs e)
        {
            tt.X -= 10;
        }

        private void btnMove2_Click(object sender, RoutedEventArgs e)
        {
            tt.X += 10;
        }

        private void btnMove3_Click(object sender, RoutedEventArgs e)
        {
            tt.Y -= 10;
        }

        private void btnMove4_Click(object sender, RoutedEventArgs e)
        {
            tt.Y += 10;
        }
    }
}