height, width = 200, 200
start, stop, step = 0, 200, 10

# get uniform x, y positions
x, y = np.meshgrid(np.arange(start, stop, step), np.arange(start, stop, step))

x = x.ravel()
y = y.ravel()

num_pts = x.shape[0]
num_frames = 500

# positions of each vector as [n_points, 2] array
positions = np.column_stack([x, y])
positions = np.broadcast_to(positions[None, :, :], (num_frames, num_pts, positions.shape[1]))
# directions of each vector as a [n_points, 2] array
directions = np.random.rand(*positions.shape) 

data = np.stack([positions, directions], axis = -1)

img_data = np.random.rand(num_frames, height, width)



ref_range = {"time": (0, num_frames, 1)}
extents = {"raw data": (0, 1, 0, 1)}

np.random.rand
ndw = fpl.NDWidget(
    ref_range,
    extents=extents,
    names=[
        "raw data",
    ],
    controller_ids=[
        ["raw data"],
    ],
    size=(1200, 1200),
)

frame_timings = np.arange(num_frames)
movie_dims = ["time", "m", "n"]
movie_spatial_dims = ["m", "n"]
movie_index_mapping = {"time": frame_timings}
img_graphic = ndw["raw data"].add_nd_image(
    img_data,
    movie_dims,
    movie_spatial_dims,
    slider_dim_transforms=movie_index_mapping.copy(),
    name="raw img data",
)


vector_dims = ["time", "num vecs", "vec dim", "stack dim"]
spatial_dims = ["num vecs", "vec dim", "stack dim"]
vec_graphic = ndw['raw data'].add_nd_vector(data=data,
                                    dims=vector_dims,
                                    spatial_dims = spatial_dims,
                                    name='vec img data')


ndw.show()