C# 在类似于地图的UI上固定

对不起，如果标题不是很清楚，但我不知道如何准确描述我要找的东西

所以我在scrollviewer中得到了一个非常大的图像：

<ScrollViewer x:Name="scrollView" ZoomMode="Enabled" HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" MinZoomFactor="1" ViewChanged="scrollView_ViewChanged">
    <Grid Width="{Binding Path=ViewportWidth, ElementName=scrollView}">
        <Image x:Name="img" Source="The Known World.jpg" Stretch="UniformToFill"/>
    </Grid>
</ScrollViewer>

我想放置像针一样的UI元素，这些元素会粘在地图上的某个位置，但不会随scrollviewer一起缩放。就像谷歌地图上的城镇名称一样。我尝试过各种方法，比如：

<Scrollviewer>
    <Grid Width="{Binding Path=ScrollableWidth, ElementName=scrollView}"
          Height="{Binding Path=ScrollableHeight, ElementName=scrollView}">
          <!--Pins here-->
    </Grid>
<Scrollviewer>

---

但没有任何表现符合预期。我能做些什么来获得这种行为？

同时这是一个非常有趣和棘手的问题。 我会用画布接近它，我可以用它来正确地将我的PIN放置在图像顶部，并确保它们的位置将保持固定，而不管滚动查看器的位置如何

当你说你不想让管脚在滚动查看器中缩放时，棘手的部分就来了。我唯一的想法是，您可以尝试跟踪滚动查看器上的缩放比例，并将其反向应用于管脚（因此，如果滚动查看器的缩放比例为1，则管脚上的缩放比例为1，如果缩放比例为2，则管脚上的缩放比例为1/2）

我不确定这是否可行，但值得一试。

有趣：）

我的想法是。。。在滚动查看器上放置一个pin层

<Grid>
  <ScrollViewer x:name="imageSv" >
  </ScrollViewer>
  <Canvas x:name="pinCanvas" />
</Grid>

您可能知道销的“基于图像”xy位置。并且，当用户滚动或放大/缩小滚动查看器时，可以获得xy偏移和缩放比率。然后，可以计算销的重叠xy位置，并在pinCanvas上绘制它

---

这种想法的优点是-您可以避免引脚缩放过程

我从亚历克斯·德雷尼亚的答案中找到了一个解决方案：

<ScrollViewer x:Name="scrollView" ZoomMode="Enabled" HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" MinZoomFactor="1" ViewChanged="scrollView_ViewChanged" ViewChanging="scrollView_ViewChanging" Visibility="Visible">
    <Viewbox x:Name="vb" Height="{Binding Path=ViewportHeight, ElementName=scrollView}">
        <Grid>
            <Image x:Name="img" Stretch="UniformToFill" Source="The Known World.jpg"/>
            <local:PinPoint Text="Hardhome" MinZoom="0.9" Size="{Binding ElementName=scrollView, Path=ExtentHeight, Converter={StaticResource conv},ConverterParameter=scrollView}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="2825,261,0,0"/>
        </Grid>
    </Viewbox>
</ScrollViewer>

public class ViewBoxConstantFontSizeConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {

        return 100 / (double)value * 20;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}