WHc2png - Documentation

(async) new WHc2png(widthopt, heightopt, scaleopt, optopt, whOptopt) → {Promise}

Description:

轉Highcharts設定檔(含數據)為png圖

Source:

WHc2png.mjs, line 177

Example

function genPlotHtml(fp, b64) {
    let h = `
<html>
    <head></head>
    <body>
        <img style="border:1px dashed #ddd;" src="data:image/png;base64, {b64}">
    </body>
</html>
    `
    h = h.replace('{b64}', b64)
    fs.writeFileSync(fp, h, 'utf8')
}


async function testa() {

    let width = 500
    let height = 400
    let scale = 3
    let opt = {

        title: {
            text: 'Logarithmic axis demo'
        },

        xAxis: {
            tickInterval: 1,
            type: 'logarithmic',
            accessibility: {
                rangeDescription: 'Range: 1 to 10'
            }
        },

        yAxis: {
            type: 'logarithmic',
            minorTickInterval: 0.1,
            accessibility: {
                rangeDescription: 'Range: 0.1 to 1000'
            }
        },

        tooltip: {
            headerFormat: '<b>{series.name}</b><br />',
            pointFormat: 'x = {point.x}, y = {point.y}'
        },

        series: [{
            data: [1, 2, 4, 8, 16, 32, 64, 128, 256, 512],
            pointStart: 1
        }]

    }

    let b64 = await WHc2png(width, height, scale, opt)
    // console.log('b64', b64)

    fs.writeFileSync('./test-scla.b64', b64)
    genPlotHtml('./test-scla.html', b64)

    console.log('finish')
}
testa()
    .catch((err) => {
        console.log(err)
    })

async function testb() {

    let width = 500
    let height = 400
    let scale = 3
    let cOpt = `
    let ds = [1, 2, 4, 8, 16, 32, 64, 128, 256, 512]
    for (let i = 0; i < ds.length; i++) {
        ds[i] = Math.sin(ds[i]/360*Math.PI)
    }
    let opt = {

        title: {
            text: 'Logarithmic axis demo'
        },

        xAxis: {
            tickInterval: 1,
            type: 'logarithmic',
            accessibility: {
                rangeDescription: 'Range: 1 to 10'
            }
        },

        yAxis: {
            type: 'logarithmic',
            minorTickInterval: 0.1,
            accessibility: {
                rangeDescription: 'Range: 0.1 to 1000'
            }
        },

        tooltip: {
            headerFormat: '<b>{series.name}</b><br />',
            pointFormat: 'x = {point.x}, y = {point.y}'
        },

        series: [{
            data: ds,
            pointStart: 1
        }]

    }
    `
    let whOpt = {}

    let b64 = await WHc2png(width, height, scale, cOpt, whOpt)
    // console.log('b64', b64)

    fs.writeFileSync('./test-sclb.b64', b64)
    genPlotHtml('./test-sclb.html', b64)

    console.log('finish')
}
testb()
    .catch((err) => {
        console.log(err)
    })

Parameters:

Name Type Attributes Default Description

width

Number

700

輸入圖片原始寬度數字，單位px，預設700

height

Number

400

輸入圖片原始高度數字，單位px，預設400

scale

Number

3

輸入欲將圖片放大比例數字，單位px，預設3

opt

Object | String

{}

輸入Highcharts設定物件或字串，可給予iife執行程式碼直接回傳Highcharts設定物件，預設{}

whOpt

Object

{}

輸入設定物件，預設{}

Properties

Name	Type	Attributes	Default	Description
`addScripts`	Array	<optional>	`[]`	輸入引用js程式碼網址陣列，預設[]
`addCode`	String	<optional>	`''`	輸入插用js程式碼字串，可提供編譯後函數例如getOpt之iife或umd等格式程式碼，預設''
`executablePath`	String	<optional>	`''`	輸入puppeteer的executablePath字串，預設''
`executableFolder`	String	<optional>	`''`	輸入不提供executablePath時則提供搜索chrome.exe所在資料夾字串，找到後將自動給予puppeteer的executablePath，預設''

Returns:

回傳Promise，resolve為回傳base64圖片，reject為錯誤訊息

Type: Promise