Text Paths don't really move like other nodes. The data
attribute is what determines the points that are displayed, regardless of the node's actually x/y position. As you noted, changing the data attribute doesn't work (plus who wants to recalculate all of those points for every movement?)
Since the points in the data
attribute are relative to the node's parents, I think the easiest method would be to wrap the Text Path in a group and then move the group around using .move()
or .setPosition()
as needed.
Example (code adapted from the Text Path Tutorial):
var stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 220
});
var layer = new Kinetic.Layer();
var textpath = new Kinetic.TextPath({
x: 100,
y: 50,
fill: '#333',
fontSize: '24',
fontFamily: 'Arial',
text: 'All the world\'s a stage, and all the men and women merely players.',
data: 'M10,10 C0,0 10,150 100,100 S300,150 400,50'
});
var group = new Kinetic.Group();
group.add(textpath);
group.move({x:50, y:50});
layer.add(group);
stage.add(layer);