render = function (params) { var page = require('webpage').create(), createChart;
var bodyMale = config.SVG_MALE; page.onConsoleMessage = function (msg) { console.log(msg); };
page.onAlert = function (msg) { console.log(msg); };
createChart = function (inputOption, width, height, config) { var counter = 0; function decrementImgCounter() { counter -= 1; if (counter < 1) { console.log(messages.imagesLoaded); } }
function loadScript(varStr, codeStr) { var script = $('<script>').attr('type', 'text/javascript'); script.html('var ' + varStr + ' = ' + codeStr); document.getElementsByTagName("head")[0].appendChild(script[0]); if (window[varStr] !== undefined) { console.log('Echarts.' + varStr + ' has been parsed'); } }
function loadImages() { var images = $('image'), i, img; if (./Assets/images.length > 0) { counter = images.length; for (i = 0; i < images.length; i += 1) { img = new Image(); img.onload = img.onerror = decrementImgCounter; img.src = images[i].getAttribute('href'); } } else { console.log('The images have been loaded'); } } // load opitons if (inputOption != 'undefined') { // parse the options loadScript('options', inputOption); // disable the animation options.animation = false; }
// we render the image, so we need set background to white. $(document.body).css('backgroundColor', 'white'); var container = $("<div>").appendTo(document.body); container.attr('id', 'container'); container.css({ width: width, height: height }); // render the chart var myChart = echarts.init(container[0]); myChart.setOption(options); // load images loadImages(); return myChart.getDataURL(); };
// parse the params page.open("about:blank", function (status) { // inject the dependency js page.injectJs(config.ESL); page.injectJs(config.JQUERY); page.injectJs(config.ECHARTS);
var width = pick(params.width, config.DEFAULT_WIDTH); var height = pick(params.height, config.DEFAULT_HEIGHT);
// create the chart var base64 = page.evaluate(createChart, params.options, width, height, config); //fs.write("base64.txt", base64); // define the clip-rectangle page.clipRect = { top: 0, left: 0, width: width,
height: height }; // render the image page.render(params.outfile); console.log('render complete:' + params.outfile); // exit phantom.exit(); }); }; // get the args var params = parseParams();
// validate the params if (params.options === undefined || params.options.length === 0) { console.log("ERROR: No options or infile found."); usage(); phantom.exit(); } // set the default out file if (params.outfile === undefined) { var tmpDir = fs.workingDirectory + '/tmp'; // exists tmpDir and is it writable? if (!fs.exists(tmpDir)) { try { fs.makeDirectory(tmpDir); } catch (e) { console.log('ERROR: Cannot make tmp directory'); } } params.outfile = tmpDir + "/" + new Date().getTime() + ".png"; }
var option = new ChartOption() { title = new List<Title>() { new Title (){ text=title, left="center"} }, tooltip = new ToolTip(), legend = new Legend() { orient = OrientType.vertical, left = "left" }, series = new object[] { new { name= "Access From", type="pie", data=new object[] { new { value= failedCount, name="异常" }, new { value= passCount, name="正常" }, } } } }
