0

作成したSVGにASP.NETサーバー側のコードが必要です。これを実現するために、.aspxファイルを作成し、次のようなSVGコードを挿入しました。

<%@ 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>

これは正常に機能します。<%%>を使用して、サーバー側のロジックをSVGに追加できます。ただし、JavaScriptから情報を取得するには、非表示フィールドを使用する必要があります。

このコードをhtmlでラップし、フォームなどを追加するとすぐに; SVG固有のJavaScript、つまりcreateSVGPoint()関数は機能しなくなります。SVGはまだ正しくレンダリングされます...

誰かが回避策、またはサーバー側のロジックをSVGに追加するためのより良い方法を知っていますか?

編集:更新された例

<!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>

また、pageLoad()でコンテンツタイプを追加してみました

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

2 に答える 2

2

SVGがHTMLページでラップされている場合は、そのJSをSVGではなくHTMLに埋め込む方が理にかなっている場合があります。SVG要素にIDを付けて、簡単にアクセスできるようにします。スクリプトはまったく同じです。

createSVGPointの有用性には疑問がありますが、独自のPointプロトタイプを使用した方がよいでしょう。

于 2012-06-12T11:56:55.287 に答える
0

HTMLドキュメントがSVG名前空間を壊している場合は、オブジェクトまたは画像要素を使用して、XHTMLドキュメントの外部エンティティとしてSVGをロードします。

于 2012-06-13T01:22:10.770 に答える