объект d3.event в QtWebKit

Я пытаюсь использовать d3js внутри qtWebKit. В частности, я создал следующую тестовую страницу:

<!DOCTYPE html>
<meta charset="utf-8">
<style>

rect.pane {
  cursor: move;
  pointer-events: all;
}

</style>
<body>
<script type="text/javascript" src="d3.min.js"></script>
<script type="text/javascript">
var margin = {top: 20, right: 60, bottom: 30, left: 20},
    width = 960 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom;

// svg
var svg = d3.select("body").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

var zoom = d3.behavior.zoom()
    .on("zoom", draw);

svg.append("rect")
    .attr("class", "pane")
    .attr("width", width)
    .attr("height", height)
    .call(zoom);


function draw() {
    console.log(d3.event);
}
</script>

Целью этого HTML-кода является прямое «срабатывание» события прокрутки и получение значения масштаба из объекта d3.event, как описано в https://github.com/mbostock/d3/wiki./Zoom-Behavior.

Если я загружу этот пример в chrome, посмотрев на консоль, я увижу объект d3.event:

Object {type: "zoom", scale: 1.0511729090877093, translate: Array[2], sourceEvent: WheelEvent, target: function}

Теперь я вставил этот пример в виджет qtWebKit; используя QMainWindow:

MainWindow::MainWindow(QWidget *parent) :
  QMainWindow(parent),
  ui(new Ui::MainWindow),
  view(new QWebView(this))
{
  ui->setupUi(this);
  setCentralWidget(view);
  view->load(QUrl("qrc:/html/test.html"));

  QWebFrame *webFrame = view->page()->currentFrame();
  webFrame->addToJavaScriptWindowObject(QString("callback"), this);
}

с

Q_INVOKABLE void callbackScrollEvent(QString data);

а также

void MainWindow::callbackScrollEvent(QString data)
{
qDebug() << "test" << data;
}

но объект d3.event как пустой:

test "[object Object]"

Есть что-то, что мне не хватает? Я использую Qt 4.8.4, но также использую Qt 5.0.1, проблема все еще присутствует.


d3.js qtwebkit
person user2294119    schedule 19.04.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

В хроме вы можете видеть, что это тоже объект. Но инструмент разработчика Chrome развернется и отобразит структуру этого объекта. Таким образом, «[object Object]» является правильным результатом в вашем коде.

можно попробовать изменить код

function draw() {
    console.log(d3.event);
}

to

function draw() {
    console.log(d3.map(d3.event));
}

Это преобразует объект в карту, ключом являются свойства объекта. Вы можете получить такие результаты, как

u {type: "zoom", scale: 1.1809926614295303, translate: Array[2], sourceEvent: WheelEvent, target: function}

Я не уверен, что вы получите в QtWebKit. Если вы не можете получить желаемое, вы можете отладить/проверить конкретное свойство, выведя его следующим образом:

console.log("type:"+d3.event.type)
console.log("scale:"+d3.event.scale)

ты получишь

type:zoom fiddle.jshell.net:46
scale:1.1809926614295303
person lephix    schedule 19.04.2013
comment
Привет, спасибо за ваш ответ. На самом деле при написании console.log(d3.event.scale) он правильно возвращает число с плавающей запятой в chrome, а при использовании QtWebKit (изменение функции draw() для вызова функции callbackScrollEvent(данные QString) он возвращает NaN. - person user2294119; 19.04.2013
comment
Я предполагаю, что возврат NaN приводит к тому, что компилятор считает, что функция draw() должна возвращать числовое значение. Как вы изменили функцию draw()? Можете ли вы разместить свои коды здесь? - person lephix; 19.04.2013
comment
конечно: в QWebKit я использую функцию draw() { callback.callbackScrollEvent(scale:+d3.event.scale); } - person user2294119; 19.04.2013
comment
поэтому, возможно, вы можете попробовать удалить масштаб: эту строку. - person lephix; 19.04.2013
comment
На самом деле я пытался использовать d3.event.scale и Qt 5.0.1 и работает. - person user2294119; 22.04.2013