JSコードのレスポンステキストの要素を使用

Question

ファイルの内容を取得するロジックをいくつか行います。

私はSVGファイルを持っていると私はコード内のファイルを読む必要が

私の問題はここから始まる$.ajax()機能

$.ajax({ 
    method: 'get', 
    url: shapes.svg, 
    dataType: 'html' 
}).then(function (value) { 
    // HTML code from SVG file. 
    console.log(value); 
}); 

を使用することにより、これを行う... は、今私は、プレーンテキストを持っていると私は必要文書を使用してJS関数を使用することができます。私は正確にgetBBox()

だから、必要

は、私がdocument.createElment()のようなものを使用したいが、それは唯一のHTMLタグ名ではありませんその属性を持つすべての要素を受け入れます。以下

は、応答の一部であるSVGファイルから

<svg x="0" y="0" width="2200" height="2200" version="1.1" xmlns="http://www.w3.org/2000/svg" id="svgimportshapes" xlink="http://www.w3.org/1999/xlink"> 
     <g xmlns="http://www.w3.org/2000/svg" data-paper-data="&quot;unlocked&quot;" id="ShapeLayer" fill="none" fill-rule="nonzero" stroke="none" stroke-width="none" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"> 
     <text x="1018.68119" y="511.99246" id="text" fill="#000000" stroke="none" stroke-width="1" font-family="helvetica" font-weight="normal" font-size="18" text-anchor="start">Parterre places debout</text> 
    </svg> 

Answer 1

あなたはバウンディングボックスを得るために最初のDOMに追加する必要があります。下の例では、スクリーンの左に-10000pxオフセットされたtemp divを使用して、svgがそこに追加され、getBBox（）が値を返します。 bboxを取得したら要素を削除します。それは最適な解決策ではありませんが、あなたはその考えを得ています。

$(document).ready(function(){ 
 
    var svgstr= '<svg x="0" y="0" width="2200" height="2200" version="1.1" xmlns="http://www.w3.org/2000/svg" id="svgimportshapes" xlink="http://www.w3.org/1999/xlink">  <g xmlns="http://www.w3.org/2000/svg" data-paper-data="&quot;unlocked&quot;" id="ShapeLayer" fill="none" fill-rule="nonzero" stroke="none" stroke-width="none" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal">  <text x="1018.68119" y="511.99246" id="text" fill="#000000" stroke="none" stroke-width="1" font-family="helvetica" font-weight="normal" font-size="18" text-anchor="start">Parterre places debout</text> </svg>' 
 
    
 
    var svgElement = $(svgstr) 
 
    $("#temp").append(svgElement) 
 
    var bbox = svgElement[0].getBBox() 
 
    svgElement.remove() 
 
    console.log(bbox) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="temp" style="position:absolute;left:-10000px"></div>