Home/ Questions/Q 8081479
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T16:44:25+00:00

I require ASP.NET server side code in a SVG that I created. To accomplish

  • 0

I require ASP.NET server side code in a SVG that I created. To accomplish this, I created a .aspx file and inserted the SVG code like this: 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MyPage.aspx.cs"
Inherits="MyApp.MyPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
width="700px" height="700px" onload="initialize()"> 
<script type="text/ecmascript">
<![CDATA[
    SCRIPT HERE 
    <% SERVER CODE %>       
]]>
</script>   
<defs>
    <style type="text/css">
    <![CDATA[     
    SVG STYLES
    ]]>
    </style>
</defs>
    SVG CODE    
    <% SERVER CODE %>
</svg>

This works fine, I can use <% %> and add server side logic into my SVG. However I need to use hidden fields to get information back out of the JavaScript.

As soon as I wrap this code in html and add a form etc; the SVG specific JavaScript will break, namely the createSVGPoint() function. The SVG still renders properly though…

Does anyone know a work around, or a better way to add server side logic to an SVG?

EDIT: Updated Example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
    <script type="text/ecmascript" language="ecmascript">
    var root;
    var svgRoot;
    var xmlns = "http://www.w3.org/2000/svg";

    var mousePoint;
    var transformedPoint;

    function initialize() {
        root = document;
        svgRoot = document.documentElement;
        //alert("hello"); --Works
        mousePoint = svgRoot.createSVGPoint();
        transformedPoint = svgRoot.createSVGPoint();
        alert("hello"); -- Broken            
    }            
</script>
<style type="text/css">    
    .Interactable
    {
        cursor:pointer;
    }
</style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <svg id="mySVG" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
        width="700px" height="700px" onload="initialize()">        
            <g id="WorkSpace" transform="matrix(1, 0, 0, -1, 350, 350)">
            </g>
        </svg>
    </div>
    </form>
</body>
</html>

Also, have tried adding content types in pageLoad()

Response.ContentType = "image/svg+xml";
Response.ContentType = "application/xhtml+xml";
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If your SVG is wrapped in HTML page, than it might make more sense to embed that JS in HTML instead of SVG. Give your SVG element an ID so that you can access it easily, and voila. The scripting is exactly the same.

    I doubt the usefulness of createSVGPoint though, you’d be better with your own Point prototype.

    • 0