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

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

XAML

<Window x:Class="WpfApplication3.MainWindow"

        xmlns="

        xmlns:x="

        title="MainWindow"

        Height="350"

        Width="525">

    <Grid>

        <Image Name="image" Source="/WpfApplication3component/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

        }

    }

}

是微软未来界面和视觉技术的基础，并且在Windows8中兼容HTML5，仍作为UI主流技术。

一、微软的开放和标准化的界面技术：这个技术之所以能在HTML5的大潮之下仍能持续，主要其自身是XML格式，非常容易迁移和转换，实际上网上wpf的XAML文件转为HTML5或者SVG的工具相当多。在今后的界面开发技术中，我们将会看到这种本质上是XML的XAML文件将和word文件一样地流行（但更幸运的是，它是开放的）。

二、本地和浏览器通吃：只要本地应用存在一天，wpf针对HTML5的优势将存在下去。

所以，你不用担心wpf技术，它与html5将是一样的方向，市场将会充满大量相关的工具去实现转换，就象mp3文件与wma文件一样。

WPF就没必要折腾了，微软现在开搞Metro了。

C++和Html5其实代表两种完全不同的职业道路，C++是系统软件程序员，Html5主要是网站前端。

Html5标准还没敲定，如果没基础的不是已经在干这行的，就先没必要进去了。

---