javascriptgoogle-mapsrazorinfowindowumbraco6

Embed image inside info window using Razor and JS

I have some Razor code to get the details for the map and then passing this data into the Javascript code. All works as expected but then i need to add the image inside the infoWindow and so far it just displays it as text. My code

@inherits umbraco.MacroEngines.DynamicNodeContext

<script type="text/javascript">

var MapLocations = [
@if (Model.Children.Where("Visible").Any())
{
    var naviLevel = Model.Children.Where("Visible").First().Level;

        foreach (var childPage in Model.Children.Where("Visible"))
        {
            var LatLng = @childPage.LatLng;
            var LocationName = @childPage.CustomerName;
            var Image = "<img src=\"" + @Model.MediaById(@childPage.image).umbracoFile + "\" alt=\"Alt text\" height=\"115\" width=\"83\">";

            <text>['@LatLng' + @LocationName + '@Image'],</text>
        }
 }
    ];

How could i add the image inside the infoWindow and ensuring it doesnt display as text but renders the image?

Solution

  • Can you output like @Html.Raw(...) instead, maybe?