React-plotly Svg transform

I'm trying to use react-plotly inside a foreign object within an Svg, this works fine as shown here.
https://codepen.io/anon/pen/eyYjgr

However I would like to move this object using a transform.
<foreignObject id={"TestSvgFO"} width="100%" height="100%" transform="translate(150, 0)" xmlns="http://www.w3.org/2000/svg">

This results in sliding the view window off the plotly graph instead of moving it.
https://codepen.io/anon/pen/qpByMe

Any suggestions on a way to get it to move correctly in an Svg object with a transform?

(edited your links so they work - alexcjohnson)

まず、リンクされている2つのCodePenの例で動作を再現し、動作するforeignObjectのケースとtransformされたケースを比較します。SVG foreignObject内でreact-plotlyがどのように動作するかを追跡し、報告されているviewportのずれが想定されたものか、それともバグなのかを判断します。完了条件は、plotをtransformとともに移動させる、確認済みの方法を文書化または検証することです。